# Image Banners

In Opal, it is possible to set image banners so that the size corresponds to the sample template. Just copy the code below into the section:

Administration > TEMPLATES > Editor of the appearance > HTML code > Header (bottom of the HEAD tag)

The code you will be copying

<link rel="stylesheet" href="https://cdn.myshoptet.com/usr/shoptet.tomashlad.eu/user/documents/extras/opal/banners-default.css?v=9">


It is possible to set text banners, the documentation of which can be found here 👉 Banner settings, or you can try our Code generator ☝️.

# Mobile

Since image banners are scaled in Opal, some croping of text that is in the banner graphics can be cropped. If you are using Image banner type, we highly recommend to use two sizes for Desktop and Mobile.

For mobile, make sure you use banners with ration 1:1 and keep in mind the smallest resolutions of devices, which 320px of width. In this case, the maximum width for your contains equals 288px

The image below shows the content area that will be displayed on such devices. Anything outside the highlighted are will be cropped.

An image


This banner's dimensions are 400x300px which is a minimal recommended size for mobile banners.