---
title: "Change the Template Size"
slug: "change-the-template-size"
description: "Covers resizing on-page templates in Action Builder using pixels or percentages, canvas pull indicators, and Auto-fit height settings comprehensively."
tags: ["layout resizing", "resize layout", "responsive template"]
updated: 2026-04-29T06:48:35Z
published: 2026-04-29T06:48:35Z
canonical: "academy.insiderone.com/change-the-template-size"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://academy.insiderone.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Change the Template Size

> [!NOTE]
> You can only resize on-page templates.

You can modify the size of [pop-up campaigns](/docs/create-a-pop-up-campaign) based on your design content. For example, if you want a square layout that displays only an image, you can dynamically adjust the template size as the uploaded image's dimensions change.

Insider One’s Action Builder includes a Size menu in both the Preview and Design tabs, letting you easily adjust your campaign’s width and height for greater flexibility during creation.

## How template resizing works

- You can modify the width and height of templates using pixels (px) or percentages (%).
- If the Auto-fit option is set to Height, the template’s height automatically adjusts as elements are added or removed.
- Size values are synchronized between the Preview and Design tabs, meaning any change in one tab is instantly reflected in the other.

## Resize via canvas indicators

- You can also resize templates directly on the canvas using pull indicators.
- Four indicators appear around the template to visually adjust the width and height.

> [!NOTE]
> The size values are synchronized between the Design and Preview tabs. So any changes made in the Preview tab will also be reflected in the Design tab and vice versa.

![](https://cdn.document360.io/c6df4583-da94-4cb2-bb8a-be0cbdd11109/Images/Documentation/image-1698128169695.png)

- As you drag an indicator, the size values update automatically.

![](https://cdn.document360.io/c6df4583-da94-4cb2-bb8a-be0cbdd11109/Images/Documentation/fit.gif)

## Best practices

- If the template content exceeds the visible area, it will become visible when the resizing indicators are selected.
- To maintain a clean layout, always review and adjust both the template content and size values after resizing.

## Related

- [Design a Web Template](/design-a-web-template.md)
- [Create a Web Template Campaign](/create-a-web-template-campaign.md)
- [Create a Pop-Up Campaign](/create-a-pop-up-campaign.md)