How to add columns in Weebly

Many entrepreneurs enjoy using Weebly to create their websites because of its numerous tools and services. Millions of businesses take advantage of Weebly’s free offerings and easy-to-use design. When designing your business or personal website on Weebly, layout and design are important. Follow these steps to learn how to add columns to your Weebly pages.

How to add columns with the column button

First impressions matter and it is imperative for customers that your website is organized and pleasing to the eye. Previously, Weebly limited the number of available columns to five. Now, however, there is no limit to the number of columns you can add. Adding columns in Weebly is easy by following the following steps.

1. Open a Weebly template page.
   
2. Locate “Columns” in the editing panel on the left side of the screen.
   
3. Click and drag the “Columns” icon onto the page. You will see “drag items here” in the area where columns can be dropped.
   
4. Drop the columns on the page. Hover over them to adjust the number and spacing of the columns.

How to add columns by dragging elements

You can also organize any Weebly elements into columns by placing them next to each other.

1. Open a Weebly template or “Edit Site” page.
   
2. Click and drag any element icon from the editing panel to the page.
   
3. Click and drag another element and place it next to the first one.
   

Weebly automatically adjusts content to be formatted in columns. Note that if too much content is added, the columns will become very narrow as they are compressed onto the page.

How to add columns with HTML

Sometimes it is necessary to add multiple columns in the form of a table. Follow these steps to add columns to your Weebly page using HTML code.

1. Open Microsoft Word.
   
2. Click the “Insert” menu at the top of the page.
   
3. Click “Table” and choose the table size using the drop-down grid.
   
4. Once your column table is ready, save the document as a web page.
   

To do this, select “File”, “Save As” and from the extensions drop-down menu, choose “.htm/.html”.

• Open the saved document/web page with a text editor and copy the HTML code of the table.
• Open the Weebly page where you want to add the column table.
• Click the Build tab.
• Click and drag the “Embed Code” item to the workspace.
• Click on the “Embed Code” item and select “Edit Custom HTML.”
• Paste the table code from the Word document.

Column positioning

Once you’ve added columns to your Weebly page, it’s easy to move them around to experiment with different layouts. To move columns, follow these steps.

1. Hover over the column you want to move.
   
2. A blue line appears around the column and a white rectangle appears at the top center of the element.
   
3. To move the column, click and drag the white rectangle to the new top center position of the column.
   

It is also possible to add space between columns.

1. Hover over a column and click the blue line to bring up the options menu.
   
2. Increase or decrease the spacing between columns as desired.

Change column width to preset widths

Resizing columns is as easy as clicking and dragging.

1. Open the Weebly page editor window and place the cursor over the column whose size you want to resize.
   
2. A blue highlighted line will appear between the column and the item next to it.
   
3. Click on the blue line and drag it to the desired width. The width will adjust to the default widths.
   

Change column width to custom widths

Columns can also be set to custom widths instead of preset points.

1. Open the Weebly page editor window and place the cursor over the column whose size you want to resize.
   
2. A blue highlighted line will appear between the column and the item next to it.
   
3. Click on the blue line and hold down the Shift key to drag to the desired width.
   

Copy a column to another page

Once a column has been added, it can be easily copied to another page by following these steps.

1. Hover over the column you want to copy.
   
2. Click the blue and white arrow in the upper left corner.
   
3. Select “Copy” and choose a page from the drop-down menu to which you want to copy the column.
   

Move a column to another page

Columns can also be moved between pages.

1. Hover over the column you want to copy.
   
2. Click the blue and white arrow in the upper left corner.
   
3. Select “Move” and choose a page from the drop-down menu that you want to move the column to.
   

Delete a column

If you want to delete a column and the content it contains, you can easily do so with a single click. Just be careful, as the change will be permanent and the content cannot be recovered. If you are sure you want to delete a column, follow these steps.

1. Hover over the column you want to delete.
   
2. Click the blue and white “X” in the upper right corner and press “Delete.”
   

Add content to columns

Columns in Weebly can contain any content you can imagine. The Weebly editing panel offers several options to add, such as text, images, and embedded code. Maps can also be added to columns. Columns can be created as elements and added side by side. But also, the content can be overlaid on top of each other within the columns if desired. To add any content to a column, follow the steps used to add elements to the page.

1. Open a Weebly template page or an “Edit Site” template.
   
2. Click and drag any element icon from the editing panel to the column.
   
3. Click and drag any other elements you want and drop them into the column.
   

Successfully Add Columns in Weebly

These steps can help you learn how to add columns to your Weebly page. Adding and working with columns in Weebly is fun and easy to learn. Once you’ve created your own Weebly website, be sure to share it with others by telling us in the comments p below. Also let others know your tips and tricks for working with columns on Weebly.