/ WEB DEVELOPMENT

Who Needs WordPress Anyway?

WordPress was once an amazing publishing platform. Built with the most popular technological trio (PHP, MySQL and Apache Web Server), it quickly became the easiest and the quickest way to get your blog up and running in no time. WordPress was bragging about its no-brainer installation process, and maybe it still does. I don’t know. I’m not using WordPress anymore because I don’t need to.

WordPress is not only popular, it’s also a huge business if you think about all those premium templates, plugins, certified web hosting plans, managing services and so on.

On top of that, there’s still this strange feeling floating around the blogosphere that if you really want to run a successful online business, you need to run your own blog built with WordPress.

I got caught in this trap as well. Hell, I even recommended a WordPress-based blog for anyone starting building their online presence in my THE DIGITAL INSTRUCTOR book! I was so blind, so unaware of the fact that the technology is moving so fast. I thought there was no better alternative. I paid for a web hosting service, I bought Avada theme and spent a lot of time trying to make it look the right way.

Yet, I still wasn’t happy with the results so I tried some pretty expensive frameworks like Genesis and PageLines and spent even more time to make my personal website look amazing.

Then I bought some plugins to get some more features for my website. Of course, more plugins meant lower performance, because they were not made by the same people, so most of the time they didn’t get along very well with each other.

The loading times of my website got very long, so I bought some more plugins for optimizing the speed of my WordPress installation. Also, I needed to take care of security, since WordPress is a very rewarding target for all sorts of hackers, so I bought some security plugins as well.

As you can see, there’s indeed a huge business around WordPress. A business which wouldn’t even exist without WordPress.

After some more headaches, I realized I could run my website and my blog totally for free without spending a dime (with the only exception for my domain zavrel.net which costs less than a regular Starbuck coffee anyway).

So What Did I Do?

I believe a lot of people start thinking about their website by defining what it should be available to do. Usually, they need some static content for presenting their business and some dynamic capabilities for blogging. That’s where they usually jump the WordPress train because it offers both features in one neatly wrapped package.

The point is, that you don’t need these capabilities in one package. You can use multiple services and platforms. Nobody really cares where you have your content stored or what technology you use as long as the content itself is worth reading or watching. People tend to use a special URL address for their blogs anyway. That’s what I did when I stopped using WordPress, I made my blog posts available at blog.zavrel.net and my static presentation of my work at www.zavrel.net.

This setup no longer forces me to use one solution. I can use one solution for static website and another one for blogging.

Static Website

I canceled the expensive WordPress-certified web hosting and created the static website published as a GitHub page. GitHub Pages is an amazing service offered for free by GitHub. You can upload any static content you want and make it available either on the github.com domain with your account name in front of it (like zavrelj.github.com in my case) or you can even use your own domain for free (like www.zavrel.net in my case). I definitely recommend the second option.

Static websites load blazingly fast compared to any WordPress solution because there are no moving parts. You don’t need to generate the content from the database, you don’t have to cache it to make it deliver faster.

If you think about it, the most of your content is probably static anyway. It sits on your WordPress page without any changes for months or maybe even years! In such case, there’s really no reason to pay the performance penalty for using WordPress instead of a static website published on GitHub. The fact that this solution is available for free is just a nice bonus. You should consider it primarily for the speed of the website, not because you save some money, but that won’t hurt either.

In other words, even with all the money in the world, you’ll have a hard time finding anything based on WordPress solution that is faster than a static website which is available for free. That’s crazy, right?

Some of you might argue, that running a static website needs a lot of knowledge. That there’s a steep learning curve and that using WordPress is easier to learn. Granted, you can’t do much without HTML and CSS knowledge, but on the other hand, there are plenty of templates (usually built on Bootstrap) which you can choose from. Yes, if you want to make it more personal, you will have to get your hands dirty and write (or at least modify) some code.

But isn’t it better to understand your content and be able to make modifications as you need instead of paying for WordPress plugins just to change some pretty basic stuff?

A static website is faster, static web hosting is for free and you have the total power over your content. I guess there’s no reason to stick with WordPress for static presentation unless you actually change your bio, list of projects and contact information more than once a week, which I strongly doubt. And even if you do, once you understand HTML, it’s probably even faster to do it manually on a static website than via the form on WordPress.

