Custom Blocks

Site Builder is no longer sold by Vista. This article is only relevant if you purchased a website from Vista before March 9, 2022.
If you're interested in purchasing a website, you can learn more at Vista x Wix.

Sitebuilder has a number of pre-made blocks that make it easy to add content to your page. In some cases, you might need a block combination that is not already available.

Custom blocks allow you to create your own combinations, adding elements like images, paragraphs, videos, social media icons and more.

Go to Add Page Sections > Custom Blocks and drag one of the empty grids onto your site. Your options are Grid 1x1, Grid 1x2, Grid 1x3, and Grid 1x4. You can continue adding additional rows and columns if you like.

customblocks.jpg

Once your empty grid is in place, you can add elements, columns and rows, or adjust your block settings.

customblocks_emptygrid.jpg

 

Elements

Click the green plus sign in your grid to begin adding elements.

custom_blocks_elements.jpg

Options and settings for elements will vary. Click more for additional details on how to customise each element.

Once your element is in place, you can start customising. A single cell can hold more than one element, so you may decide to keep adding elements to one cell instead of adding more rows and columns.

To add another element to a cell:

Hover on the top-middle border of the element and click the green plus sign. This will launch the elements menu again.

customblocks_addanotherelement.jpg
The additional element will insert above the first one. If you want to move the element, just click it to launch the toolbar and select the move icon.

custom_blocks_moveelement.jpg

NOTE: When adding elements, rows or columns, remember to preview your site to see how it will display on mobile devices. Elements that appear horizontally will stack vertically on mobile screens. The preview button is located at the bottom of the left sidebar menu.

 

Rows & Columns

You can add rows and columns to your block and continue adding them even after you've filled them with elements.

To add a new row:

addrow.jpg

Click the add row button in your block settings.

Click the highlighted area where you want to add your new row.

NOTE: When adding elements, rows or columns, remember to preview your site to see how it will display on mobile devices. Elements that appear horizontally will stack vertically on mobile screens. The preview button is located at the bottom of the left sidebar menu.

 

To add a new column:

addcolumn.jpg

Click the add column button in your block settings.

Click the highlighted area where you want to drop your new column.

Continue adding elements after you've created a new column. You can also hover on the column borders to resize.

To delete columns, hover on the border and click the settings gear that appears at the top. Then click the trash icon.

For more Column Settings click here.

Custom BlocksFollow

Site Builder is no longer sold by Vista. This article is only relevant if you purchased a website from Vista before March 9, 2022.
If you're interested in purchasing a website, you can learn more at Vista x Wix.

Sitebuilder has a number of pre-made blocks that make it easy to add content to your page. In some cases, you might need a block combination that is not already available.

Custom blocks allow you to create your own combinations, adding elements like images, paragraphs, videos, social media icons and more.

Go to Add Page Sections > Custom Blocks and drag one of the empty grids onto your site. Your options are Grid 1x1, Grid 1x2, Grid 1x3, and Grid 1x4. You can continue adding additional rows and columns if you like.

customblocks.jpg

Once your empty grid is in place, you can add elements, columns and rows, or adjust your block settings.

customblocks_emptygrid.jpg

 

Elements

Click the green plus sign in your grid to begin adding elements.

custom_blocks_elements.jpg

Options and settings for elements will vary. Click more for additional details on how to customise each element.

Once your element is in place, you can start customising. A single cell can hold more than one element, so you may decide to keep adding elements to one cell instead of adding more rows and columns.

To add another element to a cell:

Hover on the top-middle border of the element and click the green plus sign. This will launch the elements menu again.

customblocks_addanotherelement.jpg
The additional element will insert above the first one. If you want to move the element, just click it to launch the toolbar and select the move icon.

custom_blocks_moveelement.jpg

NOTE: When adding elements, rows or columns, remember to preview your site to see how it will display on mobile devices. Elements that appear horizontally will stack vertically on mobile screens. The preview button is located at the bottom of the left sidebar menu.

 

Rows & Columns

You can add rows and columns to your block and continue adding them even after you've filled them with elements.

To add a new row:

addrow.jpg

Click the add row button in your block settings.

Click the highlighted area where you want to add your new row.

NOTE: When adding elements, rows or columns, remember to preview your site to see how it will display on mobile devices. Elements that appear horizontally will stack vertically on mobile screens. The preview button is located at the bottom of the left sidebar menu.

 

To add a new column:

addcolumn.jpg

Click the add column button in your block settings.

Click the highlighted area where you want to drop your new column.

Continue adding elements after you've created a new column. You can also hover on the column borders to resize.

To delete columns, hover on the border and click the settings gear that appears at the top. Then click the trash icon.

For more Column Settings click here.

Want to contact us?
phone
0800-222-062
Mon. - Fri. 11:00 AM-1:00 AM NZST
chat
Live Chat
Talk with a specialist
email
Send email
We'll answer you within one working day