This is a boilerplate to use with the Harp Platform and Harp SSG (the open source Static Site Generator)
- Harp Rules?
- How to use it?
- Controlling your content
- Adding new posts
- Adding new pages
- Migrating from different platforms
- TODOs
- Support
- License
- No configuration required.
publicdirectory is required.publicdirectory maps to URLs.- Files will only be served if they are in the
publicdirectory. - Files with extension
.less,.sass,.scss,.styl,.coffee, and.jadewill be compiled to their respective output formats. - Mime type may be specified with additional namespace in file name.
- Files that start with underscore are ignored by server.
- Files named
_data.jsonmake data available to templates.
To learn more about Harp, check out the Harp handbook
- Login/Signup to the Harp Platform
- Create a new application
- Choose "Blog Boilerplate" as your starting point
- Start your application
- Open and edit the files in your Dropbox
- Install Harp SSG on your computer
- Open your terminal and start a new project:
$ git clone [email protected]:jorgepedret/hbp-blog.git my-blog
$ cd my-blog
$ harp -s
Go to http://localhost:8001 from your browser to see your website.
Harp brings you back to the basics of the web. Always keep in mind that your directory structure and file names are your URL paths.
What that means is that creating a new page is as simple as creating a new file a throwing some content in it.
This is where your posts and their content live.
Indicates the layout of your site, including header, footer and sidebar. External scripts or stylesheets are included in this file. Global elements belong here as well (i.e.: header, nav, sidebar, etc.)
This is the default page when you visit your domain (i.e.: http://localhost:8001/). Here we build the loop that goes through your posts and shows them in the front page.
Content for the sidebar.
Twitter Bootstrap files. This blog boilerplate was built so you can simply replace the public/bootstrap directory whenever you want to upgrade to a new version of Twitter Bootstrap.
You shouldn't modify this directories unless you want to upgrade or downgrade the library.
FontAwesome files. Same as Twitter Boostrap, this blog boilerplate was built so you can simply replace the public/fontawesome directory with a newer or older version of FontAwesome.
You shouldn't modify this directories unless you want to upgrade or downgrade the library.
This is the place where your custom css, js and images should live.
1. Create a new jade or html file under public/posts/
touch public/posts/hello-world.html
2. Enter your post content in the file you just created
<!-- file: public/posts/hello-world.html -->
<h1>Hello World!</h1>
<p>This is my first post using Harp!</p>
3. Open public/_data.json and add your new post data
{
"posts": {
"hello-world": {
"type": "post",
"date": {
"day": "18",
"month": "feb",
"year": "2013"
}
}
...
}
}
1. Create a new file in public (actually, it can be anywhere you want)
touch public/about.html
2. Enter the page content in the newly created file
<!-- file: public/about.html -->
<h1>About me</h1>
<p>I love the fotoshopz and taking pictures of foods</p>
3. Your can now access your page in the browser. I.e.: http://localhost:8001/about
I'm currently working on a migration tool for WordPress called wp2static.
I created it in a couple of hours, so it's by no means a finished tool, but it'll get you half way there.
TODO
- Integrate discuss for comments
- Create sitemap.xml for improving SEO
Please create an issue on github's bug tracker. Feedback and bug reports are greatily appreciated.
MIT