---
title: "How to Add Social Share in Elementor?"
url: https://theplusaddons.com/docs/add-social-share-in-elementor/
date: 2024-07-03
modified: 2026-08-07
lang: en
author: "Aditya Sharma"
description: "Adding social share buttons on a page allows visitors to share your content on different social media platforms, expanding its reach. With the Social Sharing widget from The Plus Addons..."
image: https://theplusaddons.com/wp-content/uploads/2024/07/How-to-Add-Animated-Headings-In-Elementor-5-1024x565.jpg
word_count: 827
---

# How to Add Social Share in Elementor?

## 

- The Plus Addons for Elementor ofrece el widget Social Sharing para añadir botones de compartir directamente en Elementor.
- El widget incluye tres diseños, Horizontal, Vertical y Toggle, y seis tipos de vista: Icon, Icon Count, Text, Text Count, Icon Text e Icon Text Count.
- Display Counter permite mostrar un contador total falso o personalizado para crear prueba social desde el primer día.
- La configuración requiere Elementor FREE Plugin instalado y activado, The Plus Addons for Elementor instalado y activado, y la versión PRO porque es un widget Premium.

Adding social share buttons on a page allows visitors to share your content on different social media platforms, expanding its reach.

With the Social Sharing widget from The Plus Addons for Elementor, add social sharing buttons directly in Elementor.

**Best Used For:**

- Blog posts and news articles where readers are likely to share content across social media platforms

- Product pages and landing pages where social proof through share counts can boost conversions

- Content websites and magazines that want sticky vertical social icons alongside long-form articles

## Check the Live Widget Demo

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/elementor-social-sharing-buttons/)

## Required Setup

- [Elementor FREE Plugin](http://wordpress.org/plugins/elementor/) installed & activated.

- You need to have [The Plus Addons for Elementor plugin](https://wordpress.org/plugins/the-plus-addons-for-elementor-page-builder/) installed and activated.

- This is a Premium widget, and you need the [PRO version of The Plus Addons for Elementor](https://theplusaddons.com/pricing//?utm_source=tpae&utm_medium=docs&utm_campaign=text).

- Make sure the Social Sharing widget is activated, to verify this visit The Plus Addons → Widgets → and Search for Social Sharing and activate.

## Learn via Video Tutorial:

https://www.youtube.com/watch?v=PIfGW6Kxs2M

## How to Activate the Social Sharing Widget?

Go to 

- **The Plus Addons **→** Widgets **

- **Search **the widget name** **and** turn on the toggle.**

![Social Sharing widget activation in The Plus Addons for Elementor](https://theplusaddons.com/wp-content/uploads/2024/07/social-sharing.png)

## Key Features

- **Three Layouts** – Select from Horizontal, Vertical, and Toggle layouts to match different placement needs on your page.

- **Multiple Styles** – Choose from multiple preset styles for each layout to match your site design.

- **Fake Share Counter** – Show a custom total share counter to build social proof from day one.

## How to Use the Social Sharing Widget in Elementor?

Add the Social Sharing widget from The Plus Addons for Elementor to the page.

> *Note: By clicking on the **Import Presets** button, you can import a ready-made design and customize it as per your requirements.*

From the **Layout** dropdown, select the layout. There are three options:

![Social Sharing widget layout options in Elementor](https://theplusaddons.com/wp-content/uploads/2024/07/social-sharing-content-new.gif)

- **Horizontal** – Align social icons in a row, ideal for placing share buttons below blog posts or inside content sections.

- **Vertical** – [Align social icons vertically](https://theplusaddons.com/docs/add-sticky-social-icons-in-elementor/) and use this layout to create sticky social icons fixed to the side of the page.

- **Toggle** – [Create a social share toggle button](https://theplusaddons.com/docs/add-social-share-toggle-button-in-elementor/) that expands when clicked, keeping the interface clean until needed.

Select the option as per your requirements. To add a sticky navigation element alongside your social share buttons, see [How to Make a Sticky Table of Contents in Elementor](/docs/make-a-sticky-table-of-contents-in-elementor/).

Select a predefined style from the **Style** dropdown.

From the **View Type** dropdown, select the social button view type. There are six options:

- **Icon** – Show only social icons.

- **Icon Count** – Show social icons with a share counter.

- **Text** – Show only social text.

- **Text Count** – Show social text with a share counter.

- **Icon Text** – Show social icons with text.

- **Icon Text Count** – Show social icons with text and share counters.

Select the option as per your requirements.

From the **Column** section, manage the number of columns of the social icons.

Align the social icons for different responsive devices from the **Alignment** section. For a complementary sticky header effect on your site, see [How to Add a Shrinking Header Effect in Elementor](/docs/shrinking-header-effect-in-elementor/).

From the **Content Alignment** section, align the content on the button.

By enabling the **Display Counter** toggle, add a fake or custom total share number.

Then in the **Social Sharing** section, add the social icons. By default, there are four repeater items. Open one item.

![Social Sharing widget repeater items in Elementor](https://theplusaddons.com/wp-content/uploads/2024/07/social-sharing-repeater-items-new.gif)

From the **Social Network** dropdown, select the desired social network.

In the **Title** field, add the social network title.

Then in the **Count Number** field, add fake or custom share numbers for that social network.

In the **Count Label** field, add a label for the counter number.

Add extra text after the counter number from the **Social Button** field.

> *Note: The visibility of the Title, Counter Number, Count Label and Social Button on the front end will depend on the selected button View Type.*

By enabling the **Custom URL** toggle, add a custom link to the button.

Then from the **Normal** and **Hover** tab section, customize the title color, icon color, counter number color, counter label color, border color and background for normal and hover states.

Similarly, edit the remaining items.

Click the **+ Add Item** button to add more social sharing buttons.

## How to Style the Social Sharing Widget in Elementor?

To style the Social Sharing widget, find all the options in the Style tab. The styling options will vary based on the selected layout and view type.

**Title** – Style the social sharing button title.

![Social Sharing widget style tab options in Elementor](https://theplusaddons.com/wp-content/uploads/2024/07/tpae-social-sharing-style-new.png)

**Counter** – Style the social sharing button counter number.

**Icon** – Manage the social sharing button icon size and width.

**Toggle** – This option appears only when you select Toggle as the layout type. Style the toggle button from here.

**Total Counter** – This option appears only when the total counter toggle is enabled. Style the total counter number and text from here.

**Background** – Manage the width, height and background style of the social button container.

Advanced options remain common for all widgets. [View Advanced Tab documentation](https://theplusaddons.com/help/plus-extras/).