Add social share icons to your blog post

CM Blogpost Custom Social Share
Johan Vantomme
Johan Vantomme
17 November 2018

HubSpot Blog HubSpot Modules

SHARE

Do you want more social traffic to your blog posts?

Wondering how to tailor your blog post shares for each network?

Properly sharing your blog posts via your social media channels will help deliver a steady stream of visitors to your blog.

How to install the custom module

Step 0: (only if you don't have yet the module in your portal): Visit our marketplace, choose and buy the Blogpost Custom Social Share Module.

Step 1: Add the module to your blog template

  1. Go to the Design Manager and open your blog template to edit
  2. Add CM Blogpost Custom Social Share in the body part of the template

  3. Save the template

Step 2: Modify the Options on the Custom Module. 

Below are the options that are available on the module

Social Icon to show - These settings will let you hide and show an icon

Social icon to show

Specify Icon or Image  You can used either an "icon" or "image"

specify icon or image

Specify Icon Shape  The icon shape can either be in "circle" or "square"

specify icon shape

Specify Icon Position  Icon position means the way the icon will behave. It can either be a fixed or absolute. Fixed position means that the icon follow you as you scroll the page while Absolute position means that the icon is in one place only

specify icon position

  • Choosing the "Fixed" icon position will give you another option which is:

    Specify Class Name - Indicate the class name to which location you want to add the social share

specify class name

  • Choosing the "Absolute" icon position will give you another option which is:

    Specify Icon Flow - The icon flow can either be "vertical" or "horizontal"

specify icon flow

Specify Colors on your icon 
These options will let you decide the icon color, background color, border color and the hover color of the social icons

specify colors on your icon

Specify Space Between Icons  You can also specify the distance between the icons

specify space between icons

Social Icon Image - These settings will let you choose the Images of the icons

social icon image

Step 3: Open a Blog Post to see the Social Share in Action

Example Social Share
example social share 

Johan Vantomme

Johan Vantomme

Johan is one of the founders of leadstreet, Diamond HubSpot Partner. HubSpot certified on 8 levels. He knows how to link technical knowledge for developing websites to a large knowledge of online and the associated commercial and marketing side. Johan is a (former) sailing fanatic and a foodie.