Adding a WordPress Hero Image Banner on your Website

A unique user hero banner WordPress extension

Try Hero Banner for Free!

ProfileGrid Hero Banner Extension is a simple yet valuable extension that helps in adding a banner that allows you to add a strip of user profile pictures as a banner on your WordPress. The website hero section can be created with the group profile pictures.

Using this WordPress banner extension, you can include various columns and rows of user profile avatars. The extension is easy to set up and can be used even by beginners.

Features of WordPress Hero Image Banner

Here are a few highlights of the WordPress hero banner extension:

• As an admin, you can install a WordPress website banner and create a banner for more than one group profile of your website.
• You can extract user avatars from one or more groups to design the homepage website hero banner.
• As per your requirements and choice, you can add various columns and rows to your WordPress site banner or homepage hero image.
• If the number of profile avatars is less in the starting, you can repeat profile avatars or use dummy avatar profiles for your WordPress banner widget.
• The WordPress hero section changes the web hero image size for website depending upon the placement of the widget.

How to Use ProfileGrid Hero Banner Extension?

To get started with the Hero Banner Extension, download the extension from here and install it on your website.

If you already have ProfileGrid Membership Core, Premium, or Premium+, you do not need to install the extension separately. All the mentioned versions of ProfileGrid Memberships come with the Hero Banner Extension.

Once you have download and installed the extension follow the given steps to set up a WordPress Hero Image Banner and create a hero section of website:

Step1: Once the extension is installed on your website, go to your Admin Menu. Here, from the Appearance, click on Widgets.

Step2: Scroll down and find ProfileGrid Hero Banner from the list of widgets. From the drop-down, select Sidebar, and Add Widget.

Step3: After adding the widget, you will find the user hero banner WordPress in the Sidebar column, which is placed on the right of all widgets.

Setting up WordPress Hero Image Banner

Step1: Add a Title name for your hero banner.

After adding the Title, add a Heading and Sub Heading, both of which will be displayed on top of your hero image website examples.

Step2: You can also select the background color of both Heading and Sub Heading.

Step3: Further, you can choose the Button Text and Button Link to customize the CTA or link on your hero banner. You can also select how this link will open: in the Parent Tab or in a New Tab.

Step4: Next choose the number of Rows and Columns in your hero banner.

Step5: You can also add Dummy Images or Repeat Images to your banner if the number of user avatars is few.

Step6: Finally, you can add a hero banner for one, multiple, or all the groups.

Step7: Save the changes and check the hero banner on your WordPress website from the frontend.

WordPress Hero Banner Frontend Examples

In this example, we will import 3 rows 10 columns along with a few more setting changes.

We will keep the Title, Heading, and Sub Heading the same as above.

Next, we will change the heading background color to Red and keep the Sub Heading background color, white.

Now, we’ll keep the button text and button link as it was. And we have kept the ‘Link open In’ as ‘Parent Tab’. That means whenever a user clicks on the button link, he/she will open the link on their parent tab. You can select ‘New Tab’ as well; in that case, the link will open in a new tab.

Next comes the number of rows and columns, we’ll change the rows to 3 and columns to 10.

Further, for insufficient images, we’ll keep the setting as it to ‘Dummy Images’. In this case, if you do not have sufficient group members to fill the columns and rows, the extension will use the dummy images to fill the gap. And if you select ‘Repeat Images’ then the images will be repeated to fill the gaps.

Now, we’ll save the setting and check out the frontend:

You can change the position of the WordPress Hero Image Banner by editing the page using WordPress or Elementor. In addition to that, the website hero banner size adjusts according to the placement of the widget.

Winding-up

Using the WordPress Hero Banner feature, you can extend the functionalities of your website and improve user interaction. A unique feature like WordPress Hero Image Banner encourages the users to join groups and be a member.

Explore the above steps to utilize the WordPress banner for free on your website, and in case you face issues, reach out to us in the comment box. We will get back with expert advice on adding a user hero banner to your WordPress.