# Call To Action

This Guide will Help you to edit Call to Action Widget Settings and Style.

<div class="vc_row wpb_row vc_row-fluid" id="bkmrk-note%3A%C2%A0widget-gives-y"><div class="wpb_column vc_column_container vc_col-sm-12"><div class="vc_column-inner"><div class="wpb_wrapper"><div class="wpb_text_column wpb_content_element "><div class="wpb_wrapper"><div class="ricsi info alert alert-info">  
</div></div></div><div class="vc_message_box vc_message_box-standard vc_message_box-rounded vc_color-info vc_custom_1600254685620"><div class="vc_message_box-icon">  
</div><div class="ricsi info alert alert-info"><span class=".">**Note:** Widget gives you **Default Style** provided by theme, you can customize as per your needs using this guide.</span></div></div></div></div></div></div>#### DRAG &amp; DROP CALL TO ACTION WIDGET

When you **Drag and Drop** Call to Action Widget in a Page, You will see the image shown like below.  
   
![](https://dotroll.com/wp-content/uploads/2020/08/CTA-dragdrop.png)

#### CALL TO ACTION TEXT

- You can change or customize your **Title, Subtitle and Text**.
- Text alignment gives you **alignment** of text.

   
![](https://dotroll.com/wp-content/uploads/2020/08/CTA-customtext.png)

#### CALL TO ACTION BACKGROUND

- You can change Background **shape**, Background predefined **style** or custom style.
- You can change **total width** of background also.
- You also changed **button position** in background shape and **text** of the button.

   
![](https://dotroll.com/wp-content/uploads/2020/08/CTA-background.png)

#### CALL TO ACTION BUTTON

- You can also give **button link**, and if you want that link open in new window, then **click** on checkbox.
- Button shape gives **shape of button** and choose **predefined** button color from dropdown list.
- Button size gives **predefined** Button size.

   
![](https://dotroll.com/wp-content/uploads/2020/08/CTA-button.png)

#### CALL TO ACTION BUTTON ICON

- Change Button Icon from Icon list.
- Button Icon alignment gives **alignment of Icon** such as Left and Right.
- Button animation gives **animation** from predefined dropdown list.

   
![](https://dotroll.com/wp-content/uploads/2020/08/CTA-btnIcon.png)

#### CALL TO ACTION ICON

- You can also change Icon **position** from dropdown list.
- **Change Icon** as per your choise from dropdown list.
- Change **predefined** Icon color and **custom** color, If you choose custom color then you can change custom color.  
       
    ![](https://dotroll.com/wp-content/uploads/2020/08/CTA-Icon.png)

- Icon size gives you to change **predefined** size or **custom** size.
- If you want’s to place **half Icon** on border then click on checkbox.
- Icon animation provides to change **animation style** when page loads.  
       
    ![](https://dotroll.com/wp-content/uploads/2020/08/CTA-Icon-custom.png)

#### CALL TO ACTION STYLE

Style gives 2 types of style **1)** Edit Element style and **2)** Predefined style

- **Edit Element style** gives custom style in that you can change custom background color, text color, margin, border-radius etc.
- There is no predefined style but you can give **your classes** to define your custom style.

   
![](https://dotroll.com/wp-content/uploads/2020/08/CTA-style.png)