Sample Sidebar Module

This is a sample module published to the sidebar_top position, using the -sidebar module class suffix. There is also a sidebar_bottom position below the menu.

Sample Sidebar Module

This is a sample module published to the sidebar_bottom position, using the -sidebar module class suffix. There is also a sidebar_top position below the search.
News

Search Our Site

  • fr-FR
  • English (UK)
This template is built on the very powerful S5 Vertex Framework, which comes packed with amazing features! Learn More About Vertex...

Every template built on Vertex also comes with its own unique template specific options applicable to that particular template such as highlight colors, social icons, and much more. These features are in addition to the standard functions of Vertex, and are still controlled through the very user friendly interface of Vertex. This page will document the features specific to this template.

Template Specific Configuration Interface of Vertex

Below is a screenshot that shows all the template specific features available in the user friendly Vertex admin:




Video or Image Background

Incline comes with an option for either a video or image background when the custom_1 position is used. There are thousands of short video clips available at sites like siteground.com that can match most websites. If you cannot a video that you like, or simply don't want one, you can use an image as the background instead as well as just a solid color. This image is also used for tablets and mobile devices, where the video is automatically turned off due to restrictions on those kinds of devices. In addition you can also turn on or off an overlay effect that covers the video or image as shown on this demo.

LIVE EXAMPLE - See a demo with no video background
LIVE EXAMPLE - See a demo with a video background



Video Preloader

When the video is present on the page you can enable an optional video preloader. Enabling this feature will show an overlay preloader that covers the entire site while the video is loading in the background. This feature will only show on pages where the video is present. Once the video is loaded the preloader will disappear and the video will begin to play, and the rest of the site will become visible.

Whenever the video is finished loading in the backend the overlay feature above will automatically disappear, this generally only takes 1 to 3 seconds, depending on the size of your video. However, if the user's bandwidth is abnormally slow this may take a longer period of time to complete. With this setting you can set the maximum number of seconds that the preloader should show for, and then disappear whether the video is ready or not.




Header Background Image and Color

Whenever the custom_1 position is used it will use the video or image settings above for the top of the site. Whenever custom_1 is not used a separate image and color set is used for the header area. You may use the same image as above for the custom_1 area, or select a new one entirely. In addition you can also turn on or off an overlay effect that covers the image as shown on this demo.





Custom Highlight Color

Stylize your site with any color you want. Set your own custom color scheme with the built in highlight color. This controls menu items, titles, buttons, hover over effects, backgrounds, and much more. You can set this color to any color that you want. Below is an example so you can see how this works.




Custom Row Background Colors

In addition to the custom highlihgt color above, you can easily control the background color or image of any row in this template with the power of Vertex. In addition to the default Vertex rows this template also includes several custom rows in which you can control the background colors as well. This is all done very easily through a color picker in the backend of Vertex.



Custom Highlight Font

Choose a custom highlight font powered by Google fonts. You can set a custom font for the titles, buttons, and much more. This is used in conjunction with the default site font which is controlled under the Layout tab of Vertex, and controls many other elements as well.





Uppercase Letters

Choose to enable or disable uppercase letters on most menu items, buttons, titles and more.





Enable or Disable The First Menu Item

In the settings you can turn on or off the first menu item. It is a common trend to turn off the Home menu item and simply let users click the logo to return to the homepage if needed.





All content and images shown on this site is for demo, presentation purposes only. This site is intended to exemplify a live website and does not make any claim of any kind to the validity of non-Shape5 content, images or posts published. Stock photography and icons are often purchased from shutterstock.com for this demo only, and is not included with this template. Occasionally open source images are used as well, but are also not included, eg: unsplash.com. You may not use these items for your own use without first purchasing them from their copyright owner. Links will be provided for some of these items if you wish to purchase them from their copyright owners or download them from their sources.

SEO - Get your site noticed!

Not only is this template beautifully designed but it is great for search engine optimization as well! What is SEO? It is simple the act of altering a web site so that it does well in the organic, crawler-based listings of search engines such as google.com. How does this template accomplish this? It's simple, the majority of your most valuable content is found in the main body of your site, through css we are able to alter the layout of the site and call the main content before the left and right columns are called. This allows for your content to be found first by search engines before it reaches your other content, which is vital in search engine optimization. This is a common feature this can be done with almost all of Shape 5 templates as well.


I like what I see! I want to JOIN TODAY.


So what are Site Shapers? They are quick installs of Joomla combined with all the modules, content, etc used on our demo, excluding stock photography. Within a few minutes you can have your site up, running and looking just like our demo. No more importing SQL dumps and installing modules. Just head on over to the download section of this template and grab a Site Shaper. Simply install the Site Shaper like any other Joomla installation, it's that easy!



How to setup a Site Shaper

  • 01Login to your cpanel or your server admin panel.
  • 02Locate the area where your databases are (usually labeled Mysql Databases)
  • 03Create a new database
  • 04Next create a new database user and assign it to this newly created database in the previous step
  • 05You will then need to extract the site shaper to either a folder on your server or the root directory such as WWW. NOTE: if you already have a website in the root of your WWW folder, we suggest creating a new folder and extract the site shaper there. If your cpanel does not have an extract option or you cannot find it, you may also extract the contents of your site shaper in to a folder on your desktop and upload all the files via an ftp client to your server.
  • 06Next, navigate to the url where you extracted the site shaper via your web browser.
  • 07Continue through each screen until you reach the below screenshot:

  • 08At the above screen be sure to enter localhost as shown, continue to fill in the following text fields with your newly created database and username information
  • 09Follow through the rest of the site shaper setup and click the install sample data at the last screen and the installation is complete! (be sure to rename/remove the installation directory after finishing the install)

The S5 Tab Show will display up to 20 modules in various styles within sliding tabs, and is compatible with responsive sites. Simply publish the S5 Tab Show module to your desired module position and pages. Then start publishing modules to the positions in the Tab Show (s5_tab1, s5_tab2, etc); these modules will become the slides. This is a great way to organize and showcase your site's content or images. Version 3 of this module is incredibly powerful, below is a list of all of its features. A the bottom of this page you will see several examples of this module in action.

NOTE - Several live examples of the S5 Tab Show are found at the bottom of this page.

  • Transitions are powered by CSS3, so no javascript conflicts
  • Optional custom classes
  • Up to 10 copies of the module on the same pages; each individually controlled
  • Use up to 20 slides
  • Select on mouseover or on click for activation
  • Set the loation of the tabs or arrows
  • Center the tabs or arrows
  • Hide the tabs or arrows until mouseover
  • Force the tabs or arrows to be shown for tablets and mobile devices
  • Select your transition effect
  • Set your duration speed
  • Add extra padding in between slides or no padding at all
  • Optional button text for tabs
  • Optional images for tab buttons
  • Set a background color or image for each slide or the entire module
  • Enter pre-text and post-text


Incline Template Variations


Shape5 templates often stylize modules beyond their default styling to match the look of a particular template. This template has three variations of the modules, all which can be seen on the homepage of this demo. On the homepage the S5 Tab Show module is published in custom_1 (on top of the video), top_row3_1 (under the Get Outdoors module), and custom_3 (the rotating images at the bottom of the site).


Live Examples


Below you can see several examples of this module in action with varying options applied. These are only several of the options available, there are dozens of options you can enable or disable: