Do you want to add info banners to your WordPress website? Info banners are a great way to display important information, announcements, or promotional offers. Adding these banners is an effective way to grab your audience’s attention and enhance the overall user experience.
With the Animated Service Boxes block from Nexter Blocks, you can create beautiful info banners in WordPress.
To check the complete feature overview documentation of the Nexter Blocks Animated Service Boxes block, click here.
Requirement – This block is a part of the Nexter Blocks, make sure it’s installed & activated to enjoy all its powers.
To do this, add the Animated Service Boxes block to the page and follow the steps –
1. Select Info Banner from the Main Style section.
From the Style section, you can select a predefined style.
2. Then, from the Hover Orientation section, you can select the slide direction on hover. You can set the direction to top, bottom, left or right.
By enabling the Display Button toggle, you can add a button to the info banners.
When enabled, you can select a button style from the Button Style section.
By enabling the Icon/Image toggle, you can add an icon or image to the info banners.
3. Then in the Service Boxes section, you have to add the content for the info banners. By default, you’ll find three items, open one item.
4. You can add a title in the Title field.
Then, from the Select Icon section, you can select the image type for the info banner. Here you’ll find three options –
- None – This will not add any image to the info banner.
- Font Awesome – With this option, you can add a Font Awesome icon to the info banner.
- Image – With this option, you can add an image to the info banner.
Based on your selection, you’ll get different options to add the image type.
Note: Make sure the Image/Icon toggle is enabled to see the icon and image options.
You can add a subtitle in the Sub Title field as required.
5. In the Description field, you can add a description that will show on the back slide.
6. Then in the Featured Image section, you have to add an image for the info banner.
You can edit the button text and URL from the Button Text and Button Link fields respectively.
Note: Make sure the Display Button toggle is enabled to see the Button Text and Button Link fields.
Following this process, you can edit the other items.
You can click on the +Add Item button to add more info banners.
You can select the image size from the Image Size dropdown.
Then from the Layout tab, you can manage the text alignment of the info banner content and you can also manage the info banner height as well.
Then from the Columns Manage tab, you can manage the number of items in a row for desktop, tablet and mobile separately. You can also manage the gap between the items as well.
