WordPress.org

Forums

Fictive
[resolved] Social Media Links in Header Box (7 posts)

  1. dailydietdevo
    Member
    Posted 1 year ago #

    How do you get the social media links into the header box as shown in the example? The only option is for a twitter widget for the sidebar.

  2. designsimply
    Member
    Posted 1 year ago #

    Go to Appearance > Menu and create a menu with links pointing to your social media sites. Then assign the menu you created to the "Social Links Menu" location. After you assign the menu, the icons should appear automatically after that.

    The instructions are also posted at http://theme.wordpress.com/themes/fictive/ under "Social Links" in case you need them.

  3. meganva
    Member
    Posted 11 months ago #

    Hi there,

    I have another related question, which maybe I should post independently, but I'll try here first. It has to do with getting the email icon in the social media links menu.

    I have tried adding some social links, which seem to recognize themselves and use the appropriate icon, but I'm not getting an email icon when I add my email. I get something else, which does not scream "email!" to me. The link functions properly, but the icon does not give an indication of what its function is.

    I have seen a lovely little letter (for mailing) icon out there before - can we get it?

    Thanks!
    m.

  4. Kathryn
    Automattic Happiness Engineer
    Posted 11 months ago #

    I'm not getting an email icon when I add my email.

    meganva - email isn't one of the services that has a built-in style in the theme's CSS. You can see which are included starting on line 2542 in style.css.

    If you add this bit of CSS to your Custom CSS or child theme, you'll get an email icon in your Social Links menu, as long as you enter your address in the clickable format "mailto:you@youraddress.com"

    .social-links ul a[href*="mailto"]:before {
    	content: "\f410";
    }

    Don't edit the theme files directly, otherwise your changes will be overwritten when the theme is updated.

    An easy way to add custom CSS is to install the Jetpack plugin and activate the Custom CSS module. You'll then add your custom CSS in the new stylesheet editor that'll appear in your dashboard, under Appearance > Edit CSS.

    As alternatives, you could either install a standalone custom CSS plugin, or create a child theme.

  5. meganva
    Member
    Posted 11 months ago #

    Thanks!

  6. Life Well Blended
    Member
    Posted 8 months ago #

    I am having the same problem with the email button. I installed the Jetpack plugin and added the following Css on the stylesheet but it still doesn't show up. What am i doing wrong?

    .social-links ul a[href*="mailtoXXXX@XXXX.com"]:before {
    	content: "\f410";
    }

    [email redacted]

  7. Hi Life Well Blended - you shouldn't be putting any email addresses in your CSS, that won't work. :-)

    Try what I provided earlier, without the address itself:

    .social-links ul a[href*="mailto"]:before {
    	content: "\f410";
    }

    That will give you a little envelope icon:

    https://cloudup.com/cyFF2aZv6VP

    Enter your email address - with the mailto: in front of it, to make it clickable - in the social links menu under Appearance > Menus, like this:

    https://cloudup.com/cz8IfmEJzYw

    If you aren't sure how to create a social links menu, here's a guide intended for WordPress.com, but the instructions are generally the same here:

    http://en.support.wordpress.com/menus/social-links-menu/

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic

Tags

No tags yet.