Contents
Introduction
If you searched how to turn off social icons in secondary bar divi, you’re not alone. The Divi theme shows social icons in the top secondary bar by default. That is useful for some sites. For other sites, the icons create clutter or duplicate elsewhere. This guide gives clear, simple steps to remove or hide those icons. I show three safe methods: the Theme Customizer toggle, small CSS, and editing the header in the Theme Builder or child theme. Each method fits a different comfort level. I also cover mobile-only hiding, troubleshooting, and best practices. Follow the steps and test on a staging site first.
Quick answer — the fastest way to remove them
The fastest answer to how to turn off social icons in secondary bar divi is to use the Theme Customizer. Go to Appearance → Customize → Header & Navigation → Header Elements and uncheck Show Social Icons. This removes the icons from the secondary bar without code. It is the official method and works for standard Divi headers. If you use a custom header built with Divi’s Theme Builder, remove the Social Follow module from your header template instead. The Theme Customizer toggle is simple and reversible, so it’s the best first try.
Method 1 — turn them off via the Divi Theme Customizer (step-by-step)
To follow the official step for how to turn off social icons in secondary bar divi, open your WordPress admin. Go to Appearance → Customize. Choose Header & Navigation then Header Elements. Find Show Social Icons and toggle it off. Save and publish. This removes icons added by Divi’s global header settings. It is safe and supported by Elegant Themes. It does not edit code or child theme files. If the icons remain visible after toggling, check for a Theme Builder header or a plugin injecting icons. The customizer route should be your first stop.
Method 2 — disable specific icon types in Divi Theme Options
Another easy approach to how to turn off social icons in secondary bar divi is using Divi Theme Options. Open Divi → Theme Options and scroll to the section that lists social icon toggles. There you can turn off specific icons such as Facebook, Twitter, or Instagram. This method is helpful when you want to keep some icons and hide others. It affects Divi’s built-in social profiles and global display. If your site uses a plugin or a custom header, those toggles may not affect injected icons. Check both Theme Options and the Customizer for the full picture.
Method 3 — remove the Social Follow module in Divi Theme Builder
If your site uses a custom header created in the Divi Theme Builder, the question shifts to how to turn off social icons in secondary bar divi within that template. Edit the Theme Builder layout that contains your header. Find the Social Follow module or an icon module in the top bar. Delete or disable that module and save the template. This method is ideal for full control. It avoids global toggles and gives precise placement. After you remove the module, verify the front end on desktop and mobile to make sure no other modules show icons. Theme Builder changes override the Theme Customizer for that header.
Method 4 — a small CSS snippet to hide icons instantly
If you prefer code, you can hide icons with CSS. This method answers how to turn off social icons in secondary bar divi quickly and reversibly. Add this CSS under Divi → Theme Options → General → Custom CSS or in your child theme:
This hides the entire top header social icon block. For a narrower selector, use depending on your HTML. Add the rule to the head via Divi Integration to avoid a brief flash before the CSS loads. Use CSS when toggles don’t remove icons or when you need a quick fix.
Method 5 — remove icons from the header template in a child theme
For developers or advanced users, the child-theme route answers how to turn off social icons in secondary bar divi by editing template files. Copy header.php or the relevant header partial from the parent Divi theme into your child theme. Find the code that outputs the social icons and remove or comment it. Keep a backup and test on staging. This method permanently removes the icons from the theme unless you revert the file. It is robust and avoids toggles, but it requires PHP comfort and careful version control. Use this when you want a code-level solution.
Method 6 — plugin helpers like Divi Toolbox or Divi Booster
Plugins can help you control top-bar elements without code. If you search how to turn off social icons in secondary bar divi, you’ll find plugins like Divi Toolbox and Divi Booster with header controls. These plugins add easy toggle switches to move, hide, or style icons. They are great if you want more granular control and UI options. Install the plugin, find the header or social icon settings, and disable or move the icons from the top bar. Plugins are ideal for editors who prefer settings over code. Check compatibility with your Divi version first.
Mobile-only hiding and responsive control
Sometimes you only want to hide icons on phones. To achieve how to turn off social icons in secondary bar divi on mobile, use responsive CSS. Add the following to your custom CSS:
This targets tablet and smaller screens. Alternatively, use the Divi Builder’s built-in module visibility settings to hide a Social module on phone and tablet. Both approaches let you keep icons for desktop while cleaning the mobile header. Test across devices to confirm the look and avoid layout gaps.
Why social icons sometimes appear twice (troubleshooting)
If you tried how to turn off social icons in secondary bar divi but icons still show twice, you likely have duplicates from multiple sources. Common causes include: global Theme Options icons plus a Theme Builder Social module, a plugin adding icons, or custom code that moves icons. First, check Divi → Theme Options, Appearance → Customize, and the Theme Builder templates. Then deactivate social plugins temporarily to isolate the source. If duplicates vanish after a plugin deactivation, that plugin was the cause. Cleaning redundant sources is the key to a tidy header.
Testing, caching, and avoiding the flash of icons
When you apply any step for how to turn off social icons in secondary bar divi, test carefully. Clear your site cache and browser cache. If you use a caching plugin or a CDN, purge those caches too. If you hide icons with CSS, add the CSS in a way that loads early to avoid a brief flash of icons before the rule applies. Divi’s Integration area lets you add code to the head for faster effect. Always test in an incognito window and on mobile to ensure changes are consistent for all visitors.
Accessibility and SEO considerations when removing icons
Thinking about how to turn off social icons in secondary bar divi also means thinking about users and search engines. Social links can offer helpful navigation for some visitors. If you remove them, consider adding clear links elsewhere. Use semantic markup with aria-label if you keep icons. For SEO, social icons do not directly affect rankings, but user experience matters. If accessibility or voice users rely on those links, provide alternative visible links in the footer or contact page. Good accessibility practices keep your site inclusive after design changes.
Alternatives — moving icons or styling them instead
If your goal is neatness, you may not need to remove icons entirely when exploring how to turn off social icons in secondary bar divi. Try moving them into the primary menu, footer, or a social bar widget. Divi Booster and Divi Toolbox often include “move icons” options. Or change size, color, or spacing with CSS so the icons feel less dominant. Sometimes a small visual tweak keeps the functionality and reduces header noise. Test several placements to find what looks best for your brand and layout.
Real example — step-by-step: Customizer then Theme Builder check
Here’s a practical sequence answering how to turn off social icons in secondary bar divi that I use on client sites. Step one: open Appearance → Customize → Header & Navigation → Header Elements and uncheck Show Social Icons. Step two: check Divi → Theme Builder to ensure there’s no custom header module still showing icons. Step three: clear caches and test on desktop and mobile. Step four: if a duplicate remains, search plugins for social modules and disable them. This ordered approach catches the usual edge cases and gives a clean header.
Common errors and how to fix them quickly
When you try how to turn off social icons in secondary bar divi, the most common errors are editing the wrong header and forgetting to clear cache. If icons persist, double-check that you edited the active header template in Theme Builder. If you placed CSS in the wrong spot, it may not load on time. Always use specific selectors like #top-header .et-social-icons and add !important only if necessary. If you edited header.php, make sure the child theme is active. Keep backups to restore quickly if needed. These checks usually solve stubborn issues.
Best practice checklist before you change anything
Before you act on how to turn off social icons in secondary bar divi, do this checklist: back up your site, use a child theme for code edits, test on staging, clear caches after changes, and document what you did. If you modify templates, add comments so you remember why. If a plugin is involved, note its version. This saves time and avoids surprises. A short checklist like this keeps design work safe, and it helps teammates or future you understand the change. It is a small step that prevents big headaches.
Wrap-up — recommended path for most users
If you asked how to turn off social icons in secondary bar divi, start with the Theme Customizer toggle. If that does not work, check Divi Theme Options and the Theme Builder. Use CSS for quick fixes and child-theme edits for permanent removal. Plugins like Divi Toolbox or Divi Booster help non-developers move or hide icons without code. Always test and back up before editing templates. With the right method, you can keep your header clean and consistent across devices. Pick the approach that matches your comfort level and site setup.
FAQs — common questions and answers
Q1 — My site still shows icons after turning them off. What now?
If toggling how to turn off social icons in secondary bar divi didn’t work, check for a Theme Builder custom header. Also inspect plugins that add header icons. Clear both server and browser caches. If you used CSS, ensure the rule is precise. If you edited templates, confirm the child theme is active. Doing these checks usually finds the hidden source and fixes it.
Q2 — Can I hide social icons only on mobile but keep them on desktop?
Yes. To achieve how to turn off social icons in secondary bar divi on mobile only, use responsive CSS or Divi module visibility. Add a media query Or hide the Social Follow module within Divi Builder for phone and tablet. Test on several devices to confirm. This approach keeps desktop features while simplifying phones.
Q3 — Is it safe to edit header.php to remove the icons?
Editing header.php answers the developer version of how to turn off social icons in secondary bar divi. It is safe if you use a child theme and make backups. Copy the file into your child theme and edit there. Use version control or keep a saved copy so you can revert. If you are not comfortable with PHP, prefer the Theme Customizer, Theme Builder, or CSS methods. Child-theme edits are best when you want a permanent, code-level fix.
Q4 — Do Divi updates remove my changes?
If you use the Theme Customizer or Theme Builder, your changes survive Divi updates. If you edited the parent theme files directly, updates will overwrite them. That is why the child theme method is essential for code edits when you search how to turn off social icons in secondary bar divi at a code level. Always use a child theme or the Theme Builder to protect changes across updates.
Q5 — Does hiding the social icons hurt SEO?
Hiding icons from the secondary bar typically does not hurt SEO. Social links do not directly influence search rankings. However, if those icons were the main way users reached your profiles, ensure you add visible social links elsewhere. Use semantic markup and accessible labels if you keep icons. Focus on user experience and clarity rather than SEO fear. Good navigation supports both people and search engines.
Q6 — I want to move icons into the primary menu instead. How?
Instead of answering how to turn off social icons in secondary bar divi, you can move them. Some plugins, like Divi Toolbox or Divi Booster, include a “move icons to primary menu” option. Alternatively, use a small jQuery snippet or place a Social Follow module in the primary menu area within a Theme Builder header. Test alignment and colors to ensure they match your main navigation. This keeps social links but reduces top-bar clutter.
Final notes
Now you know multiple ways to answer how to turn off social icons in secondary bar divi. Start with the Theme Customizer. If that fails, check the Theme Builder or use CSS for a quick fix. Use plugins if you prefer UI-based controls. For code-level permanence, use a child theme edit. Always test changes in staging and keep backups. If you want, I can draft the exact CSS block for your theme, write a child-theme snippet for the header, or list the step-by-step clicks for your Divi version. Tell me which you prefer and I’ll prepare that next.