For the on-trend design, you can add colour or image backgrounds to your blocks within your Stack Specific design control, Column settings section.
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.
Column Settings
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.
- Column Border
- Corner Radius
*see further down the page for how to reduce or increase internal column spacing using Width & Spacing controls.
Get started:
- 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 eight different drop-down menu tabs for editing and customising the stack.
Add 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).
Add a Column Border.
1. You will see two boxes underneath the title "Column Border". The one on the left is for the thickness of the border and the one on the right is the colour of the border.
Column Border Offset settings.
1. If you click on the three dots found next to the title "Column Border", this will take you to the Column border offset settings
Add Corner Radius
1. Underneath the title "Corner Radius", you will see a slider like in the image below and this changes the radius of the column border! The higher the number is, the rounder the corners will become.
2. If you click on the tick box that states "Control Corners Individually", this allows you to choose which corners you want rounded and which you want to stay the same.
Need more assistance, no problem.