Autumn - Responsive Prestashop Theme

Installation and Quick Start Guide



Thank you for purchasing my theme.

II. PREPARATIONS

To be able to install and use this theme, you must have Prestashop installed on your server. You can get more information about how to install and getting started with Prestashop here: www.prestashop.com/en/getting-started.


First, download the theme from Themeforest.net and unzip the main zip file that you have downloaded. To install the theme you will use Autumn.2.x.x.zip.

Contents of the zip file can be different according to the theme version, but the main theme zip file (Autumn.2.x.x.zip) will be always there.

Contents of the main zip file

2. INSTALLATION

I. Upgrading from Prestashop 1.5.x

If you are currently using Autumn with Prestashop 1.5.x, you can follow this section to upgrade your Prestashop setup and then install the new version of the theme. To use Autumn 2, you must have Prestashop 1.6.x. Autumn 2 will NOT work on Prestashop 1.5.x.

Important Note From Author: Due to the amount of changes in Autumn 2, you will not be able to upgrade from Autumn 1 to Autumn 2. This means, you will lose all of your modifications. I'm truly sorry about this inconvenience but this change was necessary due to the new major version of the Prestashop and the obsolete technology of the Autumn 1. It was good 1.5 years ago, but not anymore.

I tried my best to make the theme much more user friendly, bug free and as stable as possible. Your suggestions and bug reports made the theme better and hopefully I will continue to improve it with your help. If you have any suggestions or if you would like to see a specific feature in the future, please do not hesitate to share them with me.

Before doing anything, please make sure you have backed up your Prestashop files and the database. This way, if anything goes wrong, you can start over again without losing anything.

1 To upgrade from Prestashop 1.5.x, you need to remove the Autumn 1 and its custom modules except Autumn Theme - Newsletter and Autumn Theme - Newsletter Block with Extended Features modules. These two are responsible for keeping the subscriber e-mails that subscribed to your shop using the footer subscription box. DO NOT remove these two modules until you are completely done with the upgrade and installation progresses.

You will be able to find more information about these two modules and how to keep the e-mails in 4.Custom Modules > Autumn Theme Configuration section.

To start, login to the admin panel of your Prestashop setup, and navigate to the Modules > Modules page.

Modules > Modules

2 In the modules page, sort the modules using Author filter and then select the following modules and click Uninstall the selection button. Again, make sure you did not select Autumn Theme - Newsletter and Autumn Theme - Newsletter Block with Extended Features modules.

Uninstall the selected modules

3 Once you uninstalled the selected modules, click Delete links for each of the modules one by one to remove them from your host completely.

Remove the modules

4 Once you removed the modules, navigate to the Preferences > Themes page to remove the theme.

Preferences > Themes

5 To be able to remove the theme, you need to activate the default theme. Otherwise, Prestashop won't let you to remove the Autumn theme. Select the default theme from the list and then click to the Save button to activate the default theme. After activated the default theme go ahead and remove the Autumn theme by clicking the remove icon. This will completely remove the theme files from your server.

Activate the default theme


Remove Autumn theme

6 You have now removed the Autumn theme and its custom modules (except two of them) and you are ready to upgrade your Prestashop setup. Upgrading Prestashop is not covered by this documentation, if you having trouble, you can check the official upgrade guide from Prestashop: doc.prestashop.com/display/PS16/Automatic+update

Once you have upgraded to the Prestashop 1.6.x, you can keep continue from the section called II. Installing to Prestashop 1.6.x from the next page.

II. Installing to Prestashop 1.6.x

If you are using Prestashop 1.6.x for the first time, or if you did upgrade from Prestashop 1.5.x, you can follow this section to install the theme to Prestashop 1.6.x. The process is exactly the same in both situations.

1To start, login to the admin panel of your Prestashop setup, and navigate to the Preferences > Themes page.

Preferences > Themes

2In the Preferences > Themes page, click Add new theme button from the top toolbar. This will redirect you to the Import Theme page.

Add new theme

3In the Import Theme page, you will use Import From Your Computer section to upload the main theme zip file. Click the Add File button to select the main theme zip file (Autumn.2.x.x.zip), and then click Save button.

Import the theme from your computer

4After importing the theme from your computer, Prestashop will redirect you to the previous page, but this time you will be able to see the Autumn theme in the list. To start the actual installation process, hover over the Autumn from the theme list and then click to the Use this theme button.

