CTA button

CTA Button

Welcome to the “CTA Button” documentation. Looking to integrate a CTA button into your website? Our widget empowers you to boost user engagement and prompt specific actions, transforming visitors into active participants or customers. In this guide, we'll show you how to use the editor to customize your CTA button widget.





Step 1: Open the Editor
1. Go to  CTA Button template.
2. Click on "Edit" after choosing your template.




Step 2: Configure settings
In this panel, you'll handle the settings:
1. Start in the "Action" section where you can choose the action to apply on your button


  • Choose "Link" option to redirect users to a specific link from your choice.


  • Select the "Click" option, then enter the XPath of the element you wish to click after the user clicks on the button widget.


  •  Trigger any key press by choosing the "Press" option, then enter the XPath of the element you wish to click after the user press the typed key.



  • 2. Move on to the "View" section where you can choose the button's display style either as a circle or standard. Select the button type, adjust its size and roundness. You also have the option to show or hide the label.





  •  Additionally, customize the button's style, position, adjust the border, select an animation, and set the duration for how many seconds you want the animation to repeat.





  •  Finally, fine-tune the button's margin, and switch the cloasable option to make the button closable.





  • 3. Next, you can opt for each left and right icons.






    Step 3: Choose Colors

    Within this panel, you can select colors that match your website's design.



            

    Step 4 : Preview

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



    Find element Xpath 

           If you have an element inside your website or you are using different widget inside your page, you can extract the XPATH using a simple method.

          1. Right-click on the element inside your page, then click "Inspect element"
          2. Go to the element highlighted and "Right-Click" again, then go "Copy" > "Copy Xpath"

    Copy XPATH