Positioning of Social Follow Buttons with Shortcode

  • Resolved Christina Beckerman

    (@csbeckart)


    2 months ago

    I’ve used a WPCode snippet with the shortcode for Social Follow buttons to place the buttons in my site’s footer, but I can’t figure out how to get the buttons centered on the page. It also changed the color of the logos to white from what’s set for the standard icons (it kept the background and outline colors though) and i would like to get the title and icons on the same line if possible. I would greatly appreciate any assistance!

    This is the snippet I have set up currently as a sitewide footer (this is all in a snippet because my site theme has 4 widget columns and that cannot be changed, so it is impossible to center anything in the widget area unless I edit the theme file):

    <div style="text-align:center; margin: auto; background-color: #003533; color: #c1b972;"><a ; style="color: #7c7235; text-decoration: underline;";>Terms &amp; Conditions</a> | <a ; style="color: #7c7235; text-decoration: underline;";>Privacy Policy</a>
    <?php echo do_shortcode('[TheChamp-Social-Follow social_networks="facebook=https://facebook.com/csbeckart,instagram=https://instagram.com/csbeckart" shape="round" title="Like/Follow Us!"]') ?><br>
    </div>

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author Heateor Support

    (@heateor)

    You can add following?CSS?in the?Custom?CSS?option at the?Super Socializer > General Options page in the admin area to make the social?media?follow?icons?center-aligned.

    div.heateor_ss_follow_ul{width:100%!important;text-align:center!important}div.heateor_ss_follow_ul a{width:auto!important;float:none!important}

    Thread Starter Christina Beckerman

    (@csbeckart)

    Thank you! That did work to center! Is there a way to get the title and icons on the same line and change the logo color from white?

    Plugin Author Heateor Support

    (@heateor)

    It’s not possible to keep the title and icons in the same line for now.
    The Logo Color settings you have configured in the Theme Selection section at the Super Socializer > Social Sharing configuration page will work for the Follow icons as well.

    Thread Starter Christina Beckerman

    (@csbeckart)

    The settings in theme selection did *not* apply to the actual logos of the icons (it *did* apply for the outlines and backgrounds, but *not* the logos) for the social follow buttons placed with the shortcode. The paths for the svgs set to white by the plugin and that was not overridden by the theme selection options. I was, however, able to figure out how to modify the logo colors with custom css once I identified where it was being set as white.

    .heateor_ss_follow_ul a path, .heateor_ss_follow_ul a circle {fill:#f7f5ea !important; }

    .heateor_ss_follow_ul a:hover path, .heateor_ss_follow_ul a:hover circle {fill:#003533 !important; }
    Plugin Author Heateor Support

    (@heateor)

    Okay. Glad to know you figured it out ??

Viewing 5 replies - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.