Activate the theme

5In this step, Prestashop will ask you to which modules are going to be installed along with theme as well as which native ones will be installed/enabled and which ones will be disabled. You can change these options if you know exactly what you are doing. Otherwise, just click to the Save button to install the theme and its custom modules.

Select the modules

6That's it! Congratulations, you have successfully installed the theme and its custom modules. Before start using your shop, you still need to configure couple more things. Click to the Go to the thumbnails regeneration page button from the final screen.

Installed

7 Now you can keep continue from the section called I. Configuring your shop from the next page.

3. POST INSTALLATION

I. Configuring your shop

Before start using the Autumn theme, you need to do couple more things such as regenerating the images.

1 In this step, you will see how to regenerate thumbnails. Autumn is using custom image sizes. This way, if you decide to use another theme along with Autumn with using multishop configuration of the Prestashop, you will be able to set different image sizes for each theme. To regenerate the images, simply scroll all the way down in Preferences > Images page, make sure All is selected from Select an image dropdown and click to the Regenerate thumbnails button. If you have a lot of images this might take a while.

If you don't have multishop setup with any other theme that uses default image types, it's recommended to remove default image sizes except small_default (admin panel using small_default image size in some areas) before starting the regenerate process. Otherwise, you will end up a lot of unnecessary images and regenerating the images will take way more longer than it should be.

In the below screenshot, you can see the image types added by Autumn marked with green area.

Image types


Regenerate thumbnails

The image sizes in screenshots can be different than yours. Autumn 2 can handle different image ratios without needing any configuration other than configuring the image sizes themselves. If you want to change the ratio of the images, simply edit the image sizes that have atmn_ prefix on their names, enter the new sizes, and then Regenerate thumbnails one more time. Autumn will adapt itself to use the new image ratios automatically. You can set different ratios like square, horizontal rectangle or vertical rectangle.

II. Tips

In this section, you will be able to find some tips about the theme such as the use of category images, available icon-fonts, how to add custom text blocks to the frontpage and etc.

1 Category Images

In Autumn 2, category images have different uses. If you look at the category pages, you will see they have their own headers. If you remove the category image from a category, it will reveal the default background image which can be seen from the screenshot below. You can upload your own category images to customize the look of the category pages. The recommended image size for the category images is 1920 x 250px.

Category Image

2 Frontpage text blocks

If you take a look at the first demo shop, you will be able to see these text blocks in frontpage. They are created by using the native module called Home text editor. You can install and enable the module from Modules > Modules page.

Frontpage text blocks

These text blocks are created using the custom made column/grid system of the Autumn theme which is a perfect demonstration of what you can do with the Autumn's column/grid system. You can copy/paste the code from below into the rich text area of the Home text editor module to quickly build the same structure and then you can continue from there:


<div class="row">
    <div class="column col-4-12  t-align-center">
        <div class="wpicon wpicon-power medium2" style="display: inline-block; padding: 15px; background: #da3b44; color: #ffffff; border-radius: 30px;"> </div>
        <h2 style="margin: 20px 0 12px 0; padding: 0; font-weight: normal;">It's powerful!</h2>
        <div>Autumn has a lot of features to give your customers a unique experience. It also has powerful modules such as Megamenu module that allows you to create unique menu layouts.</div>
    </div>
    <div class="column col-4-12 t-align-center">
        <div class="wpicon wpicon-transmission2 medium2" style="display: inline-block; padding: 15px; background: #da3b44; color: #ffffff; border-radius: 30px;"> </div>
        <h2 style="margin: 20px 0 12px 0; padding: 0; font-weight: normal;">It's fluid!</h2>
        <div>Because of the fluid design, your shop will look perfect in every screen! Resize your browser window right now to experience the Autumn's fluid design!</div>
    </div>
    <div class="column col-4-12  t-align-center">
        <div class="wpicon wpicon-heart2 medium2" style="display: inline-block; padding: 15px; background: #da3b44; color: #ffffff; border-radius: 30px;"> </div>
        <h2 style="margin: 20px 0 12px 0; padding: 0; font-weight: normal;">It's developer friendly!</h2>
        <div>Autumn's custom css grid system built with necessary shopping elements in mind. You won't need weird workarounds to make things work unlike many other pre-built css grids.</div>
    </div>
