How to Insert Share Buttons, Custom Scripts between Content Paragraphs

Total Shares:

6


Add One!

wordpress codes

wordpress codes

We know that WordPress supports filters and hooks that allow us to add Social Share buttons or custom scripts before and after the post content, post title etc. But all of us end up using Plugins like Quick Adsense to insert Ads and custom codes between the post content.

For your information, by between the content paragraphs and between the post content I mean the following highlighted area in a WordPress post.

Example of "between content" scripts

Example of “between content” scripts

You can see the live example below this paragraph, I have inserted the Facebook Like and Twitter Follow buttons below this paragraph. Click them to follow us on the respective social networks.

Thank you for the Like and Follow. :) Now back to the tutorial.

To insert Share buttons like how I have done or to add any of your custom scripts, All you have to do is edit your theme’s functions.php and add the code I will share with you below. For the step by step approach keep reading.

Inserting Social Share Buttons or Custom Scripts between Paragraphs.

Step 1. Make a backup of your functions.php and style.css (or what ever your stylesheet/CSS is named in your theme).

Step 2. Open functions.php and paste following code at the bottom.

Change the number 3 on line number 6 to any number you want, After that number of paragraphs the Social Buttons will be displayed.

Also paste the custom codes or scripts you want to display in the $new_content value.

add_filter( ‘the_content’, ‘hacktabs_between_post’ );
function hacktabs_between_post( $content ) {
if( !is_single() )
return $content;

$paragraphAfter = 3; //ENTER PARAGRAPH NUMBER

$content = explode ( “</p>”, $content );
$new_content = ”;
for ( $i = 0; $i < count ( $content ); $i ++ ) {
if ( $i == $paragraphAfter ) {
$new_content .= ‘<div class=”hacktabsbtns”>’; //STARTING OF DIV TAG

$new_content .= ‘

PASTE YOUR SOCIAL SHARE BUTTON CODES OR CUSTOM SCRIPTS HERE
EXAMPLE: FACEBOOK LIKE BUTTON OR TWITTER TWEET BUTTONS.

‘;

$new_content .= ‘</div>’; //ENDING OF DIV TAG
}
$new_content .= $content[$i] . “</p>”;
}
return $new_content;
}

Step 3. Now Open style.css and paste the following code at the bottom.

.hacktabsbtns {

padding: 4px;

}

Step 4. Save both the files and clear your browser and WordPress cache (If you are using any Caching plugins).

After you paste and save the above codes you will be able to display your Social Share buttons or Adsense Ad codes between the content paragraphs.

If you have any doubts, Use the comment form below to ask them. Share this post with your friends on Twitter, Facebook and Google Plus.

Leave a Reply

Your email address will not be published. Required fields are marked *


− three = 6

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>