Okay
  Public Ticket #2767078
Social Media Icons in mobile menu
Closed

Comments

  •  1
    Mfriz started the conversation
    May 3, 2021 at 5:25pm

    Hi,

    I used the Salient Options to add social media icons to my header (on the right, next to the menu items). However, when I look at the mobile version of my website they are hidden. How can I get the icons to show in the mobile header (on the left side, next to the burger icon)?

    Kind regards,
    Michael

  •  1,878
    Judith replied
    May 3, 2021 at 5:38pm

    Hi There,

    Thanks for keeping in touch,

    Please try the option marked below:

    7425051991.png

    Hope this helps.

    Thanks.

  •  1
    Mfriz replied
    May 5, 2021 at 6:06pm

    Hi Judith,

    I tried this out but the icons are then in a new row above the logo and mobile menu.

    I want it to look like the attached image, except with 2 social media icons instead of the search icon and shopping bag icon.

    Any ideas?

  •  8,847
    Tahir replied
    May 5, 2021 at 6:57pm

    Hey Again,
    Please provide the page URL so I may write up the custom CSS for this request.
    Thanks

    ThemeNectar Support Team 

  •   Mfriz replied privately
  •  8,847
    Tahir replied
    May 5, 2021 at 10:35pm

    Hey Again,

    Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):

    @media only screen and (min-width: 1px) and (max-width: 999px) {
    #header-outer #top nav {
        display: flex !important;
    }
    #header-outer #top nav li:not(#social-in-menu) {
        display: none !important;
    }
    #header-outer[data-format="default"] #social-in-menu {
        position: relative;
        top: -35px;
    }
}

    Thanks

    ThemeNectar Support Team