To make your banner fully responsive, make sure that all banner components adhere to a specific position when banner size changes. In order to see how the banner is going to adapt to different sizes when placed on different screens, you're able to test it in our dashboard. Follow the instructions below:
- Navigate to Banner settings.
- In the Dimensions section, select the checkboxes next to Responsive Width and/or Responsive Height.
- Once you select these checkboxes, the banner is made responsive. Test the banner by dragging height and width lines in the dashboard as shown in the image below.
Use positioning widget to define component's position. Follow the steps below:
- Click Insert Component (1) and select a component that you want to add to the banner.
- Open Size & Position section (2).
- Use the Positioning Widget (3) to define the component's orientation. Each panel of the square represents component's position in the banner.
You can set a Scale Mode (4) to define how image or object will be displayed with different ad dimensions:
- Fill mode lets the component be bigger or smaller than the banner size while retaining original proportions.
- Fit mode lets the component be smaller or bigger within the banner size while retaining original proportions.
- Limit mode lets the component be smaller or original size while retaining original proportions.
- Banner Width mode lets the component adapt its size based on the banner width while retaining original proportions.
- Banner Height mode lets the component adapt its size based on the banner height while retaining original proportions.