Want to take your software engineering career to the next level? Join the mailing list for career tips & advice Click here


Make a blog rendering for hackpad

Subscribe to updates I use Hack-the-Hackpad

Statistics on Hack-the-Hackpad

Number of watchers on Github 57
Number of open issues 3
Average time to close an issue 1 day
Main language CSS
Average time to merge a PR less than a minute
Open pull requests 0+
Closed pull requests 0+
Last commit over 5 years ago
Repo Created over 5 years ago
Repo Last Updated about 3 years ago
Size 954 KB
Homepage http://wentin.git...
Organization / Authorwentin
Latest Release1.0.0
Page Updated
Do you use Hack-the-Hackpad? Leave a review!
View open issues (3)
View Hack-the-Hackpad activity
View on github
Book a Mock Interview With Me (Silicon Valley Engineering Leader, 100s of interviews conducted)
Software engineers: It's time to get promoted. Starting NOW! Subscribe to my mailing list and I will equip you with tools, tips and actionable advice to grow in your career.
Evaluating Hack-the-Hackpad for your project? Score Explanation
Commits Score (?)
Issues & PR Score (?)

Hack the Hackpad


How to use guide (wriiten with hackpad, rendered by Hack the Hackpad):


http://wentin.github.io/Hack-the-Hackpad/# + padId

What is Hack the Hackpad?

Hack the Hackpad is a hack to transform hackpad to a blog CMS, and enable hackpad users to use hackpad to write and publish blog articles and provide its readers a better reading experience.

The project is crafted by a type nerd who cares profoundly about web typography. Every design detail is brought to you with extra love and care. My goal is to make this project grow to be a competitor of blog platforms like medium. Currently it is a proof of concept hack that I put together over Christmas long holiday. More to come!

Hackpad is an awesome collaborative writing platform that has many advantages like markdown syntax support: type # and a space to make a h1 instantly, ## to h2, ### to h3; type space four times to enter code snippet; type // to enter comment.

How to use it?

If you dont have hackpad account, I highly encourage you to sign up. Hackpad provides an effortless way to write. Want to check it out without a hackpad account? You can click on the gear button on homepage with empty input field to see an example page containing all elements like list, quote, code blocks, table, h1, h2, h3, p.

If you are a hackpad user, you now can use hackpad to write and publish blog articles with great reading experience!

  1. Go to your pad on hackpad and copy your padId (the 11 character at the end of the pad URL).
  2. Click the Hack the Hackpad logo and go to the homepage, paste the padId in the input field in the homepage.
  3. Click the gear button to generate the blog article page.
  4. Enjoy your article in much better reading experience!
  5. If you want to edit the article, click the pen icon on your top right and edit the article on hackpad. The changes go live the moment you make it on hackpad.
For example, the how to use articles hackpads url is http://hackpad.com/How-to-use-HackBlog-JVgfJHOyu6O, the padId is JVgfJHOyu6

Tricky part: sometimes you need to hit the refresh button again if browser back button or changing the url in address bar doesnt immediately load the correct content. Also currently it only supports the articles written in the default hackpad workspace.

Example URL:




Hack the Hackpad is a passion project. It thrives on your feedback and support. If you like Hack the Hackpad, please star my project on Github; if you have feedback, please contact me.


Hack-the-Hackpad open issues Ask a question     (View All Issues)
  • over 5 years scroll back up issue when page is too short on mousewheel
  • over 5 years Add an Open Source backend
  • over 5 years recognize heading2, and differentiate from the strong in paragraph
Hack-the-Hackpad list of languages used
Other projects in CSS
Powered by Autocode - Instant Webhooks, Scripts and APIs
Autocode logo wordmark