Move JetPack Social Share Icons below Read More

Hi,

I’d like to move the JetPack social share bar to below the Read More buttons on the home page of my staging site here: http://offsvngsgrp.staging.wpengine.com/

I’ve done the following already:

  1. Installed the Sparkling Child Theme
  2. Copied over some of the Sparkling Parent Theme settings to match

Now, I see the new functions.php page in the editor. I will add this code to functions.php:

function jptweak_remove_share() {
    remove_filter( 'the_content', 'sharing_display',19 );
    remove_filter( 'the_excerpt', 'sharing_display',19 );
    if ( class_exists( 'Jetpack_Likes' ) ) {
        remove_filter( 'the_content', array( Jetpack_Likes::init(), 'post_likes' ), 30, 1 );
    }
}
 
add_action( 'loop_start', 'jptweak_remove_share' );

JetPack says, add this code to the page template file:

if ( function_exists( 'sharing_display' ) ) {
    sharing_display( '', true );
}
 
if ( class_exists( 'Jetpack_Likes' ) ) {
    $custom_likes = new Jetpack_Likes;
    echo $custom_likes->post_likes( '' );
}

Which templates and where do I add this code? Do they need to be wrapped in a p tag or a div tag?

Is it possible for someone to please answer this question. I posed on Nov. 23rd and not it’s December 3rd. We’d appreciate it.

Check out this link, your question has been answered here… https://colorlibsupport.com/t/read-more-above-jetpack-sharing/

Okay, I tried this:

.home .sharedaddy, .home #content .home .sharedaddy, .home #main .sharedaddy {
	position: absolute
}

Here’s the link to staging: http://offsvngsgrp.staging.wpengine.com/

It doesn’t quite push the buttons down far enough under the read more button. It’s on the same line.

Hi @tonyzeoli,

I hope you are well today and thank you for your question.

You can try achieving this by adding the following CSS code in the Custom CSS option of the latest version of Sparkling theme on the below path.

Admin Area -> Appearance -> Customize -> Sparkling Options -> Other -> Custom CSS

body.home article .post-inner-content {
    position: relative;
    padding-bottom: 125px;
}
body.home .entry-content .sharedaddy {
    position: absolute;
    bottom: 0;
}

Best Regards,
Movin

That worked much better than the previous suggestion. Looks great now, thanks!

You are most welcome here :slight_smile: