Buy me a coffee

Hide a Social Icon on One Page

Note:

  • If your site is Business Plan/higher, add code to Individual Page Header Code Injection
  • If your site is Personal Plan and doesn’t support Code Injection, you can edit the page > Add a Code Block

Suppose we have 3 icons in the Header like this:

Hide A Social Icon On One Page 01

To hide First Icon (Linkedin), you can use this code:

<style>
.header-display-desktop a.icon:nth-child(1), .header-menu-actions-action--social.mobile:nth-child(1) {
    display: none;
}
</style>

To hide the Second Icon (Instagram), use this code:

<style>
.header-display-desktop a.icon:nth-child(2), .header-menu-actions-action--social.mobile:nth-child(2) {
    display: none;
}
</style>

To hide the First and Third Icons, use this code:

<style>
.header-display-desktop a.icon:nth-child(1), .header-menu-actions-action--social.mobile:nth-child(1) {
    display: none;
}
.header-display-desktop a.icon:nth-child(3), .header-menu-actions-action--social.mobile:nth-child(3) {
    display: none;
}
</style>