</div>

3 Icon Font

Here's the custom icons that included into the Autumn theme. You can use the names of the icons as a icon-class in various modules.

Category Image

4 Customizations

For adding custom css codes, you should use themes/autumn/css/CUSTOM.css file. Do not edit the main css file (themes/autumn/css/AUTUMN.css) to make modifications, otherwise next time you update the theme, you might lose your modifications as the main css file updates along with the theme. CUSTOM.css file on the other hand, will not be removed or changed with theme updates, so you can update the theme without worrying about losing your modifications.

5 Retina Product Images

Autumn has Retina Product Image support. If you check the image sizes that Autumn created (they listed under 3. Post Installation > I. Configuring Your Shop section of this documentation), you will see all the image sizes also _2x versions. For example atmn_normal has atmn_normal_2x.

Retina image sizes are exactly the double of the normal image sizes. For example if you are using 350 x 350px for product images, then the retina version will be exactly 700 x 700px.

Also, if you updated the Autumn from an older version, you may need to add the new image sizes manually. Please check the Preferences > Images page on the backend of your shop and make sure all the image sizes are exists and correctly set. You can find the list of the default image sizes that comes with Autumn in 3. Post Installation > I. Configuring Your Shop section of this documentation.

6 Groupon Style Discount Countdowns

Autumn has Groupon style discount countdowns. If you set a Specific Price while editing your product, and if you set an ending date/time for your discount, Autumn will automatically show a countdown timer.

Countdown Timers

Here's an example how the countdown timer will look:

Countdown Timers

7 Showing Discount Amount/Percentage

While editing your products, if you check Display the "on sale" icon on the product page, and in the text found within the product listing option from Prices tab, Autumn will show the Amount/Percentage of the discount rather than just showing "On Sale" text:

Discount Amount/Percentage

Here's an example how the amount/percentage will look:

Discount Amount/Percentage

4. CUSTOM MODULES

Autumn has custom modules that improves the user experience and the looks of the theme. You can find all the custom modules in the Modules > Modules page. Custom modules have similar names and logos so you can find them in the modules list very easily. Also, you can easily access them using the Withinpixels tab from the main navigation area of the Prestashop.

Modules list


I. Autumn Theme Configuration

This is the main module of the theme. Without this module, Autumn will not work correctly. This module also has some configuration options that you can use for customizing the theme. To get to the configuration area, you can either use Withinpixels > Autumn Theme Configuration menu or you can click Configure button of the Withinpixels - Autumn Theme Configuration module from Modules > Modules page.

Autumn theme configuration

Layout type: You can choose between Fullwidth or Boxed layouts with using this option.

Sidebar position: If you want to use sidebar with Autumn theme, you can choose its position using this option. This option will change the position of the Left Column hook area. Even if you set this option to the right, it will move the Left Column hook to the right. The reason behind this is that you can easily change the sidebar position without worrying about the module positions. As soon as you move the sidebar, all of the modules will be moved as well so you don't have to manually hook the modules to the Right Column in order to show them in the right sidebar. Also, the actual Right Column hook is only visible in product pages. This way you can have modules that showing up only in product pages.
Number of products in one row: You can show 2, 3, 4, 5 or 6 products in one row in product lists. Autumn can override this option according to the screen resolution to keep the layout intact.

Enable Retina Images: You can use this option to enable retina images for products. Fonts and other icons already have retina support so this option only effects products. If you have big product images, you can enable this option and Autumn will automatically show retina versions of the product images in supported devices.

Enable Countdown Timers: You can use this option to enable / disable countdown timers for timed discount. If you wish to use another module you can disable them completely to prevent conflictions.

Autumn theme configuration

Header style: You can choose one of the three header designs to customize the header of your shop for your needs and likings.

Sticky menu: Enabling this option will make the menu and the logo sticky as the page scrolls down.

Show user info on sticky menu: Enabling this option will show the username and login/logout links in sticky menu.

Custom header text: You can add custom text to the top left part of the header with using this option. This option has multilanguage support.

Header top section background color: You can change the background color of the top section of the header with this option.

Header top section text color: You can change the text color of the top section of the header with this option.

Header main background color: You can change the background color of the main area of the header with this option.

Header main text color: You can change the text color of the main area of the header with this option.

Autumn theme configuration

