The Hero Divider is one of the most utilized design features with the Brilliant Directories platform. It is a great way to teach new website visitors what it is they can do on your site. It is also one of the first things they see, taking up some of the most valuable real-estate on your website, both for desktop view and mobile devices. 


Brilliant Directories have been asking to convert this section into a great opportunity to add high-quality call-to-actions that are clickable. This increases page views and helps the end-user find what they are looking for quicker.


Desktop View: 



Mobile View:




Adding Clickable Links To Your Hero Divider


To add clickable buttons to your hero divider please follow these instructions:


  • Go to ADMIN >> SETTINGS >> DESIGN SETTINGS
  • Click on "Homepage Layout" tab
  • Click on "Homepage Divider Settings"
  • The settings should now display like this:


  • Add the "Link Name". This is the text that will appear on the clickable button itself. 
  • Add the "Link URL" for each button. When the button is clicked, the website visitor will be taken to the link you have provided. 
  • Click "Save Changes"




Important Settings 



Use Icon / Use Image


Use Icon: If you select this option you can use web icons from the already made Fontawesome Gallery.

Use Image: You can use your own icons or images to create the clickable links.




Hide on Mobile?


You can also disable or enable the Homepage Divider Section on a mobile device. Please see the image below to find this useful setting:




How to Use this Functionality Creatively?

Create a Mixed Featured Post Section for your Homepage



For this example we want to showcase 3 important Posts from members.


First you need to re-upload the posts images, because you are going to need these to showcase them in this section.


We are uploading the images from these 3 posts:


- A classified about Solar Panels

- A Photo Album about Green Prosperity

- A Member Article about Whales




1. Select Use Image.

2. Add the Title, here we are using the same title of the Post:




3. Add the Caption, on this section we are adding a short description of what this Post is about, use this to call your visitors attention:




4. Add the Link Text, we are adding who created this Post:




5. Add the Link URL, here you'll need to add the link of the post:



Finally, you can add the other two posts and change the Background Color, Font Color and tweak the padding to your liking. 


Important: If you want the images to be the same size you can use this free Image Crop Tool as you can see I didn't crop the images for the Whales post so the image looks smaller.