I’m still not a fan of Gutenberg, but it is the default WordPress editor and thus the future of WordPress. Especially now that Full Site Editing (FSE) is maturing, allowing you to not only design the content of your pages with Gutenberg, but also template parts such as your header, footer, blog template, woocommerce templates and so on.
However, Gutenberg itself offers very few possibilities to design your website to your own taste. Fortunately, there are more and more plugins that add extra functionality to the Gutenberg editor, such as Stackable, Kadence blocks, Qubely, Cwicly and now also Greenshift.
Greenshift is new, yet familiar
25 new Gutenberg blocks in the free version of Greenshift
In the free version of Greenshift, you get no less than 25 new Gutenberg blocks with all kinds of advanced options.
Like most Gutenberg addon plugins, Greenshift also has an advanced text block, a button block with which you can create beautiful buttons with icons, an icon list block to add those icons to lists, a slider, an advanced tabs block (in which vertical tabs are also possible), an accordion block and so on.
In addition, Greenshift also offers a number of blocks that you will not find in other block addons, such as social media share buttons, an (animated) svg shape that you can use as a divider and – very cool – a sliding panel / popup trigger with which you can create a ” off-canvas” panel or popup that appears when you click a button or after a certain number of seconds.
In those kinds of blocks – sliding panel, but also tabs, accordions, slider and so on, you can place other blocks so that you can place any content you want. This applies to all block addon plugins, but this is not the case in other page builders such as Elementor or Divi.
Also in terms of styling options, Greenshift offers more than (the free version of) other Gutenberg addons such as Stackable and Kadence. For example, you can add animated text to the advanced text block, as well as gradient text color, you can add an entrance animation to all Greenshift blocks and CSS transform options are also included in the free version – which can be set separately for hover. So for example, you can enlarge an image or rotate it when you hover over it.
Layout options: CSS grid, flexbox and calculated width
The layout options in Greenshift are also very extensive. For example, there is a container block, where you can choose a flexbox layout or a CSS grid layout. That may not mean anything to you, but it’s extremely useful to make your layout suitable for smartphones, or to align your content in the middle or bottom of a column.
For example, with a CSS grid you can choose to show 4 columns on desktop, 3 columns on tablets and 2 columns on smartphones. Greenshift also distinguishes between smartphones in landscape and portrait mode – there are 4 breakpoints, and you can set the resolution for each breakpoint yourself.
Another unique feature is that you can choose to make the columns swipable on smaller screens. Normally, columns on mobile are placed one below the other, but with Greenshift, you can also choose to display them next to each other in a slider (with or without arrows and automatically changing slides).
Furthermore, you can also work with variable widths – not only with % and vh / vw, but for containers you can even work with calculated width (including min and max settings). Fluid typography is also included.
Built for speed
Ever since Google announced that the speed is a ranking criteria, website owners have been feverishly looking for ways to achieve the highest possible score in the Google Pagespeed Insights tool. Greenshift makes that a lot easier, because the developer has optimized the plugin to achieve the highest possible score.
For example, only code that is necessary for the blocks that are actually used on that page is loaded and no external libraries are called (for example, Google Fonts are stored locally and icons are generated on the fly).
Greenshift Premium addons
All of the above is included in the free version of Greenshift. However, there are also some premium addons that add even more functionality to this already very extensive plugin.
The developer of Greenshift has chosen not to offer (only) one premium version that contains all premium blocks and functionalities, but instead offers a few bundles that focus on specific functionalities. However, there is also a bundle available with all premium addons.
GreenshiftWP Query Addon
The query addon is the most interesting addon in my opinion, since it brings dynamic content to Greenshift. This allows you to build your own templates, for example to display your blog posts in a custom layout or for a custom shop page for your webshop.
You can decide for yourself what you want to display in such a layout, and of course also design the styling completely to your liking. For example, you can add a shadow to individual posts or products to get a card effect like the image on the left, and you can even add custom fields from plugins like ACF or Toolset.
In addition, this addon contains a conditional logic block. That is a container block in which you can place other blocks. You can then show or hide those blocks based on conditions.
For example, you can only show blocks to logged-in users (or only to users who are not logged in), only (or not) with messages in a certain category, only on certain pages, only with products with a certain shipping class or within a certain category, price range or even based on certain custom field values.
Finally, there are some nice extra blocks available within this addon, such as a wishlist, a voting block (thumbs up/down or +/-) and a login pop builder.
GreenshiftWP SEO and Marketing Addon
The second addon is the SEO and Marketing Addon. This contains a number of blocks that make the REHub theme so popular and is mainly intended for bloggers who make money with affiliate marketing.
For example, this addon contains special blocks for product comparisons (tables that let you list all features side by side), a “how to” block with which you can easily explain something in a number of steps, a review box (see image on the right) in which you can add criteria yourself with a rating, where the average is calculated automatically and you can also add pros and cons.
This addon also contains a block that allows you to insert a WooCommerce product into your post,
or a list with multiple products.
Other notable blocks in this addon are an (image) hotspot block that allows you to show any content when a user hovers over an icon, and a link hider extension that allows you to hide links from Google while a user still sees them. The latter seems to me to be against the guidelines of Google though.
GreenshiftWP Animation addon
Entrance animations are already available in the free version of Greenshift, but the Animation Addon takes your animation possibilities a few levels higher. The Animation Addon adds the GSAP animation library to all Greenshift blocks, the same library the popular motion.page app uses.
With this, you can make sentences appear word by word or letter by letter with a self-chosen effect, which you can also program completely to your own liking. You can also automatically apply animations to inner child items. For example, you can make columns appear 1 by 1, without having to set a separate animation for each column.
The most important block in this addon is the animation container, which allows you to add all kinds of advanced animations to the content in that container. For example, you can create animations that consist of several steps, or add complicated scroll animations,
or show animations along a certain (SGV) path and so on.
Finally, you can also create beautiful parallax effects with this addon.
Conclusion
Greenshift may just become my new favorite page builder. The many useful blocks with extremely extensive styling options, the flexible layout options, the 4 custom breakpoints to optimize your design for various screen sizes and the built-in speed optimizations are a dream for web builders.
Smart choice to split the premium addons, so you only pay for the things that are of interest to you. There is also an all-in-one package available that includes all premium addons.
Need help with your website?
This article is written by Bob the webbuilder, an allround website expert who blogs regularly about all kinds of subject to help you build your website. Do you need help?
Hire Bob to build your website or improve your existing website.
This article contains affiliate links. That means I get a compensation when you buy a premium Greenshift addon via one of the buttons in this article. The price you pay is still the same so it won’t cost you anything, but it will help me tremendously to help you with these kind of free articles. So if you’re going to buy Greenshift, I would really appreciate it if you use this link 🙂
Are you going to use the free version of Greenshift, but still want to thank me for this article? Then I would really appreciate it if you would make a small, one time donation via the button on the right 🙂
Related Posts
Cwicly was a popular Gutenberg addon amongst professionals. Indeed, it WAS, because sadly, the development of Cwicly is discontinued, leaving many users searching for a worthy alternative. Is Greenshift the answer? Let's find out!