Footer column count: You can change the column count of the footer area with using this option. It has 2, 3, 4, 5 and 6 columns options.

Custom footer text: You can add custom text to the bottom left part of the footer with using this option. This option has multilanguage support.

Footer main background color: You can change the background color of the main area of the footer with this option.

Footer bottom section background color: You can change the background color of the top and bottom section of the footer with this option.

Autumn theme configuration

Category header style: Autumn has a very different category page header design. You can choose the positions of the category title and the breadcrumb with using this option to create very unique looking category pages. Autumn is using the category image as a background image in this area. You can upload different images to each category to have different background in different categories.

Show subcategories: You can use this option to show or hide the subcategories from category pages. As the category images used as a background image in category headers, subcategory lists don't show the category images. They are just a plain text list of the subcategories with some fancy styling.
Default category view type: You can choose the default view type of the category pages. If the user changes its default view, Autumn will store that information in the browser cookies so next time your visitor visits the shop, their configuration will be remembered and also it will override this option.

Enable quick view: You can use this option to enable/disable the quick view.

Enable quick image viewer: This option will enable/disable the quick image viewer in product lists. With this option enabled, your customers will be able to navigate through all of the images of a certain product without going into the product page. All the images will be loaded via Ajax requests, so they won't affect the initial load of your category pages.

Slide to 2nd image automatically in quick image viewer on hover: If you enable this option, quick image viewer will automatically show the second image of the product (if exists) on hover.

Show average rating stars: You can show or hide the average rating stars of the products with using this option.

Show color options: You can show or hide the color options of the products with using this option.

Show stock information: You can show or hide the stock information of the products with using this option.

Autumn theme configuration

Enable Previous/Next Product buttons for product pages: You can use this option to enable or disable product navigation buttons.

Show product reference code: You can use this option to show or hide the reference code of the product from product pages.

Show product condition: You can use this option to show or hide the product condition information.

Show product manufacturer name: You can use this option to show or hide the product manufacturer name.

Autumn theme configuration

Include Cyrillic subsets: You can use this option to include selected subsets of the font if the selected font has support for it.

Include Greek subsets: You can use this option to include selected subsets of the font if the selected font has support for it.

Include Vietnamese subset: You can use this option to include selected subsets of the font if the selected font has support for it.

Main Font Family: You can use this optionto select a font-family from Google Fonts.

Autumn theme configuration

Color: This option will change the entire color scheme of the Autumn.

Autumn theme configuration

Background Options: With these options you can set the main background color/image and body background color/image of the theme.

Autumn theme configuration

Custom codes: You can use these areas to add your custom CSS and JavaScript codes to the theme. For adding custom css codes, you should use themes/autumn/css/CUSTOM.css file. Do not edit the main css file (themes/autumn/css/AUTUMN.css) to make modifications, otherwise next time you update the theme, you might lose your modifications as the main css file updates along with the theme. CUSTOM.css file on the other hand, will not be removed or changed with theme updates, so you can update the theme without worrying about losing your modifications.

The very last tab is a tab called Data Merge. If you upgraded from Prestashop 1.5.x, you may see different messages in that section. Please follow the on screen instructions from that section to get the e-mail addresses from old Autumn - Newsletter module. If you didn't use Autumn with Prestashop 1.5.x before, you don't have to do anything in this section.

Autumn theme configuration

Autumn theme configuration

II. Image Slider

To access to the Image Slider module, use the Withinpixels > Image Slider menu. This module has multilanguage and multishop support.

To add a slide or access to the main options of the Image Slider module, you can use the toolbar buttons.

Image slider

To add a slide, simply click Add New Slide button from the top toolbar, fill the fields and click to the Save button.

Image slider

To access to the main options of the module, click Options button from the top toolbar.

Image slider

III. Isotope Tabs

Isotope tabs is a custom module that uses Isotope jQuery Plugin to create cool looking tabs in the frontpage.

To access to the Isotope Tabs module, use the Withinpixels > Isotope Tabs menu. This module has multilanguage and multishop support.

To add a tab or access to the main options of the Isotope Tabs module, you can use the toolbar buttons.

Isotope tabs

To add a tab, simply click Add New Tab button from the top toolbar, fill the fields and click to the Save button. You can fill the tabs with Featured Products, New Products, Special Products, All Products From Certain Category or you can manually add Custom Products.

Isotope tabs

