You’ll create virtually any form of web page you wish to have the use of WordPress. On the other hand, you’ll be able to’t use it to construct easy static HTML web sites. In some instances, that’s all you wish to have, and you will finally end up desiring to make use of some other platform to succeed in it.

Thankfully, there’s little or no you’ll be able to’t do with WordPress plugins. On this article, we’ll speak about when it is sensible to make use of easy static WordPress pages. We’ll additionally introduce you to a plugin that allows you to generate static WordPress pages and speak about how you can host them.

Let’s move!

Why You Would possibly Need to Use a Easy Static Site

Sooner than we dive to any extent further, let’s speak about what static pages are. We are saying a web page is ‘static’ when it doesn’t load any dynamic content material and it’s made up of handiest HTML, CSS, and doubtlessly some JavaScript. In numerous instances, other folks affiliate static pages with overly easy designs, however you’ll be able to do so much simply with HTML and CSS.

WordPress, against this, handiest generates dynamic pages, regardless of how easy your designs are. As an example, via default your newest posts are featured to your homepage. To reach this, it makes use of one thing referred to as the WordPress ‘loop’. The loop appears to be like for the newest posts you revealed and lists them in chronological order:

The WordPress loop in action.

The truth that WordPress handiest generates dynamic pages isn’t a drawback. Some distance from it, because it allows you to create virtually any form of web site you wish to have, from easy to advanced tasks. On the other hand, there are instances whilst you would possibly wish to use easy static pages as a substitute. As an example:

  • It may be higher for safety functions. With static pages, your server doesn’t want to ‘render’ your web site every time any individual visits it. As an alternative, it simply sends them easy HTML and CSS, so it’s more difficult to take advantage of your web page.
  • Static pages have a tendency to be sooner. Static pages most often load sooner since your server doesn’t want to generate them at the fly.
  • They’re much less susceptible to mistakes. WordPress may be very user-friendly, however errors can still occur. With static pages, these kinds of, akin to database connection mistakes, received’t be an issue.

Whilst static pages have transparent advantages, it’s no accident the internet is frequently shifting against increasingly websites the use of Content material Control Techniques (CMS) as a substitute of creating pages from scratch. It’s because dynamic pages assist you put into effect many extra complex options.

Let’s take a look at a handy guide a rough instance. With a static weblog, you’d want to replace your homepage each and every time you create a put up. That suggests including a brand new blurb, featured symbol, and extra for each and every unmarried replace. WordPress, alternatively, does all that heavy lifting within the background due to the loop.

On the other hand, if you wish to arrange a web page you received’t want to replace frequently, static pages will paintings nice. Likewise, websites with quite simple capability, akin to small portfolios or on-line archives, could be at an advantage with a static manner.

The disadvantage is you normally wouldn’t have the ability to use WordPress to create the ones websites. With Divi, it could take you only some hours to arrange a certified having a look web page with a few pages. On the other hand, they wouldn’t be static. Thankfully, there’s a plugin that may lend a hand.

Introducing the WP Static HTML Output Plugin

The WP Static HTML Output plugin.

The WP Static HTML Output plugin has been round for some time, and for excellent explanation why. This plugin allows you to generate absolutely static copies of all your WordPress web page and to deploy them to different platforms.

On best of remodeling your WordPress pages into static copies, the plugin too can exchange all its interior hyperlinks. In follow, this allows you to use WordPress to create your web page in an area take a look at setting, after which deploy it to your website hosting platform of selection.

WP Static HTML Output additionally packs your entire media recordsdata whilst you export your web page. You’ll additionally use it to retailer a previous reproduction of your web site as a backup.

On the other hand, be mindful it’ll run into hassle for those who attempt to use it to duplicate dynamic options, akin to feedback sections, log-in paperwork, and extra. Most often talking, if there’s capability to your web site that calls for consumer enter or might be thought to be dynamic, it received’t paintings whilst you translate it right into a static web page, so endure that during thoughts whilst taking into account whether or not to make use of the plugin.

Key Options:

  • Create absolutely static copies of all your WordPress web page.
  • Export your content material along your entire media recordsdata.
  • Exchange your entire interior hyperlinks so you’ll be able to deploy your static WordPress pages to a are living setting.
  • Retailer copies of previous exports as backups.
  • Rewrite the trails to your WordPress content material to cover the reality your web page makes use of the platform.

Value: Unfastened, with a top class model to be had | More Information

How one can Generate a Static HTML Reproduction of Your WordPress Site (And Host It The usage of GitHub)

On this segment, we’re going to turn you how you can deploy your static WordPress pages to GitHub. GitHub allows you to host static pages for free, which makes it a tight choice if you wish to use it as a no-frills host for static pages.

Step #1: Generate a Static HTML Reproduction of Your Web page

For this step, we’re going to make use of the WP Static HTML Output plugin that we presented previous. Pass forward and install and activate it to your web page now. As soon as that’s finished, move to the Gear > WP Static HTML Output tab to your web site.

