Social Share

Social Share

Welcome to the “Social Share” documentation. Looking to integrate Social Share into your website? Our block enables you to create a seamless social sharing experience for your users. In this guide, we'll show you how to use the editor to customize your social share block.

Step 1 : Open the Editor
Step2 : Customize The Content 
Step 3 : Configure Settings
Step 4 : Preview



Step 1 : Open the Editor

1. Go to Social Share template.
2. Click on "Edit" after choosing your temp   late.

class="" alt="">



Step 2: Customize the content


1. In this panel, you can easily, add or remove chat buttons as needed.


class="flex justify-center items-start h-auto w-96" alt="">



2. Customize each one by adding the social URL. You can also choose each chat colors


class="flex justify-center items-start h-auto w-80" alt="">




Step 3: Configure settings


In our social share block, we offer two distinct styles, each with its own settings panel. Let's explore how they function.


class="flex justify-center items-start h-auto w-128" alt="">




1. For the first style :

  • Adjust the roundness of the social buttons, choose their position and alignment, specify the spacing between them, and set the margin.


    • class="flex justify-center items-start h-auto w-80" alt="">



  • Customize the share button by deciding whether to display it, adjusting its roundness, selecting an icon, and choosing its colors.


    • class="flex justify-center items-start h-auto w-80" alt="">



    2. In the second style, you only need to select the position, decide whether to show buttons with labels, specify the spacing between them, and adjust their roundness.


    class="flex justify-center items-start h-auto w-80" alt="">




    Step 4: Preview


    Lastly, you can click on “Preview” to see how your Social Share block looks on both desktop and mobile devices. After this, you can proceed to the next step.


    class="flex justify-center items-start h-auto w-auto" alt="">