Overview
It is helpful to use banners / sliders on the top of main landing pages of the websites to add some color and nice formatting to the overall view of the site.
What is a landing page?
A landing page is a page that does not have a left sidebar. This can be the home page of a site, or another page that does not need any left side menus and the content is all focused on that page.
Sample Landing Page
Both of these samples do not have left side bars. A single image can be used, or you can create a slider with smart slider 3. If you want text to be displayed, use a 'plain image' and use smartlslider 3 to layer the text over the image.
Example with text overlay:
Link to Sample page with Text Overlay
Example with a static image:
Link to Sample page with Static Image
Sample Interior Page
An interior page is a page that has a left sidebar on the website. For this type of page it is better to use an image that is 2x1 ration (800 x 400), and is displayed in the 'content' section of the page. This will make it easier for the user to access the content and the left sidebar that is displayed.
Example with image ABOVE the title:
This example uses a Custom Module to display the image. Using a module is a little more work, especially if each page you want to use a different image, that means that multiple modules need to be created. It is also a little more difficult to edit when the image needs to be changed.
Link to Sample Page with MODULE Image
Example with image BELOW the title:
To add an image BELOW the title, it is an image that is added within the content of the article. This image can be around 800 x 400. When adding the image, it is best to set the width = 100%, this way it will be responsive and fill the space properly. This is very easy to edit for each page.
Link to Sample Page with Image in Content
