The Divi theme offers us the option of having the social icons appear in the footer of each page, but how can we customize this? How do I open the Divi footer icons in a new browser window? Indeed, the display options of the Divi footer icons are basic, this theme doesn't leave us too much choice: only 4 icons to place at the bottom right and which open in the same browser tab! Don't panic, in this article, we'll see that in two or three clicks, we can change the opening window of our footer links...
1 - Opening the Divi footer icons: notion of Target _Self / Target _Blank
In HTML, the tag is used to add a link to a new web page, whether it is a page on your site or a page on an external site. The syntax is as follows:
The "href" being the destination and the "target" being the path to take to get there... That's why there is different values to add to the "target" attribute - all taken into account by the browsers - but we will retain only the main values:
- _blank: opens the link in a new browser window or tab
- _self : opens the link in the current window => this is the default value
By default WorPress uses the "target _self", perhaps without knowing it, you modify this attribute yourself when you insert a link in the body of your articles. This is exactly what happens when you check the little box below the destination address, see :
However, the Divi theme does not offer us such an option when we fill in the addresses of our social profiles from the Divi > Theme Option > GeneralA pity...
2 - How can I open a new window when I click on an icon in the Divi footer?
If you are already using the Divi theme, you may have noticed that the icons in the footer of your site or blog do not open in "target blank.
This means that if a visitor to your site clicks on one of the icons at the bottom of each page, they will leave your site and go to one of your social profiles. This visitor will have left your site and may not come back to it, this is the "target self.
On the other hand, if you had the possibility of opening your social profiles in a new browser window, perhaps the user would be tempted to continue reading your article or browsing your site.
To remedy this, it's very simple! You will have to add a small piece of code in Divi that will open your social profiles in a new window when the user clicks on them... This piece of code is as follows:
3 - Where to insert the code to open the Divi footer icons in a new window?
Remember, in a previous article, I explained that Divi allows you to easily insert code in the "Head" section of your site... This is precisely where you should add this little script.
Alternatively, if you prefer to integrate this function directly into your child theme, this is also possible. All you have to do is duplicate the header.php file in your child theme and add this piece of code.
To go further...
Opening the Divi footer icons in a new window is very important as it makes navigation and the user experience easier for your player.
If they are interested in your article, they may be annoyed if they have to go back to it by clicking on the "go back one page " arrows in their browser.
Moreover, it is super important for your internal statistics: if the reader leaves your site after a few seconds, without even having visited another page, it increases your bounce rate => this is not what you are looking for, is it?