Create a Grid using Code only

Ask the community
1

What I want to do is to grab an element on my page like a box using $w(“#box1”) and let that into a variable like let myBox = $w(“#box1”);

Then I want to create a grid system using code only like

import {gridSystem} from 'wix-grids';

let grids = gridSystem.new();
grids.position.after(myBox);
grids.layout = "fullWidth";
grids.columns = 4;
grids.rows = 1;
grids.render();

Then I want to add elements into the grids columns by using code as well, like.

import {elements} from 'wix-elements';

let imageObject = elements.insert("Image", grids.columns[0], "center");
imageObject.src = "src url to image";
// or other properties

This feature would be cool to use to create more dynamic and more advanced pages.

1 Like