1. Home
  2. Marco HTML
  3. Elements
  4. Call to action

Call to action

Marco offers the ability to use “call to action” element in content all pages except “Homepage”. This element is structured with image and header with button. We created 3 templates of “call to action” element. You can modify this appearance by adding classes presented below.
 

Style classes:

 

cta-right-img
will appear with header on the left side and image on the right side
cta-left-img
will appear with header on the right side and image on the left side
cta-bg-img
will appear with header and background image *

* if you want to use dark image, add class cta-content-light
 

... 
   ELEMENT WITH IMAGE ON THE LEFT/RIGHT SIDE
   <div class="element-cta cta-right-img">
      <div class="image-content img-wrapper">
         <img src="image url">
      </div>  
      <div class="cta-content animate-text loaded-text">
          <h6>header text</h6> 
          <div class="btn btn-md btn-border-animate btn-content">
          ...
             BUTTON
          ...
          </div>  
      </div> 
   </div>  
   
   ELEMENT WITH BACKGROUND IMAGE
   <div class="element-cta cta-bg-img cta-content-light">
      <div class="cta-overlay"></div> <-- image overlay
      <div class="image-content img-wrapper">
         <img src="image url">
      </div>  
      <div class="cta-content animate-text loaded-text">
          <h6>header text</h6> 
          <div class="btn btn-md btn-border-animate btn-content">
          ...
             BUTTON
          ...
          </div>  
      </div> 
   </div>  
...
Was this article helpful to you? Yes No