Tutorial: Add social share buttons to blog pages or any CMS Template page


In this tutorial, you will learn how to add social share buttons to your individual blog pages, or any CMS Template page, using Social 9, a free Social Share Widget. This makes it easy for your readers to share your great content and drive more traffic to your site!

Browse the blog to see a live example, or go directly to one of the blog posts.

Step 1: Create your social share buttons

Open up the Social Share Widget Editor: https://www.social9.com/get-free-social-share-buttons/

Select the "Code your own" option.

Select the style of share buttons and the networks you want to include.

Step 2: Add the script to your page

Copy the code provided by Social 9.

Edit your Template Page settings.

Add the code to the Before </body> tag section.

Step 3: Create the Share widget Div

Note the class name provided by Social 9.

Add a div to your page and give it the Social 9 class name. Place it on your page wherever you want the social share buttons to appear. Note that you can add this div to multiple places on your page if you'd like.

Step 4: Set the PAGE Title

This step is not required, but recommended for better share content.

In the SEO settings, set the Title Tag to the Title field on your blog post.

You could even do something fancy like "Your Page Title - Blog Post Title" :)

Step 5: Publish your site

Publish your site and test it out!

If you want to try out different share button styles, just make your changes in the Social 9 editor and copy and paste the new code that they provide you.

You can also use this method on regular, non-CMS Template pages, but it's especially useful for Template Pages!