To access to the main options of the module, click Options button from the top toolbar.

Isotope tabs

IV. Product Carousels

Product Carousels is a custom module that uses a carousel plugin to create custom carousels in the frontpage.

To access to the Product Carousels module, use the Withinpixels > Product Carousels menu. This module has multilanguage and multishop support.

To add a carousel or access to the main options of the Product Carousels module, you can use the toolbar buttons.

Product carousels

To add a carousel, simply click Add New Carousel button from the top toolbar, fill the fields and click to the Save button. You can fill the carousels with Featured Products, New Products, Special Products, All Products From Certain Category or you can manually add Custom Products.

Product carousels

To access to the main options of the module, click Options button from the top toolbar.

Product carousels

V. Frontpage Blocks

Frontpage Blocks is a custom module that allows you to add custom images to the frontpage and then link them to anywhere you want. You can use this module to create basic advertisement blocks or a category catalog in the frontpage.

To access to the Frontpage Blocks module, use the Withinpixels > Frontpage Blocks menu. This module has multilanguage and multishop support.

To add a block or access to the main options of the Frontpage Blocks module, you can use the toolbar buttons.

Frontpage blocks

To add a block, simply click Add New Block button from the top toolbar, fill the fields and click to the Save button.

Frontpage blocks

To access to the main options of the module, click Options button from the top toolbar.

Frontpage blocks

VI. Manufacturer Carousel

Manufacturer Carousel is a custom module that allows you to add a manufacturer carousel to the frontpage.

To access to the Manufacturer Carousel module, use the Withinpixels > Manufacturer Carousel menu.

Manufacturer carousel

VII. Megamenu

Megamenu is a custom module that allows you to create custom menus and menu layouts.

To access to the Megamenu module, use the Withinpixels > Megamenu menu. This module has multilanguage and multishop support.

To add a menu you can use the toolbar button.

Megamenu

To add a menu, simply click Add New Menu button from the top toolbar, fill the fields and click to the Save button. This will add a root menu.

Megamenu

To enter the Menu Builder, click on the title of the menu. To edit the root menu click to the Edit button.

Megamenu

Once you have clicked to the menu name, it will redirect to you to the Menu Builder. In this area, you can build your custom megamenus. It might look complicated at first, but once you get used to it, you can create almost any layout with using lots of different types of content. This module is one of most powerful megamenu modules that you can find.

Here's the general look of the Menu Builder:

Megamenu

ADD CUSTOM LINK / TEXT: You can use this form to add custom link or custom text to the menu. It's good for creating custom links and titles for your other link groups.


ADD CATEGORY LINK: You can use this form to quickly add links to your categories. Megamenu will use the category name as the title of the link. This way, if you change your category name or modify its translation for any other language, megamenu will be updated automatically.


ADD PRODUCT LINK: You can use this form to quickly add links to your products. Megamenu will use the product name as the title of the link. This way, if you change your product name or modify its translation for any other language, megamenu will be updated automatically.


ADD MANUFACTURER LINK: You can use this form to quickly add links to your manufacturers. Megamenu will use the manufacturer name as the title of the link. This way, if you change your manufacturer name or modify its translation for any other language, megamenu will be updated automatically.


ADD SUPPLIER LINK: You can use this form to quickly add links to your suppliers. Megamenu will use the supplier name as the title of the link. This way, if you change your supplier name or modify its translation for any other language, megamenu will be updated automatically.


ADD CMS PAGE LINK: You can use this form to quickly add links to your CMS pages. Megamenu will use the CMS page title as the title of the link. This way, if you change your CMS page title or modify its translation for any other language, megamenu will be updated automatically.


ADD CUSTOM CONTENT: To add a custom content area to your menu, simply click the Add Custom Content button. This will add a special menu item that you can put whatever content you want in it. We will take a close look at this menu item later.


ADD DIVIDER: Divider is one of the most important menu items. You can use it to divide your menus. Ex: Create a row with 2 columns, then put a divider and then add another row with 2 columns. This will create a perfect 2 by 2 menu layout. Basically divider will create a new line in your menu layout.

Let's add a custom text using the first form so we can take a look at the Structure Builder. Fill the title area and click Add Custom Link / Text button.

Megamenu


As soon as you click to the button, content will be added. Thanks to the Ajax, no page reload, no waiting!

Megamenu


