Design, save and reuse a section.
Style one section with spacing, type, colour and borders, save it and reuse it as a template
Build one section with care and use it again on every page that needs it. You style an Open Day callout with spacing, a larger font, brand colours and rounded corners. Then you save the page, keep the section as a template and insert it again. Each styling step has its own guide when you want more detail.
The video styles the callout, saves it as a template and inserts it a second time.
Before you start
- You can edit a page with DXPR Builder, and it has a section to work in. See Build your first page.
Set up
- Click + inside the section, open the Content tab of the element picker and pick Text. Its settings dialog opens.
- Type your announcement and set its first line to Heading 2.
- Open the Style panel of the same dialog and set the top and bottom of Padding to 40 pixels in the box model.
- Set Font size to 20.
- Pick a white Font color and a navy Background.
- Set Border radius to 12 and click Save.
- Click Save on the DXPR Builder toolbar.
- Point at the callout and click More on the outermost control bar, the one for the whole section, then choose Save as template, type a Template name, tick Global template and click Save.
- Click + on the DXPR Builder toolbar, open the Saved templates tab and click your template.
- Click Save on the DXPR Builder toolbar.
What you see
The callout is a navy block with white, larger text, room above and below, and rounded corners. After step 9 a second copy sits on the page. The copy is independent: change its text and the first callout stays as it was. Your template now waits in the Saved templates tab on every page. With Global template ticked, other editors see it too.
Each styling step has a guide of its own:
- Spacing: padding and margins in the box model.
- Typography: font size and font colour.
- Colour and branding: colours that match your brand.
- Borders and shadows: border radius, border style and drop shadow.
- Backgrounds: colours, images and effects behind an element.
- Rows and columns and Responsive design: layouts and screen sizes.
- User templates and Saved templates tab: saving and reusing sections.
If you don't see your template
- The template is not in the Saved templates tab. The save did not finish, or you are on another site. Save the section again from its More menu and check for the template name in Search.
- The More menu saved the whole page instead of the section. You used More on the DXPR Builder toolbar. Use More on the section's own control bar, the outermost one.
- The text did not get larger or white. You changed the settings of another element. Open the Settings of the Text element itself and check Font size and Font color in its Style panel.
What's next?
- User templates: manage, share and delete your templates.
- Design guides: colour, buttons, cards and full-width layouts.