Changing Social Media icon size in Top Menu

  • Author
    Posts
  • #2935147

    Hi there,

    I am using the Outspoken theme, and trying to make the social media icons in my top menu as small as the text, so that they don’t make the menu bigger.

    This is my site- thepaneuropean.blog.

    I’ve been told that it’s a CSS issue, but I’m not an expert when it comes to code. So any help help/advice would be much appreciated.
    Thanks, Frank.

    The blog I need help with is thepaneuropean.blog.

    #2935255

    Hello @thepaneuropean,
    Try this CSS code to reduce the size of the social icon on the top menu bar:

    .social-icon i {
        font-size: 18px;    /*change this value if you like*/
        vertical-align: middle;
    }

    Hope this helps 🙂

    #2935256

    Also, i noticed that you removed the black admin bar. Please make sure that you restore that, because we are not allowed to hide that.

    May I remove the Admin Bar, credit links such as ‘Blog at WordPress.com’, theme, font, or toolbar links?

    All WordPress.com users are required to maintain the Admin Bar (the dark bar that appears at the top of WordPress.com sites when logged in).

    The footer credit can be hidden if WordPress.com Business is active on a site. Please do not use CSS to hide or alter the credits if you do not have the Business plan.

    As stated here: https://en.support.wordpress.com/custom-design/#frequently-asked-questions

    Thanks! 🙂

    #2935258

    Legend, thank you. And – beginners question coming up – how do I add that code in? Is it just in between the /* */ in the ‘Additional CSS’ section? I tried that and nothing changed

    I’ll restore that now. Thanks a lot!

    #2935259

    Also, do you see on the theme example (http://outspoken.wpshower.com/) how the social icons remain even when you minimise the page? Do you know how they did that?

    Thanks!

    #2935262

    how do I add that code in? Is it just in between the /* */ in the ‘Additional CSS’ section? I tried that and nothing changed

    Go to your site customizer and then, then click on the CSS tab to access the CSS editor.

    More information about it here:
    https://en.support.wordpress.com/custom-design/editing-css/
     

    Also, do you see on the theme example (http://outspoken.wpshower.com/) how the social icons remain even when you minimise the page? Do you know how they did that?

    I did not understand the question. Can you please elaborate what’s happening there and what are you trying to do?

    Thanks!

The topic ‘Changing Social Media icon size in Top Menu’ is closed to new replies.