Let's go ahead and click to the Edit link of the menu item that we added just now.

Megamenu

As you can see, you can edit all the menu items individually by clicking edit link. Some of them may have different fields but the general concept is the same. If you make any changes in here, don't forget to click Update Menu Item button, otherwise your changes won't be saved. Also, each menu item has its own update button, so clicking an update button only save that particular menu item, not all of them. Obviously, to delete that menu item, just click to the Delete Menu Item button. It will be deleted in no time, again, thanks to ajax, no waiting, no page reloads!

Yes, you can also drag and drop them to create your own columns, rows, link groups and many more..

Megamenu

To add a custom content, add Custom Content menu item to your menu, click Edit link, and then click on the Custom Content field. It will reveal the rich text editor toolbar that you can use for adding/editing your custom content.

Megamenu

Most of the menu items have a Custom class field for adding a custom class name for that particular menu item, a Icon class field for adding a custom icon font by adding its class name (there are tons of icons already included into the theme and you can always add more), a Column size selection for adjusting the size of that particular menu item, a Open in new tab checkbox to open the links in new browser tab/page.

Product links, Manufacturer and Suppliers links have an extra Show Image option. If you don't check it, these items will shown as normal text links. If you check it, the item image (Product, Manufacturer or Supplier image according to the menu type) will be shown in the menu.

Megamenu

You can experiment with the megamenu by yourself to see what it's capable of. It's not possible to cover all the possibilities in this documentation unfortunately. If you have any questions about the megamenu, you can ask them in the dedicated support ticket area.

You can find the link to the support ticket area in 5.Support > Dedicated support system section.

IX. Product Share Buttons

Product Share Buttons is a basic module that adds social sharing icons to the product pages using AddThis.com sharing icons.

To access to the Product Share Buttons module, use the Withinpixels > Product Share Buttons menu.

In the configuration area, you can insert your profile ID to keep track the sharing stats from your product pages. To be able to do this, you need to sign up to the addthis.com and get a profile id. Then you can keep track of the sharing stats using addthis.com's dashboard. You can leave this field empty if you want. Social sharing icons will still work properly.

Product share buttons

X. Blog

Blog is an extensive blog module developed from scratch for Autumn theme. This module has multilanguage and multishop support.

To access to the Blog module, use the Withinpixels Blog menu.


CATEGORIES: There are two pre-defined, non-deletable blog categories: Uncategorized and Featured

Uncategorized category can be used for any blog posts. Also, if you remove any of the categories, blog posts that assigned to that category will automatically moved under the Uncategorized category.

Featured category can be used to make blog posts featured. Featured blog posts will be shown in the main blog page.

Blog Categories


To add a new category, simply click Add New Category button from the toolbar.

Add new category

Parent Category: You can create complicated category structures with the blog module.

Category Name: You have to enter a category name to create a category.

Category Description: Category descriptions will be shown in category pages.

Meta Description: Meta description will be available as a meta description tag in blog category pages.

Friendly URL: You can change the visible url of your blog categories if you want.

Displayed: You can enable or disable a category by using this option.

Group Access: This is one of the best features of the blog module. You can hide certain categories from certain customer groups. For example you can create blog posts only visible to your loyal customers or to only guests.

POSTS: You can see the current blog posts in this page.

Blog Posts


To add a new blog post, simply click Add New Post button from the toolbar.

Add new post

As you can see from this screenshot, image upload and related products section will be available after saving the post for the first time. If you want to upload images and/or add related products, you need to save the blog post first. Then edit the post and you will be able to use these sections.

GENERAL

Add new post - General

Post Type: There are four post types available in blog module: Standard, Gallery, Slider and Video.

   Standard blog posts have one featured image and a main post text.

   Gallery blog posts can show multiple images as an image collage.

   Slider blog posts will show the uploaded images as a slider.

   Video blog posts can show embed videos.

Categories: Blog posts can be assigned more than one category.

Displayed: You can enable or disable a category by using this option.

Sticky: You can make a blog post sticky. Blog posts are ordered by their post dates. Sticky posts will be always at the top in category pages.

Comments: You can disable comments for each post individually. There is also a global option for disabling comments.

POST

Add new post - Post

You can set the Post Title, Teaser and the Post itself from this section. If there is no Teaser, part of the Post will be used as teaser.

SEO

Add new post - Seo

You can use this section to individually set the SEO options of your posts.

