1. Home
  2. Docs
  3. Xpro Elementor Addons
  4. Free Elementor Widgets
  5. Social Share

Social Share

How to Install Social Share Widget for Elementor

Xpro Social Share widget for Elementor is another amazing FREE widget that allows you to share your page or post on different social media platforms with just a click of a button. The widget offers 20+ hover effects and supports more than 15+ social networks making it the easiest way to share your blogs, posts, and latest updates to gain popularity on social media.

You can do tons of styling customizations for the icon and background to make the most creative and attractive social share layout for your Elementor sites. Xpro Elementor Social Share is an easy-to-use free widget for creating functional and attractive social shares layout on your WordPress website. The Social Share Widget offers unlimited customizability options for full control over the styling and hover options. Let’s take a closer look at how you can fully utilize this incredible widget.

Requirement

You need to install and activate the free version of Xpro Elementor Addons. If you already have the plugin installed, just make sure the Social Share Widget is ‘Enabled’ from the Xpro Elementor Addons dashboard. , so you can find it in the Elementor editor.

To enable the widget, simply follow these steps:

Step 1

Click on the Xpro Addons option available on the WordPress Dashboard Menu.

Step 2

From the Xpro Addons Dashboard, click on the Widgets tab, find the Social Share Widget, and then toggle the button ‘ON’ to enable it.

How to Use Xpro Social Share Widget for Elementor

Our Social Share widget is a handy tool that allows you to easily share content on social media platforms on your Elementor website. You can now easily showcase your social media presence using our impressive Social Share Widget. This simple-to-use widget allows you to create a trendy social share layout in no time. So let’s get started.

Step 1

Click on the Xpro Addons section available in the Elementor Editor.

Step 2

From the Xpro Addons section, find the Social Share widget, and simply drag’n’drop it on your desired page location.

This is the default view of our Xpro Elementor Social Share widget.

How to Add Content in Xpro Social Share Widget for Elementor

Start from the General Section in the Content Tab. Click on any of the default options and from the drop-down menu that appears. Here you can add & change from any 15 + social media platform where you want to showcase your content. You can disable & enable the title option as well.

However, if you want to keep all the default options then you can click on the “Add Item” button to add more networks for social sharing.

Now let’s add a Social Share with a website URL for the specific Social Share from the “Custom Link” option.

After that, you can turn on the Infinite Style option. The will allow you to separately style the Social Share the way you want or best according to the theme of the website.

Let’s explore more options available in the same General Section under the Content Tab. You can set the position of your Social Shares layout from the Alignment option. Moreover, you can set the number of columns from the Columns option under the General section.

Try our free Elementor Theme Builder to customize the default WooCommerce product and category templates.

By Xpro Elementor Addons

How to Style Xpro Social Share Widget for Elementor

Now let’s style the Social Shares to make them look more attractive on the website. You can design your Social Share widget with the following options from the Style tab:

  1. Customize the Column and Row Gap Separately
  2. Customize the icons, titles, and background-color
  3. Add a border to Social Shares (5 options)
  4. Add a box shadow with a custom color
  5. Customize border radius and padding
Customize The Icons, Title And Background Color

You can add an icon, and title or background color to all the Social Shares simultaneously as you please or best according to the design theme of your website.

Note: If you don’t want to add the same color to all the sections. You can jump back to the Content Tab and click any of the added options and turn on the “Infinite Style” option and style them the way you want.

Add Border to Social Share Widget

Choose the border of your choice (5 options) from the Border Type option. You can customize the color of the border and border width using this option.

Add Box Shadow

Click on the ‘edit icon’ adjacent to the Box Shadow option available in the General section of the Style Tab. A pop-up box will open, from here you can choose the color for blur, set blur intensity, and more.

Adjust Icon & Background Size

Now Just quickly head towards the Icon Section under the Style Tab. Here you can easily adjust the size of the icon and its background to make it more attractive for the users.

Adjust Title Typography & Space

The widget also allows you to change the typography and adjust the spacing.

How to Add Hover Animations to Elementor Social Share Widget

Now it’s time for the best part to add a hover effect to your Social Share layout to make it more appealing on the website. Head back towards the General section of the Style Tab. Click the hover options and select the hover color as you like.

Your Social Share will look like this after you add a nice hover effect for opacity.

Now let’s add hover animation to your Social Shares. To do this, simply choose the animation you like from the Hover Animation option.

You can choose the Any Hover Animation from

  • More Than 20 2D Hover Animation
  • More Than 18 Background Hover Animations
  • 3 Unique Hover Animation

Your final Social Share will look something like this.

Best Social Share Widget for Elementor

That is all from our Social Share Widget for Elementor. We hope now you have a better understanding of how to fully utilize our easy-to-use Social Share widget and decent present all your social media accounts on your website. This widget is best for showcasing your social media presence over multiple social media platforms. If you want to explore and add more attractive Elementor widgets then check our complete list of free Elementor widgets and download our free Elementor addons now.

Moreover, check our other promising widgets like Social Icon for Elementor to showcase your social media presence on your website. Moreover, our Xpro Elementor Addons lets you add floating effects on almost all widgets. Head over to our detailed guide on How To Add Elementor Floating Effect for your WordPress website.

How can we help?