 Okay, thank you Karen, thanks everyone for coming here, and it's very exciting to talk about this one today Just as an expectation of what what you should come out of this with Static sites are still something that's a little bit unfamiliar to many And so just if you come out of this session just with an understanding of what a static site is How that might help in your WordPress setup then that'd be great All right, so a little bit about me It's my little WordPress dating profile here Yeah, I left us earlier when I was 20 traveled around the world and did a bunch of sort of tech-related work for different places and Here I am okay, so Static websites will start off with what they are. Okay, and then we'll move on to how you can go about getting one How you can go back converting your WordPress site into a static site and Whether or not that's actually going to be suitable for the type of website that you've got Okay, so If you look at a static site and you look at a dynamic site, this is part of the what are they? You shouldn't really notice any difference when you're looking at it as a user visually, there's no difference and Again looking at the code no difference at all So it's still a bit mysterious now. So what is what is what is a static site? What is the difference? All right, here's a little hint if you've ever been to a Project hosted on github and the URL is something dot github dot I o then you're looking at a static site there but the real the real guts of it the real difference between a static site and a dynamic site is a Static site is pre-generated and we look at WordPress as an example here So when you've got your WordPress site and you create a post in your WordPress dashboard a post content is living in the database You've got a database you may not be aware that you've even got a database you just log into your WordPress and you add a post and Your user visits your site and they see that but what's going on behind the scenes is that? they they go to your page and It's making your quest to your server and pulling this this content out of your database and all that takes Not lots of time But enough time that it can be a problem for a heavily viewed site or a site that's got some performance issues because you got lots of plugins and things running Now with a static site, you're getting rid of all that all that time There's there's no time going and fetching different pieces of content from the server and doing other tasks in the background As soon as the user goes to your page, boom, they've got the whole the whole content right in front of them In doing so it uses very minimal resources If you're hosting a static site and you get some media attention or you get linked to on front page or something like that, your site's not going to break a sweat As opposed to if you've got a WordPress site and you haven't Sort of planned for massive traffic and put it through tests, you can find yourself with a site that's offline and happened to a Friend of mine running a charity last week. They got media exposure in the UK got some television coverage and Their sites down and that's the worst time because you've got all these people. You've got the media attention and they're coming to a blank page There's lots of ways you can you can mitigate that just within WordPress itself Most people that have been using WordPress for a while Use some some caching plugins some things that will help with handling handling traffic Another advantage with a static site is you can you can use that offline so if you're a designer and you're building your WordPress site and you want to hand that to a client for approval or preview you can Put on a USB stick CD if you still use CDs hand it to them and and they can test the site out You don't have to worry about You know whether the site's still online and what sort of version they're going to see you take a snapshot We give it to them and they can approve that with With I'm going to talk a bit later about a product that I make that allows you to take your WordPress site and turn it into a static site and One of one of my main customer groups are people that are worried about security security of their WordPress site and Again, there's lots of ways you can mitigate security when you're running a WordPress site but for a lot of people If you're a digital agency you met you might have hundreds of sites, but you still don't have the resources to hire a full-time you know security expert for your company and so when you've got something that's so easily Easily customizable like WordPress any of your clients can if they've got access to their to their site They can go in and they can turn on plugins They can download a plug in they can copy and paste some random code They found on the internet and that's that's the beauty of WordPress. It's so easy to to To add content to to get your site up to modify it But it comes with a lot of security implications You know, no one's checking the code that the plug-in the plug-in author made or the theme author made And for a lot of us, it's not something we can do. I'm not a security expert myself and my solution back in the day To to create my product was I don't want to have to deal with that security issue So if I can take my WordPress content keep it as it is the beauty of rapid development But then get rid of this whole security concern of hosting a WordPress site by taking its static then that's great and that's what I did So the three main points of a static site the security of mention Performance touch on a bit where Especially when you've got lots of load on your site, you've got, you know, 10,000 people all at once You can you can test your current website your work WordPress website you can go to some online Load testing tools that will simulate what it's going to be like when a hundred people or a thousand people or 10,000 people All visit your site at once and you may be interested to find How quickly it it will fail or to start getting slower and slower to respond to each request so the page is going to load slower and we all know that Slow page loads do not make for happy users Once you're once you've got a static site, you can you can throw crazy amounts of traffic at it and again You won't break a sweat The last thing that I really like one of my passions is is open source low resource computing You know so like enabling Enabling people that may not be as fortunate to have the luxuries you have in Australia Or even if you're in Australia not everyone has the money to to spend on hosting to spend on latest computers all these sort of things and static sites are really really great in enabling you to I know I guess You can have your you can have your Really nice looking site that you built with WordPress and you put all your features into it But you don't need to pay for hosting at all. There are lots of really good sites hosting providers out there at the moment where you can put a Static representation of your website and host it for free And with some extra benefits as well. I'll cover some of some of those providers later on It's not the the primary users of my of my software or not You know the ones looking for that for that free hosting, but I think it's a really exciting Aspect, you know, I've paid over the years the last 10 15 years paying for hosting for WordPress It would go up to I know from $40 to $150 a month depending on the site and When you can pay zero for that that means you can focus those costs on more important things and Again, if someone's looking at your site, it looks visually exactly the same whether it's static or dynamic But you don't have to pay for it. That's a big a big bonus Just to reiterate security wise If you're hosting your site statically, you're not worried about your Database credentials. You're not worried about your file permissions And you're not worried about any vulnerabilities in plugins or or anything like that about the only thing you have to worry About is your main username and password for wherever you're hosting your site. Alright, so This one might be a little bit more technical But for anyone who is already using a caching plugin for WordPress like w3 total cache Caching is great and it solves a lot of solves a lot of problems But for in order for for caching to work though, you've usually got to have one person at least visit that page and and You know run through it allow it to do all that that fetching in the back in the back end hitting the database pulling your content out and from that point on subsequent visitors will will receive that that cached version and So while you might have a really big site and it's really busy some really large sites. I've worked on utilize w3 total cache and Eight but being that the site was so heavy if ever the page content changes or something something changes on the side that requires a Non caching request to happen then that could be enough to really slow down the site again and cause you cause you pain So here are some of those that I mentioned before some that offer free hosting for your static site and Some of the ones in the in the top three layer are ones that have a free tier so something like Amazon web services you can host with their S3 it's just like a simple storage solution and Kind of like something like Dropbox put files in it and people can access them Specifically with this one they allow they make it very easy to host your site using that Netlify is a really big Really big thing at the moment They've just got an extra 30 million dollars in funding and they're very happy if you to host your site for free on them provided it's static There their biggest market is not straight static sites at the moment It's more something called the the jam stack which I'll talk about in a bit more, but it's totally fine for a Static version of your WordPress site Very fast if you're a global CDN So you put your static site on Netlify and your users in Australia your users in America will get the best response time available to them Github Github been in the use last week for a big outage affected the whole world it felt like But there's still a good option for hosting your static site GitLab the more open source of them and Bitbucket from the Australian company Atlassian Pretty much all the cloud providers out there. So Google App Engine Azure all support static site hosting within their free tiers in some form You've also got cool things like Firebase and for anyone that remembers geo cities back in the day The new the new New form of that neo cities you can host a static site for free on them too and with almost all of these options You're not limited to using their You know their internal domain name. So if you've already got your site on You know, www.you know my shopping site comm That's fine. You can point your domain at these free free hosts and your users won't know the difference except they might be getting the page faster Some other options that are usually paid tiers are content delivery networks. So Bunny CDN key CDN anything like that All those quite well to static site hosting One more I'll throw in there, which is if you're wanting to be a bit geekier and support a cool organization is Open BSD Amsterdam. They'll give you a server for $60 a year $10 of which they donate to the open source and Super secure super minimal out of the box kind of a nice way to host your static site and Again, you're a bit if you want to be in control All these other options the free options there at the top They're hosted platforms and so you can host your site for free there But you're you can't you can't have access to your own log files You can't really get in there if you're you know, want to want to get geeky with it then a cheap server A cheap but solid server like the open BSD Amsterdam is a good option You can install whatever you want on there host a static site, but still have full control over the server and One last point which is kind of close to my heart. So last year I was doing a charity in the Philippines with my partner and it was all around It's all around plastics cleanup and that sort of thing which if you've been to Southeast Asia is a big problem and it makes me think more about everything that we spend money on and Hosting is just another one of those so $40 a month for hosting It's it's it's not bad for anyone that's working in Australia. You can afford that But in order to pay that it might be an hour. It might be two hours of your of your wage and That's two hours of time per month That you might be dedicating just to pay for your hosting and you don't need to so that money can go somewhere better Or take two two hours off work each week. All right, this one's going to be more It's just a concept to throw out there It's a quite a geeky sort of thing so IPFS is something called the interplanetary file system. It's really cool and it's you think of it kind of like, you know Bitcoin blockchain stuff like that where You can it's a distributed decentralized network and you can also get a static site and put it on here And this is not something that most of us are going to be looking at doing it's not going to be a business case for us, but it's cool to think about in terms of You know when you're in a country, we've seen the YouTube outage last week was Pakistan trying to block sites for their users You know, hopefully so far. We're not getting many sites blocked in Australia that we want to visit but if that case ever happens and you can put a static site on something like IPFS and you're kind of resilient to those kind of governmental controls so when you've got your your WordPress site and you are Publishing it out as a static site now I would just say here that when you're when you're going static site option with your WordPress site You're not giving up on WordPress you keep using WordPress for what it's great for which is the content management the plug-ins themes the community but your your code goes out and it's all static HTML files Just files just files in a folder. You'll have your HTML files your CSS your images your JavaScript and You can use a version control software something like git and you can You can have a nice history of each each time you publish your site out You can put a name against it. You could be you know, this is the time we added the You know the new widgets section and then you've made three more publishers since that day and then you realize oh crap We we made a massive mistake and we lost like you know all these images on a site You can just quickly roll back to those versions prior because you've got a exact Snapshot of what your site was like at that point in time. So that's another benefit you get The use case I see sometimes from digital agencies again with hundreds maybe thousands of client sites going back ten years WordPress presents a challenge in that you've got a You get a site from a client who is a great client You love them and you built their website, but they don't need any work on it You know, there might be a small business and their site serves them fine or they're You know, they're just not They don't have the money to invest in it anymore Now when you're when you've got their WordPress site, usually you're charging a monthly fee for maintenance and security a lot of the times But if they don't want to pay that you don't have to take their site down So what you can do is again take a take a sort of snapshot of it turn into a static HTML site Keep that up there. Don't worry about security. Don't worry about even hosting costs for them and they get to keep their site okay, so there's a lot of probably new words on this screen and this is just the the many many ways that you can take any any website whether it's a WordPress site or another one and and convert it into a static site So the first two W get an HDD track HD are kind of built in Either built in or easily installable tools for a lot of operating systems and these are kind of command line more geekier tools HD track has has a user interface a lot of the time and it's it's really really full-featured and comprehensive in terms of Making an archive of a website site sucker is a tool for Mac OS at least use many years ago, and that's you just put in the address of your site click a button and it'll Pull it all down and create a static copy of that. It won't do as far as I know. I haven't checked recent versions. It won't do Rewriting of your of your URLs or all your links in your site And so it's good for taking offline copy of your site and giving it to someone but not so good for You know having a WordPress development server taking a static copy of that and then publishing it somewhere else that's where WordPress plugins and that's where one of one of those is a plugin that I create and there's at least one more up-to-date Plug-ins specifically for WordPress that you install Put a couple of settings in press a button It'll it'll crawl through your site extract each page Rewrite the links that you want for your new site and give you that static copy and there's also At least three companies that are quite new and quite interesting out there at the moment so shifter static and hardy press and They're kind of like a hybrid approach. They're a press specific hosting company but they serve the content statically so So you log in and you you manage your site through them like you would any WordPress site But behind the scenes there they're making a static copy of it to serve and they address some of the issues automatically that you would otherwise have to manually Work around taking WordPress site to a static site Yeah, it really quite interesting so a Bit more secure in that sense Last on that list there is the Jamstack and WordPress and I mentioned before Jamstack is is something that Netlify's Big user base is is about and the the Jamstack Here we go Jamstack stands for a JavaScript APIs and markup so Kind of like the you know the trend your way to build a website You know these days is to have a Totally sort of offline site. So it's it's a static site in nature, but for things like getting the content for having user user comments for having e-commerce or anything anything that's kind of a bit dynamic in the site you'll Hit API from various services and use those on your static site and In the case of WordPress it plugs into a lot of these Jamstack setups so You know like a modern front-end framework or static site generated like Gatsby.js is a is a common one You can use your WordPress site as a data source So WordPress exposes an API since I don't know how many versions ago Which makes it really easy for you to take your content from WordPress and use on another site in that case you're not gonna be getting the The theme so it's not gonna necessarily look the same as what your WordPress looks like you'd just be purely using it for Adding and managing your content, which is again what WordPress is really good at so to go static from WordPress for For the majority of WordPress sites that are out there. I would say that they're Fairly easy to do with the only consideration needing Is to deal with your contact form most websites will have at least one really dynamic aspect, which is your contact form and when you've no longer got a Server-side language on your server you don't have PHP on there anymore once you go static So there's nothing to sort of handle the submission of your contact form and there's a few good solutions out there If you're hosting with Netlify All you need to do is add an extra Attribute I think it is to your to your form So if you're comfortable to go into the source code you can add a little attribute to your to your form and they'll automatically Intercept anytime a user submits your form and they'll email it off to your email address of choice. It's really nice In other cases there's some Plugins you can get for WordPress that will automatically convert your contact form 7 which is a plugin that almost all WordPress users are using for their contact form And it will convert that to submit to a service like form spree Which is again remote sort of form processing Other sort of dynamic things you might have on your site comments so comments more for a blog business sites, maybe not so much but Even when you're using WordPress in its default state a lot of people have been using third-party comments systems like discuss For some years and that works just the same way on a static site because it's not running on your server. It's running somewhere else It's it's very seamless Search is a bit of a trickier one. So usually your your WordPress site You've got built-in search in your theme. It hits your database and it's you know, it's got a powerful text search So To to get that same functionality With a static site It needs to know the content of your site first and it needs to sort of index that for easier searching And that's where a company at the moment Algolia is doing a really good Really good job and they're really popular and quite easy to create Options or something like Google custom search. I think it's called where you basically Have a mini version of Google running in your site It's you're not limited when you go static with your WordPress site You can use something called sneak card, which is a really nice JavaScript based shopping cart that's it works with their hosted platform does all the payments and everything And last one there user accounts. So if you're running a membership site that might be more of an issue There are Solutions out there again popularized with the the jam stack. So thanks to the jam stack We're getting a lot of solutions to the typical static site as well. All right, so Static site generators I'll skip just give you a bit my my product I'm going to talk about in a moment is called WordPress static generator. We know that this from the talks topic and There's a lot of static site generators out there that you don't you don't use WordPress at all you just start out of the bat with one of these tools and Usually the way they work is you'll manage your content just as a as a bunch of files And these might be marked down files just text files. You can just open them up in text edit make some changes Usually run a command on the command line and it'll it'll produce your They're generally really fast and they're generally Something you got to run from the command line, which can be a bit it can be a bit intimidating if you used to WordPress so there I guess they're more popular with with Those that really want to pursue a you know development path If you want to see there's there are static site generators and pretty much any language out there So if you like PHP if you like Ruby if you like Python There's one out there that'll do the job and they're getting better and better and you can go to static gen.com there and See which ones are the most popular Why we don't use them again? It might be that that that that was fear or just you just don't want to have to deal with the command line Which is a understandable? And that can be a big turn off for using a static generator WordPress is still brilliant at what it does. It's what is it 30 something percent of the web powered by WordPress It's not, you know, it's not just some random chance that people installed it at work. So it works great for content And the plug-in ecosystem this community really good ease of collaboration meaning If you're a distributed team or you're outsourcing some work you got content writers all over the globe It's very easy to just give them a Invite to your WordPress site they can come in they can have their different user levels You can have editors publishers and such and when you've got a static site generator you're dealing with those You know those files on a folder which if you want to start sharing those around Then you're looking at putting those under version control sending like a link to github to your designer to update some text and It's not as easy The study site generators out of the box they're they're quite good. They've got their Their ways, you know, you put your content in this folder your text files you put your theme over here Running command generates it and they're all designed to do that really well out of the box But it gets tricky once you want to start doing Customizations the kind of things that in WordPress you might just install a plug-in You want to show a list of the I don't know the top the top ten posts But you want to filter out a certain category. That's fairly easy to do now in WordPress but with a static site generator that could be fairly easy to it could be like You know a lot of customization to get it working And again back on the command line these days if you're doing WordPress and I meet a lot of people that are Able to build really good sites Without ever leaving the browser, you know, they're not having to edit any any code with an editor They're using something like Divi or Alamor and it works fine. All right So this is artwork done by done by a developer here. So it's a bit rainbowy So I Created this product About seven years ago. It just it solves the problem for me. I was doing a lot of WordPress sites for clients and Performance and security were an issue as though it must be an easy way. So I created this and it got some users it's on the WordPress repository and Then I kind of you know, I got out of WordPress man I you know did other things for many years and then I Notice it still had all these users and I wanted to do something With open source still as looking for a project to contribute to and realized. Oh, okay I'm still one and it's got all these users, but it's in serious need of a refresh So this is my my full-time thing now I developed this and try and make it as useful to the to the users as possible and it takes the The best of both worlds. So you've got your your WordPress still for your content your collaboration But you're getting rid of the security and the performance issues by publishing out to a site and Those icons you see there on the the brightly colored area are some of the deployment targets that you can use So you install this plug-in Choose where you want to host your your new static site and this can be your own server via FTP Bitbucket GitLab bunny seat Bunny CDN all these ones there it can be anywhere that you can put a static site And in general anywhere that you can put a dynamic site you can put a static site so if you're comfortable with your digital ocean set up or You know, whichever whichever hosting it is that you like you can just put your files in there and it'll work I'll just give you a quick quick preview what the what the interface looks like well, it's a bit full on there lots of fields and things but That's That's one of the benefits of it. You get a lot of control over Not just taking your current site and putting it out as a static site But you can modify a few things in between there for example If you've ever looked in the the source code of your WordPress page you might find a lot of stuff that You wouldn't put in there if you were making your site by hand if you're hand coding your your site You wouldn't end up with all these Maybe canonical links have a purpose but you've got a lot of other things if you're not using the WordPress API You don't need links to the API in there You may not be using feeds. So there's certain plugins that may get rid of You know what I dare to call a bit of cruft in your in your WordPress generated code but this plugin also allows you to Strip out things strip out things you don't need and that's an optional step You can also rewrite your paths. So one of the things that I really was interested in doing was Generating using WordPress to generate websites, but kind of not Telling the world that that's what I'm using For various reasons one is if you're if your site is easily identifiable as a WordPress site. It's very easy for bots to scour the net and say okay, this is a WordPress site So I'm going to start attacking the usual points that I think With with the plugin I wrote I allowed to Rewrite all those paths. So you're stripping out the usual WordPress identifiers but you're also doing things like changing all of your all of your links that say, you know WP content slash themes slash Divi slash whatever and Totally making those whatever you want Also with Changing your URL structure so you can completely rewrite the URL and have you know relative links or absolute links Which generally you can easily do with WordPress and on that one one more example there is For that squeezing that extra out of performance out when you've got those really long through your site They they start to add up. It's not a big amount of space but You know these days you really want your site to be as fast as possible And if you want to go crazy and get your source code as small as possible Then this can be an option where you can you know remove half of that Alrighty, so I think we're gonna start doing some questions and answers here if anyone's got anything