/.git/
/WP/
/home/
/test/
/bk/
/shop/
/back/
/new/
/backup/
/demo/
/blog/
/old/
/wordpress/
/wp/
/xmlrpc.php
/jonalproducts
/plugins/system/debug/debug.xml
/administrator/help/en-GB/toc.json
/wp-includes/ID3/license.txt
/administrator/language/en-GB/en-GB.xml
/wp-includes/js/jquery/jquery-migrate.min.js
/admin/index.php?route=common%2Flogin
/admin/login.php
/admin/
/administrator/index.php
/?q=user%2Flogin
/_profiler/empty/search/results
/wp-22.php?sfilecontent=%3C%3F%3D409723*20%3B&sfilename=on.php&supfiles=on.php
/2index.php
/admin.php
/wikindex.php
/alfacgiapi/perl.alfa
/ALFA_DATA/alfacgiapi/perl.alfa
/wp-login.php
/index.php%3F-dsafe_mode%253DOff+-ddisable_functions%253DNULL+-dallow_url_fopen%253DOn+-dallow_url_include%253DOn+-dauto_prepend_file%253Dhttp%253A%252F%252Fwww.peruibe2.sp.gov.br%252Fscriptcase%252Ftmp%252Fsc_0382118%252Fdefault.txt=
/.git/config
/.env
Disqus is well known but cluttered and riddled with ads. commento mirror my needs the closest but does not offer free options. The self-host option uses sql database which is not my preference. Others offer free tier but are too glitter for my taste. Hosting comments in Github is way too much friction for my liking.
At the end I finally took the time to make one myself.
Introducing opino, it comes from the word opine, but instead of e
it’s o
. And it may be the simplest way to add commenting to your page, be it a static site or CMS.
Anyone who value data privacy, tinker open source projects, wants zero friction in submitting comment, or appreciate simplicity.
If you prefer to let someone host the comments, or DIY it by hooking it up to your own REST API backend service for comment database.
I intend to make it free forever by offering a free tier. There might be a paid plan in the future if we start to see some heavy duty user using this service.
]]>If you have a bunch of html files in a repo, if would be useful if the index page display a list of html files contained inside the repository. So when user visit your repository home page, it will have a quick overview of the html files available.
However it is troublesome to edit home page (index.html) manually each time you make changes to one of the html files.
Here is how to automate it. It uses existing Jekyll, no other dependencies.
1. Enable GitHub page and choose a theme. Doing so will generate a _config.yml on your directory.
2. Git pull it to sync the files. Now add the following code to index.md or index.html.
{% assign doclist = site.pages | sort: 'url' %}
<ul>
{% for doc in doclist %}
{% if doc.name contains '.md' or doc.name contains '.html' %}
<li><a href="{{ site.baseurl }}{{ doc.url }}">{{ doc.url }}</a></li>
{% endif %}
{% endfor %}
</ul>
3. Commit and push it to GitHub, and you should see an updated directory listing on index page every time you commit.
It can’t detect .html file if it doesn’t have the front matter inside. There are two ways to remedy it:
For each .html file, put ------
before the <html> tag.
------
will still appear in the repo.Change all .html file to .md extension so it become a markdown file. Next time when you git push the repo, GitHub’s Jekyll builder will automatically convert all md file (except README.md) to html, and populate the list on the repo automatically. Yay!
------
needed._layout/default.html
to wrap your file code, so your <head>
information will go missing.You can’t track other file format aside from markdown.
Useful reference:
]]>1. Read the original guide first. CMS Netlify provide a lot of useful informations for you to get started, but it focused on GitHub users. This guide however show you from a bitbucket user perspective.
2. Make sure you already have your Netlify hooked to your bitbucket account. As in you can remotely push your local repository to bitbucket, and Netlify will automatically have your site build and deploy. If you have complete this step, move on!
3. Create a folder called "admin" in your jekyll directory, then create two files inside the "admin" folder, namely "index.html" and "config.yml".
4. Get the index.html code from https://www.netlifycms.org/docs/add-to-your-site/.
5. For the config.yml, paste the code below.
backend:
name: git-gateway
branch: master # Branch to update (optional; defaults to master)
# This line should *not* be indented
media_folder: "images/uploads" # Media files will be stored in the repo under images/uploads
collections:
- name: "post" # Used in routes, e.g., /admin/collections/blog
label: "post" # Used in the UI
folder: "_posts" # The path to the folder where the documents are stored
create: true # Allow users to create new documents in this collection
slug: "---" # Filename template, e.g., YYYY-MM-DD-title.md
fields: # The fields for each document, usually in front matter
- {label: "Layout", name: "layout", widget: "hidden", default: "post"}
- {label: "Title", name: "title", widget: "string"}
- {label: "Date", name: "date", widget: "date"}
- {label: "Permalink", name: "permalink", widget: "string"}
- {label: "Body", name: "body", widget: "markdown"}
A few things to note here, title label is extremely important, without it the CMS won’t work. Permalink label is there because when you change the title, the permalink won’t automatically update itself, hence the need to include it. Date label is there for convenient editing.
6. Now enable identity in your Netlify dashboard. Press invite users, and invite yourself. Go to your email inbox and click on the confirmation link. Walah! You're now a user.
7. Next go to settings, Access control, OAuth, and install provider. Choose bitbucket, it will ask you for secret and client id.
8. To get the two values, go to bitbucket, click on your profile and choose bitbucket settings. Under access management, click OAuth, add a consumer.
For bare minimum, fill up the name, callback url (obtain from https://www.netlify.com/docs/authentication-providers/#using-an-authentication-provider), tick “this is a private consumer”, tick read and write in repository. Shazam! you got yourself the two values. Fill it up at the Netlify dashboard panel.
9. Go to your website (example.com/admin), login with your bitbucket account, grant it permission. And you should have access to the CMS!
10. Congratulation, you've build yourself a little wordpress. Without any database!
I ended up not using the CMS, because when I edit the title, the file name remained the same. A small annoyance some would say, but it turns out I can’t live with that. The OCD within me got the best of me sadly.
]]>Here is a quickfix.
Create a bookmark link in the bookmark toolbar, and enter the following in the URL field.
javascript:(function()%7Bvar%20str%20%3D%20document.getElementsByTagName('html')%5B0%5D.innerHTML%3Bvar%20w%3Bif%20(str.includes(%22blogId%22))%20%7Bvar%20v%20%3D%20str.split(%22blogId'%3A%20'%22)%5B1%5D%3Bw%20%3D%20v.substring(0%2C%20v.indexOf(%22'%2C%20'%22))%3B%7Dif%20(str.includes(%22postId%22))%20%7Bvar%20r%20%3D%20str.split(%22postId'%3A%20'%22)%5B1%5D%3Bvar%20z%20%3D%20r.substring(0%2C%20r.indexOf(%22'%2C%20'%22))%3Bvar%20url%20%3D%20%22https%3A%2F%2Fwww.blogger.com%2Fblogger.g%3FblogID%3D%22%20%2B%20w%20%2B%20%22%23editor%2Ftarget%3Dpost%3BpostID%3D%22%20%2B%20z%3Bwindow.open(url%2C'_blank')%3B%7Delse%20if%20(str.includes(%22pageId%22))%20%7Bvar%20k%20%3D%20str.split(%22pageId'%3A%20'%22)%5B1%5D%3Bvar%20b%20%3D%20k.substring(0%2C%20k.indexOf(%22'%2C%20'%22))%3Burla%20%3D%20%22https%3A%2F%2Fwww.blogger.com%2Fblogger.g%3FblogID%3D%22%20%2B%20w%20%2B%20%22%23editor%2Ftarget%3Dpage%3BpageID%3D%22%20%2B%20b%3Bwindow.open(urla%2C'_blank')%3B%7D%7D)()
To use it, go to the page/post that you want to edit, then press the bookmarklet, the online text editor should pop up in another tab.
If you want to compiled the javascript code yourself into a booklet, below is the source code:
<script>
function onclicka() {
var str = document.getElementsByTagName('html')[0].innerHTML;
var w;
var urla = window.location.href
if (urla.includes("blog.cl.mt")) {
var v = str.split("targetBlogID=")[1];
w = v.substring(0, v.indexOf("&"));
}
if (urla.includes("blog.cl.mt/p/")) {
var k = str.split("static_page', 'pageId': '")[1];
var b = k.substring(0, k.indexOf("', '"));
urla = "https://www.blogger.com/blogger.g?blogID=" + w + "#editor/target=page;pageID=" + b;
window.open(urla, '_blank');
}else if (urla.includes("blog.cl.mt/2")) {
var r = str.split("postId': '")[1];
var z = r.substring(0, r.indexOf("', '"));
var url = "https://www.blogger.com/blogger.g?blogID=" + w + "#editor/target=post;postID=" + z;
window.open(url, '_blank');
}
}
</script>
<a class="" onclick="onclicka()">Click me</a>
I learned about Jekyll years ago, but lacked the time or commitment to learn about this amazing tool. But now that I have, it is so amazing!
It may be slightly inconvenient to update or publish new materials, or even doing slight editing adjustments, but if you treat this as updating a piece of software, it’ll feel much better.
Now that this website is live, there are a few things I would like to take note, including a few cheat sheets below that helps me to get started:
A few essential commands in running this git-bitbucket-netlify combination.
<name>
<url>
<name>
are usually origin.<url>
usually end with../folder.git
If you want to do single line break, Use two spaces to end a line. For paragraph break, css formatting is done.
Oh my, I still have a lot to learn about this.
https://learn.cloudcannon.com/jekyll-cheat-sheet/
I just leave the link above as a bookmark here, will refer to it when customising this site. Every time something site wide is done, run bundle exec jekyll serve
Oh, before publishing the site, don’t forget to get it w3 validated.
Special thanks to these people who inspired me:
2021 edit: Fixed some grammar mistakes.