help center

Search
Close this search box.
On this page

Convert existing sections to containers

Last Update: January 10, 2024

Containers are the default layout element of all new Elementor sites. However, you may have an existing site that uses sections. These sections can be converted to containers by using the Convert to Container option. This will save you valuable time as you migrate to containers. 

After you convert a section to a container, you can save it as a container template that you can reuse repeatedly throughout your website to save time later on. You also can nest containers inside containers to create complex templates with ease. 

Important Note: While you can convert a page using sections and columns to containers, this is a one-way process. You cannot convert a container page to work with sections and columns!

Converting sections to containers

If you created your site using sections, you first need to activate containers. For more details on how to activating features, see Elementor experimental features.

To convert your website’s sections to containers: 

  1. Hover over the section you want to convert.
    image 2 Convert existing sections to containers 1
  2. Click the Edit Section icon GLIdjgmPMX8k4yZ4xLChQ1KSuJ9oaX12w6 kfKLBgeK2 v9WAEqB1tLOYrigSd4FipewK2dvLH60ouyvBwhIQVrPLDoAhA9G Convert existing sections to containers 3. 
    image 3 Convert existing sections to containers 5
  3. In the Edit menu, expand Layout, and click Convert.
    image 4 Convert existing sections to containers 7

The converter creates a duplicate of the section in a container below the original section. 

Tips for converting sections

  • While you can convert more than one section at a time, we recommend converting sections one at a time. This allows you to compare the original section to the container and make any necessary adjustments.  
  • Sometimes, converting sections will create unnecessary containers, especially if your section contains identical widgets. 

Pro tip  – You can use the Navigator’s multi-select feature to move several widgets at the same time out of redundant containers. It can also be used to delete extra containers.For more details, see Navigator, Add elements to a page and How many containers should my page contain? 

  • After converting a section, double check the alignment settings – especially those having to do with vertical alignment.
  • After converting a section, check the content width of child containers. Turning on the Wrap option in the Layout tab can help identify child containers that don’t fit in the parent container. 
  • When you convert a section, the container may inherit the section’s minimum height, even if that minimum height was disabled. If this happens, you can simply delete the container’s minimum height.  For more details, see Container Layout tab settings.
  • Sometimes padding and margins do not convert smoothly. If the elements in your new container aren’t aligned properly, check the padding and margins settings. See Container Layout tab settings and Container Style tab settings for more details.

Pro tip – If the child containers are of equal width, you can simply divide the original width by the number of containers. For example, if you have four child containers of equal width in a 1200 PX pixel wide container, set each child container to a width of of 300 PX.

  • If your section’s content width was set as a percentage, the convertor may not have processed the width properly and you may have to adjust it manually. See Container Layout tab settings for more details.

Related articles

Have more questions? We’re more than happy to assist.

Link is copied to clipboard!
On this page

Is this article helpful?

Share this article

Cyber Monday 2024 - Platinum 30% off
Did you know...?
You get a 30 day
money back guarantee

You have nothing to lose – but a great deal!

days
hours
minutes
seconds