Banner Image tutorial
Banner Images Html Template
In this tutorial we will show you how to add in-app links to banner images html template. Click here if you don’t know how to get in-app links.
Default Banner Image Code
<!-- Banner-1 Starts -->
<div class="banner1">
<img src="https://i.imgur.com/vX8mgpc.jpg" class="banner_img" alt="img-1">
</div>
<!-- Banner-1 Ends -->
Banner Image Code with in-App Link
Suppose your in-app link code is: <a data-offline=”true” data-params=”value_id:644″ data-state=”cms-view”>Custom Page</a>
<!-- Banner-1 Starts -->
<div class="banner1">
<a data-offline="true" data-params="value_id:644" data-state="cms-view">
<img src="https://i.imgur.com/vX8mgpc.jpg" class="banner_img" alt="img-1">
</a>
</div>
<!-- Banner-1 Ends -->
Note: You just need to put <img> tag between <a> & </a> tags as shown in above example.
Another Example with in-App Links
<!-- Banner-2 Starts -->
<div class="banner2">
<div class="row">
<div class="col col_left">
<a data-offline="true" data-params="value_id:642" data-state="contact-view">
<img src="https://i.imgur.com/lKxAG9I.jpg" class="banner_img" alt="img-2">
<a>
</div>
<div class="col col_right">
<a data-offline="true" data-params="value_id:643" data-state="image-list">
<img src="https://i.imgur.com/dytcRt4.jpg" class="banner_img" alt="img-3">
<a>
</div>
</div>
</div>
<!-- Banner-2 Ends -->
