Weebly’s “columns” element (Multiple Column in the old editor) is a wonderful option available for both free and Pro users to overcome certain features not available in Weebly by default. For example Weebly has very limited built-in themes and none of them by default have a site sidebar or three or four columns. Columns element is the simple way to divide any page layout into columns and here is the various features of the columns element along with simple tips for how effectively you can use it in your site.
Weebly introduced Spacer element to replace Columns element with same kind of features.
Features of Columns Element
- Divide your page layout up to five columns using “Columns” element.
- Adjust the content padding using “Spacing” option.
Weebly Multiple Columns Element
- Resize the columns by just dragging the vertical bar.
- Drag and drop any other element inside any column of the element. You can also drop another “Columns” element to make it a nested multiple columns.
- Delete the content inside the columns before deleting the element.
Here is How You Can Use Multiple Columns Effectively
The trick in the “Columns” element is that the empty columns displayed in the editor are not shown in the published site. This feature can be used to adjust the width and height of any elements like slideshow, divider and audio player. For example below is the look of three columns with the only center column having a slideshow element and dividers.
Mauris convallis blandit tellus at molestie. Integer in suscipit eros, in auctor nisl. Sed commodo urna ut ipsum rutrum tempor. Vestibulum maximus ante vitae rhoncus rutrum. Nulla ut ultricies augue, at aliquam nisi. Praesent pulvinar imperdiet purus, vel laoreet augue vestibulum sed. Aliquam eu dui malesuada, tincidunt justo id, eleifend purus. Maecenas interdum arcu arcu, ut vehicula metus mollis eu. Duis sed vulputate est, sit amet sagittis velit. Sed sapien elit, tincidunt sit amet ligula cursus, volutpat imperdiet ex. Fusce sit amet diam eget massa posuere porta. Aenean eu lorem ex.
Mauris convallis blandit tellus at molestie. Integer in suscipit eros, in auctor nisl. Sed commodo urna ut ipsum rutrum tempor. Vestibulum maximus ante vitae rhoncus rutrum. Nulla ut ultricies augue, at aliquam nisi. Praesent pulvinar imperdiet purus, vel laoreet augue vestibulum sed. Aliquam eu dui malesuada, tincidunt justo id, eleifend purus. Maecenas interdum arcu arcu, ut vehicula metus mollis eu. Duis sed vulputate est, sit amet sagittis velit. Sed sapien elit, tincidunt sit amet ligula cursus, volutpat imperdiet ex. Fusce sit amet diam eget massa posuere porta. Aenean eu lorem ex.
The dividers and slideshow elements are resized automatically to fit the column width of the multiple columns element. Any Weebly element which does not have default width and height adjustment option like Slideshow, Pro Audio Player, Divider, Gallery, Contact Form, YouTube and Scribd Document can be resized using multiple columns element.
Positioning of Elements
Weebly elements can be aligned center, right or left and it is not possible to position the text or images where ever you want. Multiple column element can be used to position any element in the desired place. Below is an example of positioning a text and images using multiple columns element.
Mauris convallis blandit tellus at molestie. Integer in suscipit eros, in auctor nisl. Sed commodo urna ut ipsum rutrum tempor. Vestibulum maximus ante vitae rhoncus rutrum. Nulla ut ultricies augue, at aliquam nisi. Praesent pulvinar imperdiet purus, vel laoreet augue vestibulum sed. Aliquam eu dui malesuada, tincidunt justo id, eleifend purus. Maecenas interdum arcu arcu, ut vehicula metus mollis eu. Duis sed vulputate est, sit amet sagittis velit. Sed sapien elit, tincidunt sit amet ligula cursus, volutpat imperdiet ex. Fusce sit amet diam eget massa posuere porta. Aenean eu lorem ex.
This is a sample text element positioned in this place using Weebly’s multiple columns element.
Mauris convallis blandit tellus at molestie. Integer in suscipit eros, in auctor nisl. Sed commodo urna ut ipsum rutrum tempor. Vestibulum maximus ante vitae rhoncus rutrum. Nulla ut ultricies augue, at aliquam nisi. Praesent pulvinar imperdiet purus, vel laoreet augue vestibulum sed. Aliquam eu dui malesuada, tincidunt justo id, eleifend purus. Maecenas interdum arcu arcu, ut vehicula metus mollis eu. Duis sed vulputate est, sit amet sagittis velit. Sed sapien elit, tincidunt sit amet ligula cursus, volutpat imperdiet ex. Fusce sit amet diam eget massa posuere porta. Aenean eu lorem ex.
Mauris convallis blandit tellus at molestie. Integer in suscipit eros, in auctor nisl. Sed commodo urna ut ipsum rutrum tempor. Vestibulum maximus ante vitae rhoncus rutrum. Nulla ut ultricies augue, at aliquam nisi. Praesent pulvinar imperdiet purus, vel laoreet augue vestibulum sed. Aliquam eu dui malesuada, tincidunt justo id, eleifend purus. Maecenas interdum arcu arcu, ut vehicula metus mollis eu. Duis sed vulputate est, sit amet sagittis velit. Sed sapien elit, tincidunt sit amet ligula cursus, volutpat imperdiet ex. Fusce sit amet diam eget massa posuere porta. Aenean eu lorem ex.
You can also create a nested layout structure using multiple columns, besides creating a simple columns on your page layout.
Deleting Elements from Multicolumns Element
One of the drawbacks of using “columns” element is to delete it. You first need to delete the elements inside the column in order to delete the complete element. You need to delete the last column element to reduce the number of columns.
Deleting Elements inside Weebly Columns
2 Comments
Leave your reply.