For on-trend design, add coloured backgrounds and image backgrounds to blocks within your stack using Column Settings and Width & Spacing design controls.
Stacks are the building blocks of the website, providing a base on which content can be added and customised to create visually appealing content. For more information on stacks, head to the Stack Specific Styling help guide.
If you're not seeing the Column Settings drop down tab > See how to get access.
The Column Settings menu will show a grid of columns, a picture background upload button and a column background colour picker. By selecting a colour or image, the background of the column you've highlighted (shown by the blue outline) will be changed.
In Column Settings, you're able to:
- Add an image to the background of your column.
- Add a colour background to your column background. This applies to both text and image blocks.
- Add a video background.
*see further down the page for how to reduce or increase internal column spacing using Width & Spacing controls.
- In your dashboard, in editing mode, add a stack and block/s.
- Select this stack and click the colour wheel on the right, the Stack Specific Design Options menu is displayed on the left-hand side of the screen. There are seven different drop down menu tabs for editing and customising the stack.
Add a colour to a column background.
- Select the column you'd like to add a colour background to.
- Click the colour picker and choose a colour, then Save changes.
Add a picture to a column background.
- Select the column you'd like to add a picture background to.
- Upload your picture, and remember to Save changes.
Add a video background.
- Select stack background on the stack you would like.
- Upload video from Youtube or Vimeo.
*For more information on Video stack backgrounds How to add a video stack background?
Adjust internal column space in a block using Width and Spacing controls.
In Width & Spacing, you're able to reduce or increase the internal column spacing in a block.
- Pull the Internal Column Spacing slider (left and right), to the right to increase the padding/spacing between the image/s within a column (in this case, a picture block).
- Pull the Internal Column Spacing slider (left and right), to the left to reduce the padding/spacing between the text or image/s within a column (in this case, we've used a text block and a picture block).
Need more assistance, no problem.