Sooner than you generate a static reproduction of your web site, let’s move over a couple of settings the plugin gives. First off, you’ll see an method to state the URL you plan to make use of to your web site as soon as it is going are living. Bear in mind, your static pages received’t show correctly until you input the right kind URL right here since your pages received’t have the ability to pull the CSS they require to seem beautiful:

Setting the URL for your static website.

This atmosphere will take your entire interior hyperlinks and exchange them with the URL you place. Previous, we mentioned how you’ll be able to use this option to create websites in the neighborhood and deploy them in a are living setting. As such, you may want to take a look at our tips about how to make a choice the perfect domain name.

Shifting on, you’ll be able to permit settings to export your web page as a zip record, which you’ll be able to obtain out of your dashboard. Differently, the plugin will simply export your new recordsdata to the wp-content/uploads/ listing. Right here you’ll be able to see that listing with a few complete exports of our web site. You’ll additionally select whether or not you wish to have to retain the remaining export you create, to make use of as a backup:

Configuring your site's export settings.

If you wish to exchange the folder to which the plugin exports your pages, you’ll be able to accomplish that beneath the Override Output Listing segment:

Overriding your export's output directory.

In the end, there are alternatives to switch your default WordPress paths with names of your opting for. The theory is to difficult to understand the reality your web site was once constructed with WordPress:

Obscuring your WordPress settings.

Whether or not to make use of this option is as much as you because it received’t have an effect on your exported web page’s capability by any means. When you’re able to create static copies of your WordPress pages, click on at the Get started static web site export button:

Starting to export your static website.

The plugin will do its factor now and you’ll be able to observe its growth in the course of the Export Log on the backside of the tab:

Your export log.

As soon as the method is completed, you must see a line throughout the Export Log close to the very best that claims ZIP CREATED together with a hyperlink to its proper:

Downloading your static website as a ZIP file.

In case you reproduction and paste that hyperlink to your navigation bar, you’ll have the ability to obtain a static reproduction of your web page at once, so that you don’t need to use FTP. Upon getting your static web site, it’s time to check and submit it.

Step #2: Add Your Static Site to GitHub

At this level, you’ll have the entire static recordsdata comprised of your WordPress web page. It’s now time to seek out someplace to host them, so you’ll be able to test in the event that they’re running as supposed.

Let’s do that the use of GitHub, which allows you to arrange easy static pages via repositories. In case you haven’t used GitHub prior to, or want a reminder, here’s a quick guide to get you began with the platform.

When you’ve arrange a GitHub account, you’ll want to create a brand new repository. Sort an outline if you wish to and go away your repository set to Public, then click on the Create repository button:

Creating a new repository.

As soon as your repository is able, you wish to have to add your WordPress recordsdata to it. For this, you’ll be able to use the command line for those who’re aware of git model keep watch over or use GitHub’s desktop app. We’ll use the desktop manner right here because it’s more uncomplicated to observe alongside.

Whilst you arrange GitHub desktop’s app, you’ll have the ability to clone present repositories out of your account:

Adding a new repository to the GitHub app.

Make a selection the repository you place up previous from the checklist and set its Native trail to any folder you wish to have. You’re going to make use of that folder so as to add your WordPress recordsdata, so be certain it’s someplace you’ll be able to consider:

Configuring your repository's local folder.

Unzip your exported record from step primary and extract its contents to the native repository folder you place up a 2nd in the past. When you do this, the GitHub desktop app will hit upon the adjustments to the repository. Specify a reputation to your first dedicate after which click on the Decide to grasp button:

Committing your changes to the repository.

Now, whilst you click on the Put up button on the best of the app your adjustments can be uploaded to GitHub.

You’re virtually able to get entry to your web page now. On the other hand, first we want to configure GitHub to acknowledge your repository as a web page. To try this, move into your repository settings and search for the GitHub Pages segment. Underneath Supply select the grasp department choice and click on save:

Checking the source for your GitHub page.

Your web site’s URL will now display up on the best of the segment. In case you discuss with it, you must see your WordPress web page display up, handiest as a static web page:

An example of a WordPress static page.

As we discussed previous, some portions of your web page would possibly now not paintings in the event that they depend on dynamic content material, akin to remark sections. On the other hand, if that is so, you possibly can most probably have any use for static pages anyway and must stick with use WordPress as customary.


In some instances, easy HTML and slightly CSS is all you wish to have to construct an informative and sublime web page. On the other hand, WordPress generates dynamic pages out of the field. That’s some distance from a nasty factor, however it does imply you wish to have to perform a little tinkering if you wish to create static WordPress pages.

Right here’s how you can get the process finished and submit your static pages free of charge, in 3 steps:

  1. Use the WP Static HTML Output plugin to create a static reproduction of your web site.
  2. Add your static pages to GitHub.

Do you might have any questions on developing static WordPress pages? Let’s speak about them within the feedback segment underneath!

Article symbol thumbnail via Andrew Rybalko /

The put up How to Generate a Static HTML Copy of Your WordPress Website seemed first on Elegant Themes Blog.

WordPress Web Design

[ continue ]