How to add Social Profile Links automatically below content of posts

3 min read

Getting Started with Network Display #

Before using any display method, you must first set up your networks in the plugin settings. If this step is skipped, the display button will not appear.

Adding Profile Buttons Automatically Below Content of Posts #

The option can be enabled from the Profile Links -> Content Bar menu. The feature will add the profile buttons only below the content of Posts. It will not add on pages or additional custom post types you have. If enabled you will see a design like this:

How to add Social Profile Links automatically below content of posts 3 - Documentation for Easy Social Share Buttons
How to add Social Profile Links automatically below content of posts 5

Content bar options

  • Align content – select the alignment of the profile buttons based on the content area. The alignment will work only if you do not use the fluid width (stretched to the entire content width).
  • Custom content position – the option will work only if you provide custom content. You can choose to appear before the buttons on a new row or at the left before buttons (on the same row).
  • Custom content – this is the content that may appear with your profile buttons. HTML and shortcodes supported.
  • Profile buttons width – select the width of the buttons. If you leave it at default the buttons will appear as square boxes. If you select a fluid full width, the plugin will automatically stretch to fit in the content area width. The fluid full width is not suitable if you have many social networks.
  • Align profile buttons – choose alignment of the content in the social profile buttons only.
  • Show CTA texts – enable if you wish to see the custom texts you set. If you enable, check the design if you use the fluid full width – if you have multiple buttons with CTA texts that may not fit well in the content. In this situation, we recommend the usage of the default width.
  • Show numbers – display entered in the settings social profile numbers for followers/likes.
  • Remove spacing between buttons – remove the default spacing between buttons and connect them.
  • Choose the template that you will use – select the template for the buttons. You can use any of the available templates.
  • Choose animation that you will use – select hover animation over the buttons. The animation will reflect only the bar below the post and none of the other instances.
  • Profile buttons size – increase or decrease the default size of buttons. The size change usually reflects over the space and icon size. Only on the smaller sizes, it will also correct the font size of CTA text.

You can use the following custom CSS selectors to do additional style changes. We recommend adding the code in Style Settings -> Additional CSS, but you can also do that in your favorite plugin.

  • .essb-profiles-post – this is the main class of the element
  • .essb-profiles-post .user-content – this is the class of the element where user content is shown
  • .essb-profiles-post .user-buttons – this is the class of the element where buttons are shown

What are your feelings