WebsiteBuilder: Docking

In Website Builder, there is a feature called docking. This is to help you with the positioning of your elements on your website. This can be a huge help in aligning elements and making sure your website looks the same regardless of the size of the monitor it is pulled up on. This will help keep your website looking neat and professional with a few easy steps. 

You can "dock" most elements in the builder. To find this option, click on the element, click More, and look for this icon: 

Once you've clicked that icon, it will give you the option to dock Horizontally or Vertically, and you can decide which side, center, or stretch option you want to choose. 



Elements will be "Docked" in the section or container that they are placed in. They cannot be docked site-wide or to other elements. 

For example, if you have a text box that you would like to have centered in the section you placed it in, you just need to:

1. Click on that text box, click More, and click the Docking icon. This will show the docking options. 
   
   
   
   
2. Choose the two centered docking options
   
   
   
   Your text will now be centered in that section, and if you move it, it will display lines that connect back to the center.
   
   You can also use Docking to place elements flush to the left or right of the page. 
   In the builder, if you place an element to the far right side of the page, there will still be space between the element and the side of the site in a preview.
   
   
   
   If you use the Dock Left option, if will dock the image to the far left of the page, regardless of the size of the screen your site is displayed on:
   
   
   
   (one note: you can't have the image in the middle of your page, and use dock left. Your image has to be to the edge of the builder, then docking will do the rest)
   
   Another really helpful feature of this builder is the "stretch" docking options. For example, if you have a map on your page, you can just place the element as it defaults, but it won't look great:
   
   
   
   Maps and similar elements look better if it fills up a section. However, if you manually stretch the element across your builder, it is still going to have space on the side in a preview or publish:
   
   
   
   This is where docking comes in handy. Choose the horizontal and vertical stretch option, and you will have much better results:
   
   
   
   As you can see, docking can be used to improve the overall look of certain elements on your website, so try it out and see if it can help improve your site!
   
   For a visual walk-through, view this video on Youtube!