I have been playing around with a little weekend project the last couple of days. I wanted to create a minimal url shortener that can be entirely hosted on GitHub pages. So this is what it looks like: We got three buttons, one for long url's, one for shorturl's and an about-page (not linked to Github).
The idea came up after reading the post "A GitHub Pages URL Shortener", where you will find most of my inspiration.
However there are two major differences between his project and mine; Firstly his script generates dynamic markdown urls, whereas I decided to go static (where gh-pages serves all contents statically from gh-pages branch). The second difference has to do with how github pages works, where you do not have a public folder, but rather everything that is on gh-pages branch of your repo gets served by Github. So I changed the script so it will put all files in a new gh-pages branch and symlink to the old branch so there is no change in the structure of the repo.
To create a short url simply click on one of them and copy paste the resulting url into your browser bar - voila!
The relevant part from my project's readme file:
In order to get this simple up and running on GitHub pages, you have to first create a static web site on GitHub pages. For this follow these simple steps.
1) Fork my gh-pages-url-shortener project on GitHub, the fork should be created on your own account.
2) Clone that repository with Git or Mercurial into your computer.
3) cd into folder of cloned repo
4) Edit index.php file of cloned repo with desired short URLs structure (e.g abcdef -> http://YOURGITHUBUSERNAME.github.io/gh-pages-url-shortener/abcdef/)
5) git commit, git push origin master - then wait until Github builds it you :)
6) Now you should see the changes on your Github Pages URL (http://YOURGITHUBUSERNAME.github.io/gh-pages-url-shortener/) homepage.
Done! Note that this project is made for GitHub pages to work, so if you are not using it (and do not plan) maybe its better to use the other script because it works with other static web site generators as well.
Thank you for reading! All feedback is always welcome :)
#ADDED BY OWNER ON 21:38 GMT+1 - 20141005 * Added link to the original article * Reordered list of steps / reformatted code / added extra notes at top of article * Removed some 'just in case' text.
* Improved the list of steps for easier understanding. * Added explanation to why the Github side project is recommended instead. * Added picture for clarity reasons. * Changed the link to the github side project, so it is now clickable.
* Removed an unneeded <!-- --> closing tag. * Changed 'http://' to 'https://' in links - because ghpages defaults to this protocol. * Changed jekyll-redirect-from plugin name (no need for template tags) * Removed download link (was already mentioned twice above). * Replaced jekyll with jekyll serve (a lot easier to understand for new comers).
* Updated code formatting to use markdown code blocks instead of HTML pre tags (simpler and more elegant). * Added alternative if .htaccess file cannot be edited (for Apache servers). * Added verbose conditional for Github pages (only show if on gh-pages branch) * Removed mention of .git folder, as it is only present when using CD command.
* Added information on what to do if Github pages cannot be setup (use the other script). * Added more detail on how this works. * Tried to add some humor (I hope it fits well with my usual writing style). * Changed wording from "is hosted" to "can be hosted".
Top Blog Posts
- Best URL Shortener: Why You Should Shorten Your Links 7 months ago
- Learn HTML in 12 Minutes 10 months ago
- FOCUS ON YOURSELF NOT OTHERS - Best Motivational Speech 2021 11 months ago
- British English Slang [Advanced Pronunciation Practice] - Reductions & Contractions 11 months ago
- How To Build Your URL Short System (Premium URL Shortening Setup) 11 months ago