• Home /
  • Theme Settings

Theme Frontend Options

Our theme comes packed with several features and flexible theme settings.

  • Header

    Header Settings

    • Search block

      Display search box in header

  • Category Navigation

    Settings for the category navigation

    • Display menu

      Display categories navigation block.

    • Title

      Button title for responsive version. E.g.: Browse Categories, Site Navigation

    • Links before

      Enter comma separated Label-Link pairs in different rows, for example:

      • Home,/
      • Contact,contacts
      • About us,about-us.html

    • Links after

      Enter comma separated Label-Link pairs in different rows, for example:

      • Home,/
      • Contact,contacts
      • About us,about-us.html

    • Multicolumn navigation

      Enable multicolumn navigation

    • Add custom blocks

      Create custom blocks with block code : category_nav_CATEGORYID_before or category_nav_CATEGORYID_after , e.g.: category_nav_150_before for category with id 150, to place the block before the subcategories list

  • Breadcrumbs

    • Show on categories

    • Show on product pages

    • Hide breadcrumbs based on path

      Enter paths in different rows, for instance:
      catalog/category/view/id/10
      catalog/product/view/id/425

  • Catalog pages

    Settings for the products lists and grids

    • Show top toolbar

    • Show bottom toolbar

    • Columns in grid( Large Screen > 1200px)

    • Columns in grid ( Desktop )

    • Columns in grid (Tablets )

    • Columns in grid ( Small devices )

    • Show "Add to Cart" button in grid

    • Show "Add to Cart" button in list

    • Product images proportion

      Enter the image proportion in x:y format ( x and y integer numbers ) , the sizes will be calculated automatically. Common values are 1:1 , 3:4, 4:3 , 9:16, 10:16

    • Product images width

      The product images will be loaded from the server using this width, and then resized in the template. A common value is : page-width / number-of-columns-in-grid , e.g.: 1200/4 = 300

    • Lazy load images

      Lazy Load is delays loading of images in long products lists. Images outside of viewport are not loaded until user scrolls to them.

  • Product pages

    Settings for the products details page

    • Columns proportion

      The product details page shows 2 columns: images on the left and the product description on the right. The available space uses a grid of 12 columns, you can enter how many columns each section will use, for instance, 6:6 ( equal width) , 8:4 ( wider image ) or 5:7 ( the right column will be wider).

    • Product images proportion

      Enter the image proportion for in x:y format ( x and y integer numbers ) , the sizes will be calculated automatically. Common values are 1:1 , 3:4, 4:3 , 9:16, 10:16. This will be applied to the main image and the thumbnails.

    • Main product image width

      The product images will be loaded from the server using this width, and then resized in the template. A common value is : page-width / 2 , e.g.: 1200/2 = 600

    • Thumbnails width

      The product images will be loaded from the server using this width, and then resized in the template. A common value is : page-width / ( 2 * thumbs-per-row , e.g.: 1200/ (2*4) = 150

    • Large images width (zoom and lightbox)

      The product images will be loaded from the server using this width, and then resized in the template. A common value is : 1000 or page-width

    • Enable cloudzoom

      Enable zoom when hovering on images.

    • Thumbnails per row

      Number of thumbnails per row to display below the main product image. Accepted values are : 3,4,5,6

  • Sidebar blocks

    Settings for the sidebar blocks

    • Product images proportion

      Enter the image proportion for in x:y format ( x and y integer numbers ) , the sizes will be calculated automatically. Common values are 1:1 , 3:4, 4:3 , 9:16, 10:16. This will be applied to the main image and the thumbnails.

  • Wishlist

    To remove the wishlist completely, go to Customers > Wishlist > General Options, and set the option "Enabled" to No.

    • Enabled in products list/grid

      Show add to compare link in categories and search results pages

    • Enabled in products details page

  • Add To Compare

    • Enable sidebar blocks

    • Enabled in products list/grid

      Show add to compare link in categories and search results pages

    • Enabled in products details page

  • Footer Configuration

    • Footers rows and columns

      Enter number of columns used by each block in each footer row (Each row has 12 available columns) .
      For example:

      • 3,3,3,3 (Equal width columns)
      • 2,2,2,3,3 ( The first 3 columns are narrower than the last 2 )
      • 3,3,6 ( two narrow blocks and one wide block )
      After this, create CMS Static Blocks ( CMS > Static Blocks ) with the following code structure: footer_rowX_Y , e.g. :footer_row1_1, footer_row_1_2, and so on.

  • Custom CSS

    Include your own css file with the theme

    • Use custom css

      Create the file skin/frontend/mango/MYTHEME/css/style-local.css so it can be included.

  • Ajax add to cart

    • Enabled

    • Show summary

      Display cart summary on the confirmation popup

    • Qty. Form

      Display qty. form for simple products before adding to cart.

  • Quick View Settings

    • Enabled

      Display quick view button when hovering the images in the products list/grid.

    • Columns proportion

      The quickview page shows 2 columns: images on the left and the product description on the right. The available space uses a grid of 12 columns, you can enter how many columns each section will use, for instance, 6:6 ( equal width) , 8:4 ( wider image ) or 5:7 ( the right column will be wider).

Compare

Loading, please wait...