[EricParticipant]

Hey I know this topic has already been covered in a number of threads, but I after seeing a variety of proposed solutions, I just want to know what’s the best course of action.

Specifically I’d like to know if I can have social media sharing icons appearing on every new post (in this style: http://theme.co/x/demo/integrity/1/shortcodes/entry-share/). I read that to do so, I’d have to paste a specific code into the ‘functions.php’ section but the post was old so I don’t know if there’s another way of doing it.

I know cornerstone provides the ability to do this on a post-by-post basis but I’d really like to simplify things.

Also, if you give me a code for the ‘functions.php’ section that only uses social sharing on posts, would I still be able to use the cornerstone social sharing on pages?

And finally (just to be thorough), do you think I would be better off with a 3rd party social sharing plugin (such as WP Socializer), or is it generally recommended to keep plugins to a minimum when a simple code would suffice.

Thanks a lot!

[John EzraMember]

Hi there,

Thanks for writing in! You can put this code in your child theme’s functions.php.

// Add Social Sharing after the single post content
// =============================================================================

function x_add_social_sharing ( $content ) {
  if ( is_singular('post') ) {
    echo do_shortcode('[share title="Share this Post" facebook="true" twitter="true" google_plus="true" linkedin="true" pinterest="true" reddit="true" email="true"]');
  }
}
add_action('x_before_the_content_end', 'x_add_social_sharing');

This will add the entry share buttons to posts.

You can still use the entry share on pages via shortcode in cornerstone.

Regarding using 3rd Party plugins, it would depend on your needs. Most plugins should work fine with X unless there is a conflict. We recommend that you test and see what works best for you.

Hope this helps – thanks!

[EricParticipant]

Thanks! It worked great. Is it possible to change the look of these icons, or is that the only option for the ethos stack?

Thanks again

[Paul RModerator]

Hi,

Yes, those are the only options for ethos stack but you can change the colors using css codes.

Can you provide as an example on how you would like it to look like.

Thanks

[EricParticipant]

Well if possible, I’d prefer the style that they use on the integrity stack (http://theme.co/x/demo/integrity/1/shortcodes/entry-share/).

However I was hoping to try a few different color combinations. If it’s not too much trouble I’d like the code for the exact style of the integrity stack (red background; white logo). Then I’d like to try the same style but with a black background; gold logo (color: #c4a644). Then again with a gold back background (color: #c4a644); black logo. And then finally I’d also like to try a white background; black logo.

If it’s simple to alter the colors myself I could just plug in the colors myself, but that’s basically what I’ve been trying to find.

Thanks a lot for your help!

[ThaiModerator]

Hi There,

Your website is under construction.

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link login to your site
– WordPress Admin username / password

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thanks.

[EricParticipant]

This reply has been marked as private.

[RadModerator]

Hi there,

Please add this CSS at Admin > Appearance > Customizer > Custom > CSS with your preferred colors.

  .x-entry-share {
    margin: 0 0 1.313em;
    border: 1px solid #f2f2f2;
    border-left: 0;
    border-right: 0;
    padding: 10px 0;
    line-height: 1;
    text-align: center
}
.x-entry-share p {
    margin: 8px 0 10px;
    font-size: 12px;
    font-weight: 400;
    text-transform: uppercase
}
.x-entry-share .x-share {
    display: inline-block;
    margin: 0 0.05em;
    width: 45px;
    height: 45px;
    font-size: 24px;
    line-height: 45px;
    border-radius: 2px
}
.x-entry-share .x-share {
    color: #ff2a13;
    background-color: #ffffff
}
.x-entry-share .x-share:hover {
    color: #fff;
    background-color: #ff2a13
}

Cheers!

[EricParticipant]

Worked perfectly! Thanks a lot

[Prasant RaiModerator]

You’re welcome! We are just glad we were able to help you out.

[Author]

Posts