Add the Grid Repeater Element from the Add Elements Grid in the Topbar. While adding the Grid Repeater, you can see Grid Repeater Layouts, Presets, and Designs.
Add Elements To Grid Repeater
Click the round plus icon to add Elements to the Grid Repeater. You can add an Element to any Grid Item, and the same Element will be added automatically to all other Grid Items.
Move, Resize, Rotate Elements
You can move an Element in any Item in the Grid Repeater, and the same Element will be transferred automatically to all other List Items. While editing, the changes are synchronized in all Columns.
Change Item Order
You can reorder the Grid Repeater Items by dragging them like the Grid Cells.
Convert Elements To Grid Repeater
If you duplicate a Box or selected Elements, you will see a dialog offering to convert this Box or Elements to the Grid Repeater.
You can convert the multiple selected Elements to Grid Repeater.
You can also choose the conversion option in the Property Panel.
Grid Repeater Properties
You can change the Properties of any Item in the Grid Repeater, and the same Property will be added automatically to all other Grid Items.
Change Element Background
You can default enable the Background for all Items in the Grid Elements.
You can also switch this behavior for the current Item. It works similarly for the Button Element added to the Grid Item.
Columns, Rows, And Gap
The Columns, Rows, and Gap Properties are combined into one section, like other Elements.
Add Row Marker
Like the Add Column side icon, we have added the Add Row icon to the bottom of the Grid Repeater frame to simplify the addition of the Rows.
Columns And Rows Options
Also, you can now choose the Columns and Rows operations for the Grid Repeater from the Context Menu.
Hover Effects For Grid Repeater
You can apply all the Properties with the Hover for Elements used in the Grid Repeater.
Grid Repeater in Responsive Modes
You can set the different numbers of the Grid Repeater Columns in the Responsive Modes.
## Summary
- Overview
- Video Lesson
- Add Grid Repeater
- Add Elements To Grid Repeater
- Move, Resize, Rotate Elements
- Change Item Order
- Convert Elements To Grid Repeater
- Grid Repeater Properties
- Hover Effects In Grid Repeater
- Grid Repeater In Responsive Modes
## Overview
Use the Grid Repeater to stylize grouped Elements similarly. Then, when you edit one Grid Item, all other items get the same styling automatically.
!list-repeater.png!
## Video Lesson
<iframe width="600" height="330" src="https://www.youtube.com/embed/l2p2PXBm4Tg" title="Video Lesson: Grid Repeater Element" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
[More video lessons](page:1318)
## Add Grid Repeater
Add the Grid Repeater Element from the Add Elements Grid in the Topbar. While adding the Grid Repeater, you can see Grid Repeater Layouts, Presets, and Designs.
!list-layouts-blocks.png!
## Add Elements To Grid Repeater
Click the round plus icon to add Elements to the Grid Repeater. You can add an Element to any Grid Item, and the same Element will be added automatically to all other Grid Items.
!list-add-elements.gif!
## Move, Resize, Rotate Elements
You can move an Element in any Item in the Grid Repeater, and the same Element will be transferred automatically to all other List Items. While editing, the changes are synchronized in all Columns.
!grid-repeater-editor.gif!
## Change Item Order
You can reorder the Grid Repeater Items by dragging them like the Grid Cells.
!list-reorder.png!
## Convert Elements To Grid Repeater
If you duplicate a Box or selected Elements, you will see a dialog offering to convert this Box or Elements to the Grid Repeater.
!convert-icons-grid-repeater-text.gif!
You can convert the multiple selected Elements to Grid Repeater.
!convert-multiselection-repeater.png!
You can also choose the conversion option in the Property Panel.
!convert-options-property-panel.png!
## Grid Repeater Properties
You can change the Properties of any Item in the Grid Repeater, and the same Property will be added automatically to all other Grid Items.
### Change Element Background
You can default enable the Background for all Items in the Grid Elements.
!grid-repeater-item-background.png!
You can also switch this behavior for the current Item. It works similarly for the Button Element added to the Grid Item.
!grid-repeater-item-background-one.png!
### Columns, Rows, And Gap
The Columns, Rows, and Gap Properties are combined into one section, like other Elements.
!grid-repeater-reworked.png!
### Add Row Marker
Like the Add Column side icon, we have added the Add Row icon to the bottom of the Grid Repeater frame to simplify the addition of the Rows.
!add-row-button.gif!
### Columns And Rows Options
Also, you can now choose the Columns and Rows operations for the Grid Repeater from the Context Menu.
!columns-rows-context-menu.png!
### Hover Effects For Grid Repeater
You can apply all the Properties with the Hover for Elements used in the Grid Repeater.
!hover-animation-grid-repeater.gif!
## Grid Repeater in Responsive Modes
You can set the different numbers of the Grid Repeater Columns in the Responsive Modes.
!list-responsive.png!
##
