Customize A Social Sharing Element

This tutorial explains how to customize or create a social sharing element on your page. You can use preset icons or create your own social sharing section from scratch.

Step 1: Add or Select a Social Sharing Element

  1. If your template already includes a social sharing section, you can simply edit it.

  2. To add a new one:

    • Go to the Elements menu on the left.

    • Find and select Social Sharing.

    • Drag it onto your page where you see the yellow placement bar.

Step 2: Access the Editing Options

  1. Hover over the social sharing element on your page.

  2. Click the Edit button in the green menu.

  3. This will open the Inspector Panel with all customization settings.

Step 3: Configure Social Media Links

  1. In the Social Sharing Settings section, enter the URLs for your social profiles:

    • Facebook

    • Twitter

    • Google+

    • LinkedIn

    • Pinterest

  2. Add optional Help Text — this will appear when someone hovers over an icon.

  3. Toggle each icon’s visibility on or off as needed.

Step 4: Adjust Link Behavior

  1. Scroll down to the Link Target settings.

  2. Select how you want links to open:

    • Self – open in the same tab

    • New Page – open in a new tab

    • Right Parent or Top – open in specific frame targets

Step 5: Customize the Icon Design

  1. Choose from preset Icon Styles or upload your own custom icons.

  2. To use custom icons:

    • Select Upload.

    • Choose an image from your Image Gallery.

  3. Adjust the Icon Size using the size slider.

  4. Set the Alignment — left, center, or right.

Step 6: Refine Layout and Display Options

  1. Add Margin to create space around the element if needed.

  2. Use the Custom CSS field to add your own styling code.

  3. Choose the element’s visibility:

    • Display on Desktop

    • Display on Mobile

    • Or show on Both

Step 7: Preview and Test

  1. Click Preview to see how your social sharing icons appear on the live page.

  2. Hover over an icon to check if the help text displays correctly.

  3. Click an icon to test the link behavior — for example, opening your Facebook page in a new tab.

Step 8: Save Your Changes

Once you’re satisfied with your design and functionality, click Save to apply your changes.

And that’s it! You’ve successfully customized your social sharing element with functional links, icons, and design settings.