Premium Theme Support › UpThemes › Gallery

Problems with social media icons

  • Author
    Posts
  • #60983

    blaisingadventures
    Member

    Hello,

    I’m trying to get the Facebook icon to show up on my menu. I’ve connected my blog to my FB page via the settings>sharing>publicize feature and it works great.
    However, I was told that the FB icon would automatically show up in the menu of my blog but it doesn’t. Do you know how to do this? I have tried disconnecting and reconnecting through Publicize several times and it still doesn’t work.

    Many thanks,
    Alice

    The blog I need help with is blaisingadventures.com.

    #61323

    angelatcrist
    Member

    Hi Alice,

    Thanks for reaching out!
    Just to confirm, did you follow all of these instructions:

    * First enable Publicize within Jetpack.
    * Next, head over to the Theme Customizer by selecting Appearance → Customize.
    * Finally, click Connect and select the appropriate social media accounts from the drop-downs to enable social link icons.
    * Make sure to publish your changes before leaving the page

    Just wanted to confirm this first.
    I’m happy to help!

    Thanks,
    Angela

    #61325

    blaisingadventures
    Member

    Hi Angela,

    Thanks for your response. The process sounds different than what was advised to me earlier. Can you explain what Jetpack is? I went to Appearance>Customize>Connect to my FB page but the icon didn’t show up.

    This is what I did previously:
    Settings>Sharing>Connected to FB.

    Thanks for your help!
    Alice

    #61326

    kathrynwp
    Staff

    First enable Publicize within Jetpack.

    Hi Alice – I just wanted to clarify that Publicize is already active on all WordPress.com sites. You can ignore the reference to Jetpack as that’s a term that only applies to a self-hosted site – sorry for any confusion!

    #61327

    blaisingadventures
    Member

    OK great – any thoughts on why the FB icon doesn’t show up?
    I’m using the Gallery theme.

    Thanks,
    Alice

    #61330

    kathrynwp
    Staff

    I wish I could tell you why the Facebook icon is not showing up in your menu! I had a look at your other thread and I also see that:

    – you’ve already tried disconnecting and reconnecting your Facebook account, which is what usually fixes this issue
    – your posts are correctly being publicized to your Facebook page
    – testing your connection shows that it’s a valid and working connection, with no errors returned from Facebook

    Do you happen to have any of the other types of accounts supported by this feature, like a Twitter, Google+, Tumblr, or LinkedIn account? If you wouldn’t mind connecting one of them the same way you connected your Facebook account, it could be very helpful in narrowing down where the issue might be. Just let me know and we’ll take it from there. Thanks very much!

    #61361

    blaisingadventures
    Member

    Helllo,
    Just wanted to follow up on this – I have an Instagram account but not sure how to connect it to my blog…
    I tried connecting my FB account to the blog again but the icon still doesn’t show up. Any ideas?

    Many thanks,
    Alice

    #61367

    kathrynwp
    Staff

    Hi Alice, thanks for letting me know about the Instagram account. That isn’t one of the services supported by the Publicize feature so unfortunately we can’t use it for testing purposes here.

    I logged into your account to double-check that you had selected Facebook from the Customizer and it looks like you hadn’t – at least not after the last reconnection. I’ve reselected it from the menu so it now looks like this:

    https://cloudup.com/c84NtVI7Mc5

    The problem now is that the icon is not displaying correctly on your site – and I think that’s a bug in the theme. In Chrome, for example, I see just a square where the icon should be:

    https://cloudup.com/c0MafpCuhrf

    I’m going to put in a bug report for this so the developers can have a look. (Angela, please be on the lookout!)

    Thanks for your patience, Alice.

    #61368

    kathrynwp
    Staff

    I think I’ve found the culprit and in the end it’s not a theme bug after all.

    I commented out this part of your custom CSS and the Facebook icon now appears:

    .menu li a {
	font-family: arial;
}

    Because the social-media icons are part of the top menu and use the Genericons icon font, changing the font family prevents the correct icons from appearing.

    This other piece of CSS is also something you may want to remove, as it prevents your post format icons from being displayed correctly in some browsers:

    .genericon-link:before {
	content: '\f475';
	margin-left: -15px;
}

    This is what they look like currently in Firefox: https://cloudup.com/clkYky8jnvL

    I hope this helps solve the mystery once and for all.

    #61369

    blaisingadventures
    Member

    Hi Kathryn,
    Thanks so much for your help. Glad you were able to identify the prob :)
    Is there another font I can use in the menu other than what you had? Or change the letter spacing? I changed it back for now because it was very difficult to read…

    Also, it sounds like there’s no way to connect Instagram to this?

    Sorry for all the questions. Thanks!

    Ali

    #61370

    kathrynwp
    Staff

    Try this instead of your current menu CSS:

    #access .menu ul li a {
     font-family: Arial, Helvetica, sans-serif;
}
#access .menu ul li.social-links a {
   font-family: Genericons;
}

    What this does is set the menu to Arial (with some fallback fonts as backups) and then resets the specific menu item for your social icon back to Genericons, which is the icon font the theme relies on.

    It also looks like the Facebook option got deselected in the Customizer’s Connect panel again so I reselected it for you. If this happens again, could you please let me know exactly what actions you took before it got disconnected so we can see if there’s an issue in the Customizer that needs to be looked at.

    Instagram isn’t an option built into the Publicize feature, which is designed to share WordPress posts with text-based social networks.

    There is an Instagram widget you could try instead:

    http://en.support.wordpress.com/instagram/instagram-widget/

    #61371

    blaisingadventures
    Member

    Awesome! This finally did the trick! I was able to add the FB icon and keep the font in my menu :) You’re been great and super patient, thanks for all your help!
    I was also able to add my Instagram account using the widget tool and even added the little Instagram icon – but this could only be done on the bottom of the page and not in the menu next to the FB icon. Not ideal but at least it’s there :) Thanks again!

    #61383

    angelatcrist
    Member

    Hi Ali,

    Just wanted to follow up.
    Please let me know if you have any other questions.

    Thanks!
    Angela

  • Author
    Posts

The topic ‘Problems with social media icons’ is closed to new replies.