Let’s remove the social icons from DIVIs footer/bottom bar only for mobile using CSS. There are many option you can have for your social icons in the footer. You can enable or disable it on both desktop and mobile, or using this tutorial you can enable it on desktop but hide it on mobile.

Show Social Icons on Desktop and Mobile

For the desktop, there is an option in the DIVI – Theme Customizer – > Footer –> Footer Elements –> “SHOW SOCIAL ICONS” that you can check (or uncheck) to enable or disable it. Checking the option “SHOW SOCIAL ICONS”  will enable it on the desktop and mobile as shown below.

Social Icons enabled in DIVI

Social Icons enabled in DIVI

 

Social Icons enabled on Mobile - DIVI

Social Icons enabled – DIVI – Mobile

 

Remove Social Icons from Desktop and Mobile

To remove the social icons from both desktop and mobile, make sure you uncheck the “SHOW SOCIAL ICONS” box in the DIVI Theme customizer as shown below.

Social icons disabled on desktop and mobile

Social icons disabled on desktop and mobile

 

Keep Social Icons on Desktop and Remove it only on Tablets and Mobile

If you wanted to keep the social icons on the desktop and disable/remove it only on mobile from DIVI’s bottom bar/footer, we can use a little bit of CSS. First make sure you have checked the “SHOW SOCIAL ICONS” in the Theme Customizer–> Footer –> Footer Elements as shown in the image above.

To add the CSS,  head over to your style.css in your child theme and paste the following CSS.  Alternatively you can also go to DIVI -> Theme Options and paste the CSS in the Custom CSS box.

/* Disable Social Icons on Bottom bar on tablets and smaller devices */
@media all and (max-width: 980px) {
#footer-bottom .et-social-icons {display: none;}
}

This will show the icons on the desktop but will remove it from the tablet and mobile devices as shown below.

Social Icons removed on Mobile - DIVI

Social Icons removed on Mobile – DIVI

 

I hope this tip was useful and you get a chance to use it on your website. If you do, please leave me a comment. For more such tips on WordPress and DIVI, check out my DIVI Blog

 

0 Comments

Submit a Comment

Your email address will not be published. Required fields are marked *

I would love to hear about how I can help your business website. I have specialized in using the DIVI theme from Elegant Themes since the past five years. If you would like to see the projects that I have completed as a DIVI Designer, please do have a look at my portfolio. Please contact me and I will get back to you immediately.

Share This