# 7. How to Manage Banners

The **Banners** section lets you upload, localize, and control the display of your website’s header graphics across multiple screen resolutions and languages.

The **Banners** section is designed to store banners for your websites. In this section, you can:

1. Add banners for different language versions of the website.
2. Add banners with different resolutions.
3. Add descriptions to the banners.
4. Activate and deactivate banners.
5. Delete banners.

##### To add a new banner:

1. At the top of the page, click the language tab (English, Bulgarian, Spanish, etc.) to switch to the version of your site you’re editing (e.g., “English” is highlighted when active).
2. Drag the image or click to view the images on your computer in the block with the appropriate resolution. The available resolutions are:  
    1444 to 1920 px  
    1024 to 1444 px  
    640 to 1024 px  
    375 to 640 px
3. Upload images for all resolutions.

If you need alt-text or contextual notes:

1. Click the **+ Add description** button in the top-right corner.
2. A description field appears under each banner slot—enter your text (e.g., “Homepage hero for summer campaign”).
3. Descriptions are per‐language, so switch tabs to localize.
4. **Activate** the entire set by checking the **Active** toggle in the upper-left.
5. **Deactivate** by unchecking it—this hides all banners for that language until you’re ready to go live.

<p class="callout info">Note: Banners can only be activated once they are set for all resolutions.</p>

To update one resolution:

1. Hover over the banner slot and click **Delete** (🗑️) in its top-right.
2. Upload a new image into the now-empty drop zone.

You can delete any single slot independently without touching the others.

##### Best Practices &amp; Tips

1. **Consistent Styling:** Use a single design template cropped to each resolution, rather than entirely different visuals—this preserves brand style across devices.
2. **Optimize File Size:** Compress images to balance quality and load speed (aim for ≤ 150 KB per banner).
3. **Test Viewports:** After uploading, preview in different browser widths to confirm the correct banner is served.
4. **Language Checks:** Always switch tabs and proof your **descriptions** and any embedded text on the banners themselves.
5. **Version Control:** When replacing assets, keep old files archived locally in case you need to roll back.

By following these steps, you’ll maintain a responsive, localized banner library that adapts beautifully across devices and languages.