Social Links and add text to footer

  • Resolved webdevdon

    (@webdevdon)


    10 years, 2 months ago

    I like the buttons are automatically added to the footer however they seem dull and inactive. Is there anyway to change to color or make them look like the original social buttons on most websites.

    Also if I wanted to add text next to the facebook or pinterest button like like us on facebook how would I do so?

Viewing 2 replies - 1 through 2 (of 2 total)
  • sacredpath

    (@sacredpath)

    Automattic Happiness Engineer

    Hi there, you can change the color of the social items individually by inspecting the HTML for the icons and finding the unique menu item CSS class. In the following example, the number is 115, but your will probably vary.

    .social-links ul .menu-item-116 a:before {
    background: #cc0000;
    color: #44dd54;
}

    You can do the above for each social icon you are using and edit the background and internal icon color as desired.

    To add text before the icon, you can use the following as an example:

    .social-links ul .menu-item-116:before {
    content: "Like us on";
    margin-left: 10px;
}

    Since the space given to the social links is limited to a max-width of 30%, you may have to increase that in .social-links like this:
    .social-links {
    max-width: 50%;
    }`

    Thread Starter webdevdon

    (@webdevdon)

    Thank you this worked perfectly!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Social Links and add text to footer’ is closed to new replies.