Skip to content

Build and host unlimited free static WordPress sites on Vercel, Netflify or DigitalOcean

License

Notifications You must be signed in to change notification settings

astrowp/free-static-wordpress-site

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

17 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Free Static WordPress Site

Learn how to build and host unlimited free static WordPress sites on Vercel, Netflify or DigitalOcean

Who is this guide for? Tools you need:
Beginners who want to create their first WordPress website LocalWP
WordPress users looking to explore static site generation SimplyStatic
Students or hobbyists on a budget who want to build and host websites GitHub (Desktop)
Small business owners or bloggers seeking cost-effective website solutions Vercel, Netlify or DigitalOcean App Platform
Anyone curious about using tools like LocalWP, SimplyStatic, and GitHub for web development

You don't need any prior experience with static site generators or advanced hosting platforms. This guide will walk you through the process step-by-step, making it accessible for those new to these concepts.

Quick Overview

This approach transforms your WordPress site into a collection of static HTML files, served directly to visitors.

Let's break down how this all works:

1. Traditional WordPress:

  • Relies on PHP, a server-side language, to generate web pages dynamically upon each user request.
  • Content is stored in a database, and PHP fetches it when needed.

2. Static WordPress:

  • Uses a free plugin (Simply Static) to "capture" your WordPress site's content and media, generating static HTML, CSS, and JavaScript files.
  • These files are then deployed to a free web server, eliminating the need for PHP or a database.

Pros:

  • Blazing Fast Speed: Static files are incredibly lightweight and served quickly, resulting in significantly faster loading times. This improves user experience and SEO.
  • Enhanced Security: With no database or PHP execution, the attack surface is drastically reduced, making your site less vulnerable to common WordPress security threats.
  • Simplified Hosting: Static sites can be hosted on free hosting platforms, and you won't need managed WordPress hosting.

Cons:

  • Limited Dynamic Functionality: Features requiring real-time data updates, like contact forms, user logins, or e-commerce, become more complex to implement.
  • Content Updates Require Re-Generation: Every time you update your site's content, you need to re-generate the static files and re-deploy them.

Static WordPress is ideal for:

  • Blogs
  • Portfolios
  • Business websites with mostly static content

It's less suitable for:

  • Membership sites
  • Online stores
  • Sites requiring frequent content updates or dynamic features

For more detailed information, you can check out this blog post

Now, let's dive into a step-by-step guide on how to set all of this up and get your unlimited free static WordPress sites up and running!

LocalWP

image

1. Install LocalWP on your local machine

First, download LocalWP for free. Choose the version that matches your operating system (Windows, macOS, or Linux). Once downloaded, run the installer and follow the on-screen instructions. LocalWP makes it super easy to set up a local development environment.

When using LocalWP on a Windows machine, you should choose Apache as the web server (as explained here)

2. Create your WordPress site

Now, let's create your WordPress site.

image

  • Launch LocalWP and start a new site. Click the '+' button in LocalWP to begin the process of creating a new site. You'll be guided through a few simple steps.

  • Name your site and configure the environment. Give your site a descriptive name, like "My Static Site" or something related to its content. LocalWP will let you customize the local domain name (e.g., mystaticsite.local) – you can usually stick with the defaults.

  • Choose your preferred PHP version (default is fine) and the Apache database type. Access your WordPress dashboard. Once LocalWP finishes setting up your site, you'll be able to access the WordPress dashboard directly. This is where the magic happens!

image

  • Install your theme. Head over to the 'Appearance' -> 'Themes' section of your WordPress dashboard. Here, you can browse and install themes to control the look and feel of your site. Choose a theme that aligns with your vision and install it.

  • Add essential plugins. Plugins extend the functionality of your WordPress site. Navigate to 'Plugins' -> 'Add New' in your dashboard. Search for and install plugins that are essential for your site's purpose. For example, if you're building a blog, you might want plugins for SEO, contact forms, or social media sharing.

Now, you have a fully functional WordPress site running locally. Take some time to customize your theme, configure your plugins, and start creating content!

Static WordPress

image

1. Install the SimplyStatic free plugin

Log in to your WordPress site's dashboard (using the local URL provided by LocalWP). In the left-hand menu, go to 'Plugins' > 'Add New'. Search for 'Simply Static' and click 'Install Now'. Once installed, click 'Activate'.

2. Export static build to a local directory

After activating SimplyStatic, go to 'Settings' > 'Simply Static'. Here, you can customize the export process.

image

Choose one of the following: absolute URLs, relative URLs, or URLs constructed for offline use.

image

Choose a directory on your computer where you want to save the static files (e.g., 'C:\Users\Local Sites\my-static-site\export'). Click 'Generate Static Files' to start the export.

GitHub (Desktop)

1. Git commit the local directory

Download GitHub Desktop and sign up for a free account.

Open GitHub Desktop and click 'Create a New Repository'.

image

Choose the directory where you exported your static site files ('C:\Users\Local Sites\my-static-site\export' in our example).

Give your repository a name (e.g., 'my-static-site') and click 'Create Repository'.

GitHub Desktop will detect the files in the directory. Add a commit message like 'Initial static site build' and click 'Commit to main'.

2. Publish to GitHub

In GitHub Desktop, you'll see an option to 'Publish repository'. Click it.

Verify the repository name and choose whether you want it to be public or private.

Click 'Publish repository'. This will push your local files to a new repository on github.com.

Sign in to github.com, go to the repositiory and check that the static files of your WordPress site are there.

Deploy to Vercel, Netlify, or DigitalOcean

1. Sign up for Vercel, Netlify, or DigitalOcean App Platform

You have several great options for hosting your static site for free:

Vercel: [Vercel signup link] - Known for its simplicity and speed, and generous free plan. Netlify: [Netlify signup link] - Another popular choice with a generous free tier. DigitalOcean: [DigitalOcean signup link] - Offers more control and flexibility, but might be a bit more technical.

Choose the platform that best suits your needs and go ahead and create a free account.

2. Import the GitHub repository

Once you've signed up and logged in to your chosen platform, look for an option to 'Import Project' or 'New Site from Git'. Connect your GitHub account and select the repository you created ('my-static-site').

These platforms are designed for easy static site deployment. They'll auto-detect your site's build settings and deploy it automatically. You'll get a live URL where you can access your site!

3. Deploy

Deploy your site. This might involve clicking a 'Deploy' button or following a simple wizard.

4. Connect Your Custom Domain

Once deployed, each platform provides a default domain name (e.g., your-site-name.vercel.app, your-site-name.netlify.app).

To use a custom domain (e.g., www.yourdomain.com), you'll need to follow the platform-specific instructions for adding and verifying your domain. This usually involves updating DNS records with your domain registrar (like GoDaddy, Namecheap, etc.).

Deploying to GitHub

Here's how you can set up a system that (semi) automatically detects changes in your local directory and pushes them to GitHub.

GitHub Desktop

GitHub Desktop is a user-friendly application that can simplify this process significantly. Here's how you can use it:

GitHub Desktop will automatically track changes in this folder.

Whenever you make changes:

  • Open GitHub Desktop
  • You'll see the changes listed
  • Add a summary (commit message)
  • Click "Commit to main"
  • Click "Push origin"

Deploying to Vercel, Netlify, or DigitalOcean App Platform