WP SITES

2757

Original WordPress Tutorials & 6000+ Guaranteed Code

Snippets

Moving Jetpack Sharing Buttons Above Your Posts Content

Social sharing is one of the best ways to bring more traffic to your website.

Jetpack is one of the most popular plugins which also includes social sharing buttons.

The only problem is, the social buttons by default, are displayed after the content.

This tutorials contains the code for Genesis users and other themes which enables you to reposition the buttons.

Display Share Buttons Before Post Content Using Code

This code will work with any theme.

It displays the buttons both before and after your content.

Paste this code at the end of your child themes functions.php file to display your Jetpack social sharing buttons before your posts content.

Display Share Buttons Before Post in Genesis

Works in Genesis only and only displays the icons before the single post content. 

add_action( 'genesis_entry_header', 'reposition_jetpack', 5 );
function reposition_jetpack() {
if ( is_singular( 'post' ) && function_exists( 'sharing_display' ) ) {
    sharing_display( '', true );
    }
}

Remove is_singular( 'post' ) && to also show the icons on archives like this:

add_action( 'genesis_entry_header', 'reposition_jetpack', 5 );
function reposition_jetpack() {
if ( function_exists( 'sharing_display' ) ) {
    sharing_display( '', true );
    }
}

Move Share Buttons After Post in Genesis

This PHP code will actually reposition your Jetpack share buttons after the content. Although this is the default position, this hook position in Genesis is after the after post content hook as you can see in this image.

after post content hooks genesis

You can edit this code to display Jetpack buttons anywhere in your theme.

Change Sharing Button Position

All you need to do in if you want to add Jetpack share buttons in another theme location is to change the hook in the code above. Here’s a list of all Genesis hooks as well as a visual hook map which shows you the position each hook executes in your theme.

Note: The above code uses the old XHTML loop hooks so you will need to change the hook if running HTML 5.

If you find this tip helpful, please share it.

Related Tips

Reader Interactions

Comments

  1. Hey Brad,

    Just did a search for “how to add Jetpack sharing buttons to the top of posts” (and keep them at the bottom as well) and so glad I came across this post (and your site overall).

    I tested both the Jetpack Extras plugin and your functions.php code (for non-Genesis site) and both worked like charm (I went with the functions.php edit; always prefer to keep plugins to a minimum if there’s a reasonable alternative).

    I’m non a coder and Jetpack’s own code and instructions on their site left me bewildered. Yours on the other hand was dead simple and literally took me two minutes.

    Thanks for the terrific post — most helpful!

  3. Hello…really helpful post. i did the tutorial but now it shows me the buttons and above and below the post…how can i make it appear only above and not in both post sides? (i use twentyfourteen theme).

      • thanks for the reply…after too many tries i can’t find what to edit in the code.it would be a great help if you could tell me what specifically to modify in the code.

        • The code needs to be modified.

          I could write the code for you and test it first to make sure it works perfectly.

          But i cannot educate you in one comment about how to write and modify PHP code using filters as its not something which you can learn quickly and easily.

  4. Hi Brad i have a question, i did the tutorial and it is great. i am using eleven40 pro theme.

    My Purpose is to place sharing buttons on single posts just below title which worked great, but they are also appearing in the genesis featured post in the sidebar, how can i remove the sidebar sharing buttons?

    • Try adding a conditional tag to this line in the code:

      if ( is_singular('post') && function_exists( 'sharing_display' ) ) {

      Otherwise you could use CSS code to hide them from the sidebar.

  5. Hi, help me please,

    I want to move the position of the YARPP related posts (YARPP is a wordpress plugin). I can see in the info of the plugin that i should put this where i want to display the related posts (inside the wordpress loop, inside the single.php file): related_posts();
    My question is if i can put this function in a hook widget area of my functions.php file (for display this after one genesis widget area)… Is possible this?? how i should put (the format??)

    • Really depends on what theme you’re using because the hooks are all different.
      However what you can do is create a new widget and add the YARPP widget to it.

  9. Hey, thanks so much for this. It is just what I was looking for.
    I have added the code to my child theme’s functions.php and it works a treat, however the share buttons are still showing after the post as well – any tips on how to remove them from here? I only want them at the top, and preferably before the content section itself, so really I’d like them to show tucked up under the page title.

    I was previously using some other social buttons and I managed to hack them into my custom template in the correct location using this code, but I’d prefer to use the Jetpack buttons, I just can’t get them to show in the correct location:

    Many thanks

  10. Hi Brad
    The above / below fold graph is pretty interestind.
    Looks as though having those sharing buttons right at the top is a must?

    And many thanks for the plugins and code.
    I’m assuming that you go with the code, or am I wrong?

  11. Hi Brad,

    Thank you very much for the Information, you must have been reading my mind. Just last night I wanted to add new social media buttons to my website, and was trying to figure out which ones to use and where I wanted to place them. I see a lot of websites that place their buttons above the fold, but also in the middle and at the end of their content. I’m going to try use this plugin it sounds like it will help me configure my social media buttons on my site quick, easy and exactly where I want and need to place them.
    Thank you again, your blogs have been so helpful to me, being a newbie and all:-)

    Keep up the great work and take care.
    Stephanie

Leave a Reply