The Grid Line extension in Wow Elements Pro allows you to add stylish grid line overlays to your website sections and layouts without any coding. It helps create modern and structured designs by displaying customizable horizontal and vertical grid lines in the background of your content. With flexible customization controls and responsive styling options, you can easily enhance the visual depth and layout alignment of your Elementor website. In this documentation, we will guide you through how to use and customize the Grid Line extension in Wow Elements Pro.
Enabling the Grid Line Extension #
To use the Grid Line Extension from Wow Elements Pro, first, you have to enable the extension.
- Go to WordPress dashboard → Wow Elements Plugin dashboard.
- Then, Click the Extension Tab.
- Search the Grid Line Extension Name.
- Enable the Grid Line Extension.
- Hit the Save Settings Button
Where To Find The Grid Line Extension #
You need to go to the Page first where you want to add the extension. Navigate to WP Dashboard > Pages > Select the Page you want > Edit Page with Elementor. After the page opens, then follow the below steps –
1. Click on the Page Settings icon on Elementor Editor Page.
2. Now click on the settings tab.
3. Here, below the General Settings, you will find the Grid Line Extension tab.
Configuring the Grid Line Extension #
In this part we will have a look to all the options that are available on Grid Line extension. The changes you will made that will apply to the page. Let’s see what we have here and how the options works –
1. Grid Line: Enable the switcher by which you will get more customisation options below.
2. Line Color: After enable the switcher you can see the visual of the grid lines to your page. Now, with this option you can change the line color.
3. Column Color: You can make changes to the column color with this option.
4. Columns: You can add the number of columns that you want to show to your audience with this option.
6. Max Width: You can adjust the width of the grid line area with this option.
7. Line Width: You can set the thickness of the line with this option.
8. Line Direction (deg): This option controls the angle and direction of the grid lines displayed in the background. By adjusting the degree value, you can rotate the grid lines to create different visual styles and layout effects.
9. Z-index: The Z-Index option controls the stacking order of the grid lines relative to other elements on the page. It determines whether the grid lines appear in front of or behind your content.
All done, You have successfully customised the Grid Line Extension on your website.
Video Assist #
You can also watch the tutorial video about the Grid Line Extension. Please visit the demo page for examples.
Thanks for staying with us.