PERMISSIONS

Add new post - Seo

You can use this section to set the permission of the blog post.

RELATED PRODUCTS

Add new post - Related Products

You can use this section to add related products to your blog posts. They will be shown at the very bottom of the blog post as a carousel.

IMAGES

Add new post - Images

You can use this section to add images to your blog post.

VIDEO

Add new post - Video

You can use this section to add video embed code. Videos will be only visible if the post type set as Video. Otherwise you won't be able to see the video in the blog post.

VIEW

Add new post - View

You can set the post size from this section. If you make a post Double sized, it will take up a space of two blog posts in Grid and Masonry views. It's good for making the post more eye-catching.



COMMENTS

You can access to the Comments from Withinpixels Blog > Comments menu. You can moderate (edit, approve, delete) comments from this page.



BLOG OPTIONS

You can configure the blog module for your likings by using the Options page. Blog options are pretty self explanatory. You can experience with them a little bit. If you have any questions you can always open a support ticket at withinpixels.ticksy.com

Blog options

If you want to see how different blog posts showing in the shop, you can visit the demo shops.

XI. Blog Helper Modules

There are number of modules that extends the functionality of the Blog module. These modules are:

1 Withinpixels - Blog Archives

2 Withinpixels - Blog Categories

3 Withinpixels - Blog Custom Block A

4 Withinpixels - Blog Custom Block B

5 Withinpixels - Blog Related Posts

You can access to these modules from Modules > Modules page.

Blog Archives: This module can be hooked into Left Sidebar and Blog Sidebar positions. It will list all the months and years that blog posts published on.

Blog Categories: This module can be hooked into Left Sidebar and Blog Sidebar positions. It will show the available blog categories.

Blog Custom Block A & Blog Custom Block B: These modules can be hooked into Left Sidebar, Blog Sidebar and Homepage positions. They can be configured to show certain amount of posts from certain category or categories with certain order.

Blog Related Posts: This module can only be hooked into Right Sidebar which is only available for product pages and it will show the blog posts related with the product.

XII. Custom Footer Block

This module allows you to put custom HTML content into the footer area of your shop. It also has multilanguage and multishop support.

To access to the Custom Footer Block module, use the Withinpixels > Custom Footer Block menu.

XIII. Facebook Block

This module allows you to put Facebook Like Box into the footer or left column area.

To access to the Smartcodes module, use the Withinpixels > Facebook Block menu.

XIV. Smartcodes

This module allows you to put custom codes into the certain text areas to create certain HTML elements easily. It's based on Wordpress' Shortcode system.

To access to the Facebook Block module, use the Withinpixels > Smartcodes menu. You can enable or disable the smartcodes by using the configuration panel of the module.

You can use Smartcodes in Product Short and Full Description areas, Megamenu Custom Content and CMS Page Content areas.

Here is available Smartcodes that you can use:

[row][/row]
[column][/column]
[button][/button]
[icon/]

Examples:

[icon type='wpicon-facebook' /]Follow us on Facebook

[button link="http://www.withinpixels.com" target="_blank" type="button-1 fill" class="extra-class-name"][icon type='wpicon-facebook' /]Follow us on Facebook[/button]



[button link="http://www.withinpixels.com" target="_blank" type="button-1 fill" class="extra-class-name"]Button[/button]

[button link="http://www.withinpixels.com" target="_blank" type="button-1 flat" class="extra-class-name"]Button[/button]

[button link="http://www.withinpixels.com" target="_blank" type="button-1 outline" class="extra-class-name"]Button[/button]

[button link="http://www.withinpixels.com" target="_blank" type="button-1 fill sharp-corners" class="extra-class-name"]Button[/button]

[button link="http://www.withinpixels.com" target="_blank" type="button-2 fill" class="extra-class-name"]Button[/button]



[column col="4-12"]

[icon type="wpicon-power" size="medium2" class="round" /]

It's powerful

Autumn has a lot of features to give your customers a unique experience. It also has powerful
modules such as Megamenu module that allows you to create unique menu layouts.

[/column]

[column col="4-12"]

[icon type="wpicon-transmission2" size="medium2" class="round"/]

It's fluid!

Because of the fluid design, your shop will look perfect in every screen! Resize your browser
window right now to experience the Autumn's fluid design!

[/column]

[column col="4-12"]

