Welcome to the redesigned MetaSlider.

After several months of work, we’ve updated this website with a warmer, more colorful and more modern style. This version of the site also replaces custom fields with Gutenberg blocks.

In this article, I’m going to give you a tour of the new site and the tools we used.

Here’s a screenshot of the new homepage, built by our designer, Rochelle.

New MetaSlider homepage

The next screenshot is the old website for comparison purposes. The previous version was less colorful, using mostly orange, white, and black. One of our aims with this redesign was to add a wider range of colors.

Old MetaSlider homepage

When it comes to being more colorful, that applied to the icons on the site also. This next screenshot shows the new icons, created by Rochelle.

New MetaSlider icons

You can compare the new icons with the old icons in the screenshot below.

Old MetaSlider icons

The previous version of the website was built with the Advanced Custom Fields. Everything was placed into fields, from features to testimonials to pricing tables. This meant that any layout changes required an update to the theme code. Using fields was also extra work because it was so unrelated to the end result on the front of the site.

We’ve moved the new site entirely to blocks. Now we can see an accurate preview of each page before we hit “Publish”, and there’s rarely any need for code changes. Here’s a preview of the editing screen for the new site homepage.

New MetaSlider homepage built with blocks

The move to blocks was made easier by the Kadence theme. We run several WordPress projects and they are now all standardized on Kadence. You can see the other sites at PublishPress.com, TaxoPress.com and Logtivity.io. All those sites use a child theme based on Kadence, plus the Kadence Blocks plugin.

Another improvement is the addition of WooCommerce blocks for the checkout. These blocks were merged into the core back in 2019 and are a pleasure to use. The previous version of our checkout was based on shortcodes and a lot of custom code. We’ve been able to ditch all that custom code with the move to blocks.

Here are other plugins we use on this site:

Thanks everyone for using MetaSlider. I hope this new redesign makes for a warmer and easier experience whenever you need to visit our site.

Leave a Reply

Your email address will not be published. Required fields are marked *