EverWeb Logo

EVERWEB VIDEO TRAINING LIBRARY

Full Width Design

Video Transcript:


One of the major features added to EverWeb 1.8 is the ability to make your website have full width design.


This can easily be done by selecting your shape, clicking on the metrics tab, and selecting Full Width. Here is what this will look like when viewed in a web browser. Notice the shape is always the full width of the browser no matter how wide the browser is made.


Here I am showing you one of the themes available in EverWeb, which features the full width design. Let’s go over how this theme was designed.


Starting with a blank page, the first thing I am going to do is add the image for the background.


Just a few quick notes about this before I add the image. You’ll want your image to be at least 2000 pixels wide, but as small in file size as possible. A lot of users might add images that are 10MB, or even larger. This is a big mistake as it will take a long time for users to download it when they arrive at your site. So make sure to pay attention to your image’s size before loading it in your site.


So, on the page settings tab, scroll down to the browser background, select Image Fill, locate your image, and then choose Scale to Fill. Then go up to Page Background and select None. You’ll be able to see how the image responds when you adjust the size of the window.


The next thing I will do is create the shape that is used behind the navigation menu.


I will just quickly add a rectangle, change the color of it, resize it, set it to full width like I showed you earlier, and then place it where at the top of the page.


The next thing I will do is create the background shape for this section with the three images.


This is done by using the same method that we just did for the shape behind the navigation menu.


This entire process is repeated for the remainder of the website. Other items such as images, text, and shapes are added on top of these full width shapes.


This is exactly how this site was created.


These new features allow you to create a much more modern looking website.