> ## Content Index > Fetch the complete content index at: https://pupontech.com/llms.txt > Use this file to discover other available public pages before exploring further. # Building a Static Site With WordPress and Netlify - URL: https://pupontech.com/building-a-static-site-with-wordpress-and-netlify/ - Published: 2019-07-23T02:57:34.000Z - Updated: 2025-08-01T15:02:16.000Z - Author: AY - Tags: websites, wordpress, netlify, #Import 2025-08-23 21:22 This is how I built a fully static website by using a combination of tools to streamline the process. There are going to be links for more in-depth explanations to each step. ## Updates- I have been using the same basic technique but I have moved to [Laragon](https://laragon.org/?ref=pupontech.com) which has way better performance than Netlify. ![](https://cdn.synaps.media/pupontech/content/images/wordpress/2019/07/kitchenware-ingredients-cartoon_24640-26689.jpg) ### Ingredients - [Local by flywheel](https://localbyflywheel.com/?ref=pupontech.com) - [WordPress](https://wordpress.org/?ref=pupontech.com) - Theme - [Wp-to-static plugin](https://wordpress.org/plugins/static-html-output-plugin/?ref=pupontech.com) - [Netlify](https://www.netlify.com/?ref=pupontech.com) hosting with [GitHub ](https://github.com/?ref=pupontech.com)integration First, let me explain why I went this route. I needed to get my photography site up extremely fast. I wanted a clean minimalist website with extremely fast load times hence the reason why I went static. I also needed something where most of the HTML and CSS was set up and on which I could do my own tweaks after the fact, as opposed to something like Jekyll, which is a bit more involved. So, I needed a clean, basic, WordPress theme to use as my template. Another reason I needed a clean theme is so that it doesn’t completely break when I export it as a static site. I decided to go with Netlify since they offer extremely fast, static website hosting through GitHub, as well as really great tools and an easy to use interface. ![](https://cdn.synaps.media/pupontech/content/images/wordpress/2019/07/meta_share_image-1024x536.png) I love their logo. I started out with[ Local by Flywheel](https://localwp.com/?ref=pupontech.com) which is a Local Dev Environment for WordPress that’s extremely easy to use, and here is a quick [guide](https://getflywheel.com/layout/local-wordpress-development-environment-how-to/?ref=pupontech.com) to get you started. Next, I got the [wp-static plugin,](https://wordpress.org/plugins/static-html-output-plugin/?ref=pupontech.com) (no need for any other plugins), and then I set up GitHub and Netlify… [Here’s](https://www.netlify.com/blog/2016/10/27/a-step-by-step-guide-deploying-a-static-site-or-single-page-app/?ref=pupontech.com) a tutorial on how to do that. As mentioned previously, I needed to find a theme that wouldn’t break when converted to Static-HTML. I quickly realized that I needed a theme that’s built only using HTML and CSS without any fancy additions, because the additions would break upon static export. I went through some of the usual theme directories but in the end, landed on this[ theme](https://github.com/?ref=pupontech.com) on GitHub. It worked straight out of the box statically and matched the aesthetic I was looking for. It also is an extremely well laid out theme in the programming department which helps an HTML and CSS noob like me. Next, I went through and built the basic outline of the site using WordPress’s built-in tools. There are many great tutorials available, so I won’t cover that over here. I did some further customization by going through the theme editor in the appearance menu, which lets you go through each part of the of HTML and CSS. ![](https://cdn.synaps.media/pupontech/content/images/wordpress/2019/07/open-graph-2-1024x538.png) Because I needed a filler image. I added social icons using [Fontawesome.](https://fontawesome.com/?ref=pupontech.com) I made a bunch of different changes in terms of font and scaling as well as customizing the footer, which I won’t bore you to death about here. After that, I needed to find a lightbox plugin and a gallery plugin which would work with a static site. Again, I found that sticking to the simplest plugins available, was the way to go. After a lot of trial and error, I settled on the following two: [Wp-featherlight](https://wordpress.org/plugins/wp-featherlight/?ref=pupontech.com)\-for my photo lightbox [WP-Flickity](https://github.com/PaoloFalomoWebDesigner/WP-Flickity?ref=pupontech.com)\-for my slider testimonial page, which I have not finished yet. They both use Jquery, for anyone who cares… ![](https://cdn.synaps.media/pupontech/content/images/wordpress/2019/07/chrome_SNUbGFGXim.png) You may have to put the site name given by Netlify into the target directory, while testing. When testing each step and to publish the final product, I needed to export the site statically, through the plugin. There is a way to link your Netlify directly, but I wasn’t able to get it to work. Instead, I exported it to a zip file and then uploaded it to Netlify directly. ![](https://cdn.synaps.media/pupontech/content/images/wordpress/2019/07/Wadh-Rinse-Repeat-cycle.png) Do you use shampoo? After you do this process a few hundred times and are happy with your site, you may want to add a custom domain. [Here ](https://medium.com/fundscornertech/how-to-host-domain-to-netlify-site-for-free-step-by-step-guide-45d0c2102db3?ref=pupontech.com)is the guide I used. Start from step 6. And that’s it!! You should now be live. If you have any questions, comments, or suggestions, feel free to give me a holler. This is the [site](https://www.aygrossphotography.com/?ref=pupontech.com) I built and I am currently working on another one, with the same workflow.