--- title: "Customizer" description: "Edit your store on a live preview, build pages from sections and elements, add banners and publish when you are ready." url: "https://docs.poltura.com/en/online-store/customizer/" lang: en alternates: en: "https://docs.poltura.com/en/online-store/customizer/" hu: "https://docs.poltura.com/hu/online-store/customizer/" --- # Customizer Edit your store on a live preview, build pages from sections and elements, add banners and publish when you are ready. - Where: Online store → Themes → Customize The customizer is the visual editor of a theme. It shows your store as a live preview with your real products and content. You change it by clicking on the page. Everything you do is saved to the theme's draft. Customers see it only after you publish. ![The customizer with the page structure in the left sidebar, the store preview in the middle and the top bar with the page menu, device switch, language, Assistant, Code and Publish](https://docs.poltura.com/screenshots/en/online-store/customizer.webp) _Click anything in the preview or in the sidebar to select it._ ## Open the customizer and find your way around Open **Online store**, choose **Themes** and choose **Customize** on a theme's row. - **The preview** in the middle is your store. Click any section or element to select it. - **The sidebar on the left** lists the structure: **Header**, the sections of the page you are on, **Footer**, **Banners**, **Share images**, **Emails**, **Theme settings** and **Pages**. - **The panel on the right** shows the settings of whatever you selected. - **The top bar** holds the page menu, the device switch (**Desktop**, **Tablet (768 px)**, **Mobile (390 px)**), the language, **Preview as**, undo and redo, the **Assistant**, **Code** and **Publish**. **Exit** takes you back to the theme. The save state next to the theme's name reads **Saved**, **Saving…**, **Unsaved changes** or **Not saved**. A **Draft** chip means this theme is not the live one yet. ### Move between pages Open the page menu in the top bar to pick any page: shop pages, account pages, content pages, your own pages and menu panels. You can search it or type a path. On the preview, hold `Ctrl` (`Cmd` on a Mac) and click a link to follow it. **Preview as** switches between a **Guest** and a **Signed-in customer**, so you can check what each one sees. ## Add and arrange sections Pages are built from sections stacked on top of each other. 1. Go to the page you want to change. 2. Choose **Add section** in the sidebar. 3. Pick a section from the gallery. You can search it or filter by category. 4. Choose **Insert**. The section appears on the page and its settings open on the right. 5. Fill in the content. Drag the section in the sidebar to move it, or use **Move up** and **Move down**. From a section's menu you can **Hide**, **Duplicate** or remove it. Templates such as the product page, cart or a blog post keep one core section that cannot be removed. So the page never loses its essential content. The **Header** group holds the **Promo bar** and the header. The **Footer** group holds the footer, the **Cookie bar** and the **Chat widget**. See [Theme settings](https://docs.poltura.com/en/online-store/theme-settings/) and [Cookie consent](https://docs.poltura.com/en/online-store/cookie-consent/). ## Build with elements The elements editor is in Beta. Elements are the smaller pieces inside a section: headings, text, buttons, images, columns, product cards and more. 1. Select a section or an element on the page. 2. Open **Add** and stay on the **Elements** tab. 3. Drag an element onto the page, or click it to insert it next to your selection. 4. Click the element and edit it on the right. Elements come in groups: **Layout** (Container, Columns, Spacer, Divider), **Basic** (Heading, Text, Button, Icon, List), **Media** (Image, Video), **Interactive** (Tabs, Accordion) and **Commerce** (Product card, Product grid, Price, Add to cart, Collection list, Countdown). When you want a free-form area, add a **Custom section** and choose a starting layout, for example **2 columns**, **Image + text**, **FAQ** or **Hero banner**. Everything stays editable afterwards. ## Change the content and the style The panel on the right has three tabs for an element: - **Content**: the text, image, link and other settings of the element. Texts can also be edited right on the page. - **Style**: layout, spacing, size, typography, color, background, border, effects, position and motion. Use the device switch at the top of the tab to style tablet and mobile separately. Desktop styles apply to every device until you change them there. The **Normal** and **Hover** switch styles how the element looks under the pointer. - **Advanced**: who sees the element and when, described below. Link fields let you pick a page, product, collection, category, form or web address instead of typing a URL. A button can also **Open form** in a **Popup** or a **Right side panel**. See [Forms](https://docs.poltura.com/en/online-store/forms/). ## Show an element only to some shoppers, or only for a while Display conditions are in Beta. 1. Select the element and open the **Advanced** tab. 2. Under **Show to**, choose **Everyone**, **Guests** or **Signed in**. 3. To schedule it, set **Show from** and **Show until**. Times are in your store's time zone. 4. The preview marks an element that is waiting for its start time with **Hidden now: scheduled**. On the same tab, **Anchor ID** gives the element an address on the page, so a link to `#your-id` scrolls to it. **Copy link** copies that link. ## Save a section or block to reuse it Saved blocks are in Beta. 1. Select the section or element. 2. Open **More actions** on its toolbar and choose **Save as preset**. 3. Give it a **Name** and choose **Save**. 4. Next time you add something, find it under **Saved**. A saved item keeps its text, translations and style. Deleting it from **Saved** does not change the pages that already use it. ## Add a banner or popup Banners are bars, popups, slide-in cards and full-page covers that sit on top of your store. A theme can hold up to 20. 1. Open **Banners** in the sidebar and choose **Add banner**. 2. Under **Start from a template**, pick one: **Announcement bar**, **Age verification**, **Newsletter popup**, **Discount popup**, **Slide-in promo**, **Maintenance page**, **Coming soon page** or **Blank banner**. 3. Write the text and set the buttons, image and colors. 4. On the **Behavior** tab, choose when it appears (**On page load**, **After a delay**, **After scrolling** or **On exit intent**), how often, and whether visitors can close it. 5. On the **Display rules** tab, choose the pages, devices, visitors and an optional schedule. 6. Switch **Enabled** on. The banner goes live with your next publish. The preview always shows the selected banner. The display rules apply on the live store. When two banners compete for the same spot, the one higher in the list wins. ## Change the look in one step Under **Theme settings** in the sidebar, **Theme styles** offers the three ready-made styles of your theme, for example **Neutral**, **Warm** and **High contrast** in Poltura. A style sets the colors, the corner radius and, in most themes, the fonts. Your content and sections stay as they are. The other groups under **Theme settings** are described on the [Theme settings](https://docs.poltura.com/en/online-store/theme-settings/) page. ## Translate while you edit The customizer edits one language at a time. Choose the language in the top bar. Layout, colors, links and media are shared by every language, and only the text differs. Each text shows whether it is **Translated**, **Machine translated**, not translated or outdated. You can translate a single field, **Translate this element**, **Translate this section**, **Translate this page**, or everything that is missing in a language. Machine translation uses [AI credits](https://docs.poltura.com/en/assistant/ai-credits/). ## Undo, history and the assistant - **Undo** and **Redo** are in the top bar. **Show history** lists every step with who made it (**You**, **Assistant** or **Elsewhere**), and you can jump back to any of them. - `Ctrl` + `K` (`Cmd` + `K` on a Mac) opens the command bar. Type to find a section, a page, a device, a style or a setting, or to ask the assistant. - The **Assistant** button opens Klea beside the preview. It knows which page and element you are on, and each of its edits is a step you can undo. **Ask AI** on an element's toolbar offers rewrites of a text. The assistant in the customizer is in Beta. See [Klea, the assistant](https://docs.poltura.com/en/assistant/). ## Publish 1. Check the page on **Desktop**, **Tablet** and **Mobile**. 2. Choose **Publish** in the top bar. 3. The button reads **Published**, and a notice lists what went live. If the theme was not the live one, publishing makes it live. See [Themes](https://docs.poltura.com/en/online-store/themes/#publish). ## Good to know - A page can hold up to 40 sections and 1,000 elements. Elements can be nested 5 levels deep, with up to 24 items in one container. - A content page can keep the shared page layout or get its own. Choose **Customize this page only** to give it its own layout, and **Reset to shared layout** to go back. - The pages visitors see while the store is closed (**Coming soon**, **Maintenance**, **Payment needed**) are under **Store access pages** in the page menu. When they show is decided in [Store status](https://docs.poltura.com/en/settings/store-status/). - If someone else edits the same theme, or the code editor saves a change, it arrives in your customizer live. Edits to different settings are merged. ## If something goes wrong - **"Autosave failed" or the state reads Not saved.** Click the save state to try again. Your edits are still in the editor. - **"The theme's code has an error, so the preview shows its last working version."** Your live store is unchanged. The fix is in the theme's code: open the [code editor](https://docs.poltura.com/en/online-store/code-editor/) with **Code**. - **"Publish failed".** The new version could not be prepared. Your live store is unchanged. Try again. If the notice mentions the theme's code, fix it in the code editor first. - **Nothing can be added here.** That part of the page has a fixed layout. Select another section or element. ## Related - [Themes](https://docs.poltura.com/en/online-store/themes/) - [Theme settings](https://docs.poltura.com/en/online-store/theme-settings/) - [Menus](https://docs.poltura.com/en/online-store/menus/) - [Storefront wording](https://docs.poltura.com/en/online-store/theme-copy/) - [SEO and sharing](https://docs.poltura.com/en/online-store/seo-and-sharing/) - [Cookie consent](https://docs.poltura.com/en/online-store/cookie-consent/) - [Emails](https://docs.poltura.com/en/settings/emails/)