How do I edit the social buttons on the mobile menu?

This topic has 3 replies, 2 voices, and was last updated 1 months ago ago by Jack Richardson

  • Avatar: Rodrigo
    Rodrigo Carlos
    Participant
    January 13, 2025 at 00:39

    Hello everyone,

    There are several social buttons displayed on my mobile, but they don’t have links, and I would like to know how to change the position of these social buttons? I would like to place these buttons at the bottom of the menu and on the left instead of centered. And I would like to put some text above the buttons.
    See print “XStore – mudar os botões share”

    And how do I change the size of these buttons? I think they are too small.

    Thank you!

    Files is visible for topic creator and
    support staff only.
    2 Answers
    Avatar: Rodrigo
    Rodrigo Carlos
    Participant
    January 13, 2025 at 01:03

    I select Left, but the buttons remain in the center. See print.

    Files is visible for topic creator and
    support staff only.
    Avatar: Jack Richardson
    Jack Richardson
    Support staff
    January 13, 2025 at 14:46

    Dear @Rodrigo Carlos,

    Thank you for reaching out to us.

    Since you are utilizing the Header Customizer Builder, the social icons displayed in the mobile menu content are configured in the “Socials” section. You can refer to the following screenshot for clarification: https://prnt.sc/rddt1aF83EVh.

    If you wish to add custom text, you can enable and configure any of the available HTML Blocks to include them in the mobile menu content. Please see this screenshot for guidance: https://prnt.sc/qsN3hdQ9zlfV. To configurate the content of such blocks you can set custom content in the section -> https://prnt.sc/DtKpPcCLLBut.

    Additionally, if you would like to align the social icons to the left, you can apply the following custom CSS. By default, this element is center-aligned:

    .mobile-menu-content .et_b_header-socials {  
        font-size: 20px;  
        justify-content: flex-start;  
        margin-left: -10px;  
        margin-right: -10px;  
    }

    Please note that the above snippet also includes an increase in the size of the icons, as indicated by the font-size property.

    Should you have any further questions or require additional assistance, please do not hesitate to contact us.

    Best regards,
    Jack Richardson
    The 8Theme Team

  • Viewing 3 results - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.