[icon type="wpicon-heart2" size="medium2" class="round" /]

It's developer friendly!

Autumn's custom css grid system built with necessary shopping elements in mind. You won't
need weird workarounds to make things work unlike many other pre-built css grids.

[/column]

Smartcodes

ROW

You can use this Smartcode to enclose your text or other Smartcodes. It will create an auto cleared wrapper around the enclosed content. If you have overflowing issues or if you want to group your columns and/or other content you can use this Smartcode.

COLUMN

With this Smartcode, you can create columns. Here's an example column Smartcode with all possible attributes:

[column col="col-6-12" class="extra-class-name"] CONTENT GOES HERE [/column]

Use col attribute to change the column size. You can use 12 or 16 column system. (3-12 , 7-12 , 4-16 , 15-16 etc.)
Use class attribute to insert extra class names to the columns for further customization.

BUTTON

With this Smartcode, you can create buttons very easily. Here's an example button:

[button link="http://www.withinpixels.com" target="_blank" type="button-1 fill" class="extra-class-name"]Withinpixels[/button]

Use link attribute to insert links.
Use target attribute to force links open in new tab/window. Remove it completely to open links in the same tab/window.
Use type attribute to change the button styles. You can see the available button types in the sample code and screenshot above.
Use class attribute to insert extra class names to the columns for further customization.

ICON

With this Smartcode, you can create icons very easily. Here's an example Facebook icon:

[icon type='wpicon-facebook' class="round"/]Follow us on Facebook

Use type attribute to change the icon. You can see all available icons in the Post Installation > Tips section of this documentation.
Use class attribute to insert extra class names to the columns for further customization. You can use round and square at the moment. Or you can create more css rules yourself.

You can always combine and use Smartcodes within other Smartcodes. As long as you follow the rules and close the tags properly, Autumn will render them correctly. There will be more Smartcodes in the future and this section of the documentation will be updated as they added.

5. Support

I. Frequently Asked Questions

1 Can I use Autumn 2 with Prestashop 1.5.x.?

Unfortunately, Autumn 2 is only available for Prestashop 1.6.x. and there will never be a 1.5.x. version. You really should upgrade your Prestashop as it won't be supported from Prestashop team anymore.


2 Autumn is slower than the default theme! What's up with that?

Yes, Autumn is slower compared to the default theme mostly because there are tons of features included into the theme that default theme doesn't have. The theme has a lot of extra css and javascript files as well as custom modules that makes your shop a little bit slower compared to the default theme and it's perfectly normal. I tried to make the Autumn as light as possible and I will try to improve it more in the future.


3 Is there no IE8 support?

IE8 support is dropped in Autumn 2 and no, there will be no support for IE8.


4 My shop looks horrible in IE9!

This is because of the "beautiful" limitation of IE9. Basically, IE9 won't load more than 31 CSS files. You need to activate the Smart cache for CSS option from Advanced Parameters > Performance page. This will compress the css files into one big file and your shop will look perfectly fine in IE9.


5 I bought this 3rd party module and it is not working with your theme!

Autumn is based on default theme so it shouldn't have a big issue, although, in the world full of 3rd party modules, you can't expect a full 3rd party module support from a theme.


6 Are you still going to update the theme?

Yes, I will keep updating the theme. I will also keep adding new features and modules to the theme.


7 Will I get those updates for free?

Yes, you will get all future updates for free!


8 Can you install the Prestashop and the theme for me?

Unfortunately, I'm not giving any support for installations, customizations and I'm not doing any kind of administration.


9 Can you customize my shop?

See the question #8.


10 I have trouble with shipping prices, product images, category names etc...

Normally, I'm not giving support for Prestashop issues such as those. But I never turned down any of my customers to this day and I always tried to help them whether the issue is directly related with the theme or not. I also would like to remind you that the support is NOT mandatory for Themeforest items. So basically, if you ask kindly, I'd try to do as much as possible.

II. Dedicated support system

I have a dedicated support ticket system at withinpixels.ticksy.com and you can create a ticket for your questions.

I also would like to remind you that the support is NOT mandatory for Themeforest items, so I'm only doing this because I care my customers. So, please don't forget to be kind while asking your questions. Also support requests made from item comments, twitter, facebook or any other platform other than dedicated support ticket system will NOT be answered.



Once again, thank you for purchasing my theme.