Ok 🙂 Couple of options:
Option 1: Two separate hero container blocks in a single block element:
1. Edit your existing Block Element. That element will start with a Container Block. Immediately beneath that container add a new Container Block.
2. This new Container Block is where you can you create your Mobile specific Hero.
3. With your two container blocks ( top one desktop, bottom one mobile ) you can go to there Advanced > Additional CSS Classes and add the necessary GP Hide-on classes to show hide them:
NOTE If you’re using GenerateBlocks Pro, then those hide-on classes are built in and have their own toggles under Advanced.
Option 2 – the same logic but we just show hide the image.
1. In your existing Container Block, you can add a GB Image Block before your text.
2. Use the
hide-on-* classes as above to hide / show the image.
3. If you’re using GB Pro then the current Background Image can be set to only display on desktop / tablet. If your’re not using Pro then we can use some CSS to remove it on mobile.