GeneratePress and GenerateBlocks don’t compete with Elementor and Avada, they beat them at their own game.

WP ShowPosts has been merged with GenerateBlocks.

So, I’ve removed WP Show Posts from this site and installed GenerateBlocks Pro.

I’ll slowly rebuild the site to show you some of the features GenerateBlocks Pro has, it can do much more than show posts.

This is an example website.

I use this site to display examples of blocks and effects that are popular. This gives me a set of go to solutions when I need them.

Competing with page builders and Avada.

GeneratePress and GenerateBlocks can do most of the things page builders and themes like Avada can do. The main things that are missing are sliders, accordions, and a few very specific fancy effects. I don’t intend to replicate things like animated & ticker tape headlines or before and after photos with a slider that you can drag.

Recommended plugins.

For a lightweight accordion plugin I recommend Lightweight Accordion by Andy Feliciotti. For a free slider plugin I recommend Smart Slider 3 by Nextend. For an image gallery to be viewed on large screens I recommend Envira Gallery. But if most of your visitors use small screens I recommend the default WordPress gallery block.

The pro version of GenerateBlocks has a “hide on” option, so I can display Envira Gallery on large screens and the default gallery on small screens.

The effects I want to replicate.

By looking at the effects below you’ll get an idea of the effects I want to use on the sites I build.

Some of these effects add affordance or make it more obvious that something will happen if you click that element. Some just make the page more interesting and therefore more likely to be read.

Page layouts and sections.

GenerateBlocks Pro comes with over 200 readymade layouts that you can add to your page with one click.

Check back soon to see the updates.

The examples below show some of the things you can do with GenerateBlocks Pro.

BG image static when page scrolls

Image Scales On Hover

BG color changes on hover

Headline Border

Box Shadow

Box Shadow on Hover

Icon Moves on Hover

with a sub-heading
This is the first item

This is the lightweight accordion, I set the first item to be open and changed the headline background color. You build this using a lightweight accordion block and you can use the block editor to add content.

This is the second item

The content goes here.

This is the third item

The content goes here.

This is the fourth item

The content goes here.

Gas Gage

Although this gas gage is not animated it still gives the user the information they need. And you don’t need an extra plugin to make it work.

Professionalism 50%
Experience 66%
Always on time 75%
Great support 100%

Reveal on hover.

This paragraph is revealed on hover. So your layout is less cluttered but the information is there for people who need it.

Background gradient.

This text is inside an inner container. I set the inner container to vertically align bottom. I used a gradient background to make the text easier to read while keeping the top of the photo clear.

Button Styles.

These look like text links but they’re actually buttons. You can style buttons in many ways, underlining on hover is just one option.

Image Galleries

WordPress has a built-in image gallery block that looks great. However, those images load into a blank page, which confuses the user. Envira Gallery is a good free plugin that displays photos in a nice gallery and opens in lightbox that you can cycle through. This is much more user friendly. If you want fancy features for your gallery there are many premium plugins that offer more options.

GenerateBlocks “hide on” option

If you’re viewing this page on a laptop you’ll see the Envira Gallery images below here.

However, if you’re viewing on a tablet or mobile you’ll see the default WordPress Gallery block.

To do this I used the GenerateBlocks Pro “hide on” option. In a case like this, when Envira looks better on large screens but the default WordPress gallery looks better on small screens, the “hide on” option comes in very handy.

Envira Gallery 1

Default WordPress Gallery

This is a default WordPress gallery. Test it on a laptop and on mobile to see what you think.

Which gallery option should you use?

If your site visitors mostly use mobile, I’d recommend the default WordPress gallery. If they mostly use a laptop, I’d consider using the free version of Envira plugin. These are just two of the most popular choices, if you’re willing to pay for a premium plugin you have many more options than this.

Next: what is affordance?

Affordance gives the user a hint something is clickable.

Anything we've missed?

Get in touch with our team