General Settings

General settings allows you to configure the logo, fonts, layouts and also allow you to configure other basic requirements for a site.

Basic Options

Basic Options

Under basic options you can configure the logo, fonts, Google Analytics script etc.

Logo Settings

Logo - General

You can set your desired logo image for the template from root/images directory in this field.

Logo - Tablet

If you want to have a different logo for tablet browsers then you can set your desired logo image here. This field is optional.

Logo - Mobile

If you want to have a different logo for mobile browsers then you can set your desired logo image here. This field is optional.

Logo Alt Title

Set alt attribute for the logo image. If empty, site name from Joomla Global Configuration is used.

Language Specific Logo

VP Framework allows you to have separate logo images for each languages in a multilingual site. To explain this feature let us assume the following:

  1. We have a multilingual website running two languages English (en-GB) and German (de-DE).
  2. English is set as the default language for the site.
  3. root/images/logo.png is set as Logo - General in the template settings which is presently displayed for both the languages.

Considering above you can now have a separate logo image for German (de-DE). For that you need first name/rename the new logo image as {existing image name}{dash}{language tag}{dot}{existing image extension} i.e. logo-de-de.png. Please remember the language tag suffix must in lower case. Now upload this image at the same directory where the existing logo image is located i.e. root/images/logo-de-de.png That's it. The existing image is considered as the default logo for your default language - English and the new logo image will be displayed for German. Similarly you can also set different logo images for Logo - Tablet and Logo - Mobile

Display Settings

Show Scroll To Top Button

If yes, scroll to top button/link is displayed.

Show IE8 Alert

If yes, an alert is displayed to the visitors using older Internet Explorer 8 browser.

Show IE Emulation Mode Alert

If yes, an alert will be displayed if Emulation Mode is enabled while browsing with Internet Explorer.

Use Google Font

If yes, Google font selected below will be used for the template.

Google Fonts

The following options gets activated when Use Google Font option is enabled.

Main Site Font

Main Google Font for the Template.

Google Font Name

Select the Google font which you want use as the main font for the site.

Google Font Style

Select the font style which you want use as the main font style for the site.

Google Font Character Sets

Select the font character sets which you want use as the main font style for the site. Default is Latin.

Header Tags Font

Google Font for Header Tags like h1, h2, h3, h4 etc.

Google Font Name

Select the Google font which you want use as the header tag's font for the site.

Google Font Style

Select the font style which you want use as the header tag's font style for the site.

Google Font Character Sets

Select the font character sets which you want use as the header tag's font style for the site. Default is Latin.

Additional Scripts

Insert your Google Analytics tracking code or any other additional scripts here. They will be added before the closing body tag in the template.

Google Fonts
Example Tracking Codes:

(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function() {
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXXXXXXX-X', 'auto'); // Replace 'UA-XXXXXXXX-X' with your own Google Tacking ID
ga('send', 'pageview');
For further information, take a look at the Google Analytics tutorial.

Layout Style

Basic Options
Full Width Slider

If yes, slider module position will be displayed with full width.

VP Framework is designed based on Bootstrap 3 framework. Bootstrap is a 12 grid layout system. Please refer to this Bootstrap 3 Documentation to learn more about the grid system of the framework.

Header Layout

Column width of logo, search module, wishlist module, compare module and cart module. These options may defer for different templates. Please refer to the respective template's documentations to learn more.

Header Layout
Logo Grid Size

Grid size of the logo container for desktop view. Maintain your desired size between 1 to 12.

Search Module Grid Size

Grid size of the search module container for desktop view. Maintain your desired size between 1 to 12.

Header Module Grid Size

Grid size of wishlist module, compare module and cart module container for desktop view. This size is auto calculated based on Logo and Search Module Grid Size.

Main Body Layout

Column width of left module position, right module position and main content area of the template.

Main Body Layout
Left Module Grid Size

Grid size of the left side module position container for desktop view. Maintain your desired size between 1 to Full Width.

Right Module Grid Size

Grid size of the right side module position container for desktop view. Maintain your desired size between 1 to Full Width.

Content Area Grid Size

Grid size of main content area in desktop view. This value is auto calculated based on Left and Right Module Position Grid Size.

Left Module Position

Select where the Left module position to be displayed in Tablet and Phone view. Stack above main content area or stach below main content area.

Full Width Views

Select the views for which you want to disable the side modules (left and right) and show full width.

Full Width Menu

Select the menu items for which you want to disable the side modules (left and right) and show full width.