--- title: "Website Relaunch -" description: "While my old website design was still quite decent, it really struggled with flexibility. The more moving parts I tried to include, like a better" date: "2022-06-25T12:03:08+02:00" language: "en-US" canonical_url: "https://patrickposner.com/blog/website-relaunch/" source_url: "https://patrickposner.com/blog/website-relaunch/" content_type: "text/markdown" --- While my old website design was still quite decent, it really struggled with flexibility. The more moving parts I tried to include, like a better call-to-action design for my products, a new design for tutorials, or just some performance improvements – almost all of this was kind of hacky due to the theme I was using at that time. ### Going All-In on Full-Site-Editing It was also not block-based, which was kind of a problem if you have watched the last years of WordPress development and its focus on full-site editing. I decided to go all-in, used the [FrostWP](https://frostwp.com/) theme as a starting point, converted all of my pages, blog articles, tutorials, and more to blocks, and started learning the ins and outs of full site editing. [![Website Relaunch 2](https://patrickposner.com/wp-content/uploads/2022/09/pp-fse-1024x523.png)](https://patrickposner.com/wp-content/uploads/2022/09/pp-fse.png) ## Learning Full-Site-Editing The first roadblock for me was learning all things full-site editing. What does that even mean? How does it work? I barely worked with React and Block Development besides a few little side projects, I made more for fun than profit. Then I stumbled upon the course from Fränk Klein called [Building Block Themes](https://wpdevelopment.courses/courses/building-block-themes/). I bought the course and started watching it during our three weeks vacation in mid-summer this year. It really dives deep into the topic, and it’s impressive how far you can go without even knowing how to code. ![Website Relaunch 3](https://patrickposner.com/wp-content/uploads/2022/09/fse-theme-course-1024x363.png) Instead of just watching the course, I used my own website as a practical project and converted it step by step to Full-Site-Editing. Once I learned about repeatable blocks, I added them. Once I learned about patterns, I added them, and so on. ## Requirements for the new website Despite not being flexible enough for my use case, I also had a huge list of things I wanted to improve for the next iteration of my website. ### Documentation This was one of the most important things on my list. I completely rewrote the entire documentation for all of my products. I introduced overview pages and a categorization (plugins and topics) to better structure and manage new documentation articles on my website. I also worked with [Gina](https://ginalucia.co.uk/), who helps me in all things Content Marketing (Writing tutorials, spellchecking and copy improvements, and so much more). [![Website Relaunch 4](https://patrickposner.com/wp-content/uploads/2022/09/pp-new-docs-1024x607.png)](https://patrickposner.com/wp-content/uploads/2022/09/pp-new-docs.png) ### Changelogs Another thing I always wanted to implement was a dedicated changelog area on my website. As I now have a couple of pro-only products, the changelog from w.org wasn’t sufficient anymore. Now I have a clean overview page for each product that shows all changes in chronological order – great! [![Website Relaunch 5](https://patrickposner.com/wp-content/uploads/2022/09/pp-new-changelogs-1024x653.png)](https://patrickposner.com/wp-content/uploads/2022/09/pp-new-changelogs.png) ### Landing Pages I really wanted to improve the landing pages for my products. I spend quite a lot of time here improving the copy, the overall structure, and more. I also took the time to create a little showcase video for each product and researched some popular customers to showcase them on the website. [![Website Relaunch 6](https://patrickposner.com/wp-content/uploads/2022/09/new-landingpages-1024x628.png)](https://patrickposner.com/wp-content/uploads/2022/09/new-landingpages.png) ### Support Form I have used Gravity Forms for years, and I still recommend them. However, due to the complexity of my support form, it was no longer an option to use it for my website. I needed a few things that were just too hard to implement with Gravity Forms, so I built my own little form to handle all of my edge cases. I wouldn’t recommend doing this on your own website, but for me, it was the right decision. ![Website Relaunch 7](https://patrickposner.com/wp-content/uploads/2022/09/pp-new-support-1024x589.png) While this form looks quite simple, there is quite a lot going on here: - conditional display for fields - Algolia search integration - integration Freemius license check - Integration with Helpscout to automatically tag new submissions And all of that has be done on the client side, as this website runs completely static and not as a usual WordPress website. ## Performance My old website was quite performant. I knew I wanted at least the same performance, if not better, with the relaunch. To my surprise, there wasn’t too much work involved in getting a decent result as Full Site Editing, and Gutenberg is generally quite performant already. Not bad! [![Website Relaunch 8](https://patrickposner.com/wp-content/uploads/2022/09/pp-pagespeed-1024x615.png)](https://patrickposner.com/wp-content/uploads/2022/09/pp-pagespeed.png) Despite being a static website, the only plugin involved here was [PerfMatters](https://perfmatters.io/), which I highly recommend. ## Summary This process took more time than I initially thought, but that was mostly because I had never worked with Full-Site-Editing before, and there was quite a lot of content restructuring and SEO stuff that needed my attention to make sure all redirects were working, the URL structure is optimized, and the page speed is decent.