If you want to give it a try, but have absolutely no idea where to start, take this free course on Udemy (https://www.udemy.com/create-free-fast-and-secure-static-website/) where I explain everything step by step.

Blogging Platform

Ok, now that we have a static content sorted out, let’s move to the blogging platform. What if I tell you, that even for blogging, you don’t need to use WordPress, that you can have a solution which is way faster and absolutely free of charge as well?

There’s something called static website generator, which will in a nutshell just take your content and make it into a static website while you just write your posts and the rest is on autopilot.

I can almost hear some of you screaming that Jekyll, Hugo, and other generators aren’t for the faint of heart and I completely agree. I tried this technology few years ago and I abandoned this approach because when I want to write, I just want to focus on the content, not to all the steps I need to take from the draft to the final published article.

But that changed! These days, you can use the solution which works very similar from the writer’s perspective as Medium publishing platform. It looks sexy and it feels great when writing your post.

Want a proof? Here’s the proof:

Lo and behold! This is Forestry!

Forestry is a game changer. It’s a static CMS for websites built using static site generators. If you ever wanted to have all the advantages of a static website like the speed and the security, but have been held back by the complexity of content creation process, this is the solution for you.

Here are some key reasons why I believe it’s worth your time to give it a shot.

Static CMS gives you the best of everything:

  • total control over your content
  • blazingly fast loading times
  • extremely secure
  • your own domain with free SSL certificate
  • free hosting

If you choose a regular database-driven CMS like WordPress or Ghost:

  • you will have to pay for hosting services
  • or you will have to pay for using your domain
  • or both
  • loading times will be considerably slower
  • you will have to take care of security because hackers just love these database-driven platforms

If you choose a third-party service like Medium

  • you won’t own your content
  • you won’t be able to modify the look and feel
  • you won’t be able to even use your own domain anymore

If you choose a plain static site generators

  • you will have to learn Jekyll or Hugo
  • you will have to install stuff on your computer and generate your static pages manually

Forestry CMS grabs your repository from GitHub and make it into your private Medium platform. When you create or edit the post in Forestry, it regenerates your website and publishes it to your GitHub repository. It’s almost magical and it can’t get any simpler.

I’m in! Show me how!

I’m positive that this solution is the best possible interplay between two free services, GitHub.com and Forestry.ioDid I mention that Forestry is for free?

Yes, behind the scenes, it is based on Jekyll and it works as a static website, but that’s something you don’t have to care about unless you really want to.

GitHub

  1. Create a free account at www.github.com
  2. Clone the https://github.com/zavrelj/jasper2 repository (repo), which is a slightly modified version of Jasper2 theme by Jekyller, an amazing port of Ghost’s default theme (forking won’t work because you won’t be able to use it with your own domain as GitHub page). The easiest way is to copy the link above and place it to the https://github.com/new/import form. Then, set the name of your repo and select if it’s private or public (for private repos you’ll need a paid account unless you’re a student).
  3. Edit the _config.yml file in the master branch of your copied repo and change the title and the description of the website, also, you should update the social info section and optionally turn on Disqus feature.
  4. Update the CNAME file with your domain name in the master branch of your copied repo.
  5. Make sure that the CNAME points to your GitHub address in your domain DNS setup
  6. Go to the gh-pages branch and set your own domain pointing to the name you set in CNAME file

Forestry

  1. Create a free account at www.forestry.io
  2. Add Site and select Jekyll generator.
  3. Select GitHub provider and pick your copied repo from the list, for the private repo, you will need to grant access first.
  4. Once your repo is imported, go to Settings -> Hosting and select Github Pages from the list, select your copied repo and then select the gh-pagesbranch.

When you need to make some more changes to the _config.yml file, you will need to wait until Forestry imports the current version of your repo and then you will have to regenerate the website by republishing any existing post.

Some more notes and facts you need to know about

Using your own domain

Make sure to create CNAME file with your domain name in the master branch of your copied repo, if you create it only in the gh-pages branch, it will be deleted with the next deployment.

To develop your site locally, you will need to:

  1. Download and install Jekyll (www.jekyllrb.com),
  2. clone your copied repo to your local directory,
  3. in the _config.yml file, set the destination folder (line 73) to your own directory of choice, this is where your site will be stored,
  4. run bundle exec jekyll serve from Terminal,
  5. navigate to localhost:4000 in your web browser.

To modify CSS style:

  1. Run npm install from Terminal,
  2. run sudo npm install -g gulp-cli from Terminal,
  3. now you can edit files in the /assets/css/ folder which will be compiled to the /assets/built/ folder automatically,
  4. after each modification of CSS just run gulp from Terminal, it will take a look at the gulpfile.js file and compile your CSS files.

Assets location:

  1. By default, images are located in the /assets/images/ folder,
  2. I suggest you use the /uploads folder instead and keep the assets/images/ folder for the theme-related stuff only,
  3. for the sake of your own sanity, make sure to name your images properly, like post-slug-img01.png and so on,
  4. you need to modify settings in Forestry to set the /uploads folder:

Cover images for posts:

I suggest you use at least 720p resolution (1280x720px) for your cover images so they look great even on bigger screens.

Front matter for posts:

You need to create Front matter which is the form of a head for posts, it includes:

  1. LAYOUT = post
  2. CURRENT = post
  3. COVER
  4. NAVIGATION = toggle ON
  5. TITLE
  6. DATE
  7. TAGS = tags field
  8. CLASS = post-template
  9. SUBCLASS = post tag-name-of-the-tag
  10. AUTHOR = name-of-the-author
  11. Template name will be POST

Once you have your Front matter defined, you can create a new post by selecting Post from the list of Front matter templates.

Tags and authors

Tags and authors are read from the _data/tags.yml and _data/authors.ymlfiles, so if you want a new content, you need to add it to these files. Actually, this applies to authors only, because Forestry can handle tags in its own way. When you type a new tag to the front matter of the post, it will be added for you automatically.

Footer

Modify the footer of the website in the _layouts/default.html file.

Settings and layout changes

You have two options:

  1. you can make those changes directly in the master branch of your repo via GitHub web interface
  2. you can clone your repo to your local directory and sync those changes back to the remote location with GitHub Desktop or via Terminal

In either case, whenever there’s a modification in the master branch of the repo, Forestry will import the modified repo automatically and almost immediately. But this won’t regenerate the website stored in the gh-pagesbrach.

In order to regenerate the gh-pages branch, you need to make some changes, or simply republish some post without any changes. Forestry simply needs some trigger to regenerate the website.

Production workflow

  1. Write a new post in Forestry
  2. Publish it
  3. Forestry will regenerate the website in the gh-pages branch
  4. Done

Conclusion

Alright! By now, you should have your own static blog up and running with all the benefits of static website. If you didn’t get through and you’re stuck, don’t hesitate to connect with me and I will do my best to walk you through the whole process.

zavrelj

Jan Zavrel

Infopreneur, Evernote Certified Consultant, iOS & Web Developer, Author, Teacher, Lifelong Learner

Read More