Blanco - Responsive WordPress E-Commerce Theme - 20Script

# Blanco - Responsive WordPress E-Commerce Theme

- created: 06/23/2013
- latest update: 04/29/2015
- by: 8theme

Compatible with: WP e-Commerce 3.8.x, WooCommerce 2.3.x
You may contact us on: 8theme.com/forums

### Installation

Current documentation was created to help you with quick installation and configuration of Blanco theme. Please, read it carefully to avoid most of potential problems with incorrect configuration.

To install this theme you must have a working version of WordPress already installed. You should also install WP e-Commerce or WooCommerce plugin for the correct work of our theme. The links for the plugins are provided below.

For detailed Wordpress installation instructions visit http://codex.wordpress.org/Installing_WordPress

For detailed WP E-commerce installation instructions or for more information visit http://wordpress.org/extend/plugins/wp-e-commerce/installation/

For detailed WooCommerce installation instructions or for more information visit http://www.woothemes.com/woocommerce/

Download the zipped package from ThemeForest and extract to your desktop. In the extracted package you will find Blanco_WordPress_Theme.zip file which is the wordpress theme.

### You can install the theme in two ways:

- WordPress: Navigate to Appearance > Add New Themes > Upload page. Select Blanco_Theme.zip file. Press the Install Now button to upload and install the theme;

If you get error:

This usually occurs when either the PHP memory limit or max post size for WordPress has been reached.

The easiest workaround for this is to install theme through FTP (see below).

Alternatively you'll need to change a number of settings either on Wordpress or on your web host.

- FTP: Extract Blanco_Theme.zip file and upload the extracted folder to /wp-content/themes/ folder on your server. Navigate to Appearance > Themes and activate Blanco theme.

Once you have activated the theme you will need to change some of the pages and media settings for optimal performance.

### Demo Data Installation

The next step gives the opportunity to install automatically the Home Page with banners and product sliders, the page Contact Us with contact form shortcode,Blog and Typography page. But do this at once after installation Wordpress and Blanco theme, as this function works with database and it can break your settings.

You can make this installation manually as well

Follow the steps below and you will be adding content in no time.

#### Home page

1. Create a page called "Homepage".
2. To add banners on the home page (as on demo under the main slider) you need to add the following HTML code:

       <div class="banner one-half">
        <img src="[etheme_template_url]/images/assets/b1.jpg" alt="" />
         [etheme_btn title="Shop Now" url="test_url" class="active"]
       </div>
       <div class="banner one-half last">
        <img src="[etheme_template_url]/images/assets/b2.jpg" alt="" />
        [etheme_btn title="Shop Now" url="test_url" class="active"]
       </div>
       <div class="clear"></div>

3. To add products sliders on the home page(WooCommerce):

       [etheme_featured]
       [etheme_new title="Latest Products" ]

   To add products sliders on the home page (WP E-Commerce):

       [etheme_bestsellers]
       [etheme_new title="Latest Products" ]

4. Set the page template (under page attributes) to Frontpage.

#### Blog

Create a page called "Latest News" (or whatever you want your blog called) and leave the page template as default.

Go to Settings -> Reading, and change the "Front page displays" setting to "A static page", set the front page to your homepage, and "Posts Page" to the blog page you just created.

#### Typography Page

This page contains examples of using our theme shortcodes (see item Blanco Shortcodes).

Create a page, set the page template (under page attributes) to "One column, without sidebar" and add the following code:

    [etheme_column size="one_third" last="0"]
    <h4>Buttons</h4>
    [etheme_btn title="Simple Button" url="#" big="0" active="0"]
    [etheme_btn title="Active Button" url="#" big="0" active="1"]
    [etheme_btn title="Large Button" url="#" big="1" active="0"]
    [etheme_btn title="Large Active Button" url="#" big="1" active="1"]
    [/etheme_column]

    [etheme_column size="one_third" last="0"]
    <h4>Dropcaps</h4>
    [etheme_dropcap]C[/etheme_dropcap]ras aliquet. Integer faucibus, eros ac molestie placerat,
    enim tellus varius lacus, nec dictum nunc tortor id urna
    eros ac molestie placerat, enim tellus varius nec dictum nunc tortor id urna
    eros ac molestie placerat, enim tellus varius.
    [etheme_dropcap class="dark"]D[/etheme_dropcap]ras aliquet. Integer faucibus, eros ac molestie placerat,
    enim tellus varius lacus, nec dictum nunc tortor id urna
    eros ac molestie placerat, enim tellus varius nec dictum nunc tortor id urna
    eros ac molestie placerat, enim tellus varius.
    [/etheme_column]

    [etheme_column size="one_third" last="1"]
    <h4>List Styles</h4>
    [etheme_list style="arrow"]<li>Arrow List - There are many variations</li>[/etheme_list][etheme_list style="arrow_2"]<li>Arrow 2 List - There are many variations</li>[/etheme_list][etheme_list style="circle"]<li>Circle List - There are many variations</li>[/etheme_list][etheme_list style="check"]<li>Check List - There are many variations</li>[/etheme_list][etheme_list style="square"]<li>Square List - There are many variations</li>[/etheme_list][etheme_list style="star"]<li>Star List - There are many variations</li>[/etheme_list][etheme_list style="plus"]<li>Plus List - There are many variations</li>[/etheme_list][etheme_list style="dash"]<li>Dash List - There are many variations</li>
    [/etheme_list][/etheme_column]
    <div class="clear"></div>

    [etheme_column size="two_third" last="0"]
    <h4>Tabs</h4>
    [etheme_tabs][etheme_tab title="First Tab"]1. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nisl orci, condim entum ultrices consequat eu, vehicula ac mauris. Ut adipiscing, leo nec. Lorem ipsum dolor sit amet, consectetur adipiscing elit., consectetur adipiscing elit. Aenean nisl orci, condim entum, consectetur adipiscing elit. Aenean nisl orci, condim entum ultrices consequat eu, vehicula ac mauris. Ut adipiscing, leo nec. Lorem ipsum dolor sit amet, consectetur adipiscing elit. ultrices consequat eu, vehicula ac mauris. Ut adipiscing, leo nec. Lorem ipsum dolor sit amet, consectetur adipiscing elit.[/etheme_tab][etheme_tab title="Second Tab"]2. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nisl orci, condim entum ultrices consequat eu, vehicula ac mauris. Ut adipiscing, leo nec. Lorem ipsum dolor sit amet, consectetur adipiscing elit., consectetur adipiscing elit. Aenean nisl orci, condim entum, consectetur adipiscing elit. Aenean nisl orci, condim entum ultrices consequat eu, vehicula ac mauris. Ut adipiscing, leo nec. Lorem ipsum dolor sit amet, consectetur adipiscing elit. ultrices consequat eu, vehicula ac mauris. Ut adipiscing, leo nec. Lorem ipsum dolor sit amet, consectetur adipiscing elit.[/etheme_tab][etheme_tab title="Third Tab"]3. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nisl orci, condim entum ultrices consequat eu, vehicula ac mauris. Ut adipiscing, leo nec. Lorem ipsum dolor sit amet, consectetur adipiscing elit., consectetur adipiscing elit. Aenean nisl orci, condim entum, consectetur adipiscing elit. Aenean nisl orci, condim entum ultrices consequat eu, vehicula ac mauris. Ut adipiscing, leo nec. Lorem ipsum dolor sit amet, consectetur adipiscing elit. ultrices consequat eu, vehicula ac mauris. Ut adipiscing, leo nec. Lorem ipsum dolor sit amet, consectetur adipiscing elit.[/etheme_tab][/etheme_tabs]
    [/etheme_column]

    [etheme_column size="one_third" last="1"]
    <h4>Alert Boxes</h4>
    [etheme_alert type="error" title="Error -"]Your message![/etheme_alert][etheme_alert type="success" title="Success -"]Your message![/etheme_alert][etheme_alert type="info" title="Info -"]Your message![/etheme_alert][etheme_alert type="notice" title="Notice -"]Your message![/etheme_alert]
    [/etheme_column]
    <div class="clear"></div>

    <h4>Headings</h4>
    <hr />
    <h1>This is a H1 Heading</h1>
    Tristique nascetur ultrices et porttitor, tincidunt augue quis eu ultricies montes, auctor et turpis! Cum lundium tortor! Scelerisque eros ultrices, adipiscing porttitor nec est nascetur placerat porta tincidunt augue, diam sociis, a lacus elementum hac porttitor! Tincidunt, tincidunt ut nec tortor parturient diam. Ultrices! Magnis penatibus diam porttitor arcu.
    <pre><code class="xml"><span class="tag"><<span class="title">h1</span>></span>This is a H1 Heading<span class="tag"></<span class="title">h1</span>></span></code></pre>
    <h2>This is a H2 Heading</h2>
    Tristique nascetur ultrices et porttitor, tincidunt augue quis eu ultricies montes, auctor et turpis! Cum lundium tortor! Scelerisque eros ultrices, adipiscing porttitor nec est nascetur placerat porta tincidunt augue, diam sociis, a lacus elementum hac porttitor! Tincidunt, tincidunt ut nec tortor parturient diam. Ultrices! Magnis penatibus diam porttitor arcu.
    <pre><code class="xml"><span class="tag"><<span class="title">h2</span>></span>This is a H2 Heading<span class="tag"></<span class="title">h2</span>></span></code></pre>
    <h3>This is a H3 Heading</h3>
    Tristique nascetur ultrices et porttitor, tincidunt augue quis eu ultricies montes, auctor et turpis! Cum lundium tortor! Scelerisque eros ultrices, adipiscing porttitor nec est nascetur placerat porta tincidunt augue, diam sociis, a lacus elementum hac porttitor! Tincidunt, tincidunt ut nec tortor parturient diam. Ultrices! Magnis penatibus diam porttitor arcu.
    <pre><code class="xml"><span class="tag"><<span class="title">h3</span>></span>This is a H3 Heading<span class="tag"></<span class="title">h3</span>></span></code></pre>
    <h4>This is a H4 Heading</h4>
    Tristique nascetur ultrices et porttitor, tincidunt augue quis eu ultricies montes, auctor et turpis! Cum lundium tortor! Scelerisque eros ultrices, adipiscing porttitor nec est nascetur placerat porta tincidunt augue, diam sociis, a lacus elementum hac porttitor! Tincidunt, tincidunt ut nec tortor parturient diam. Ultrices! Magnis penatibus diam porttitor arcu.
    <pre><code class="xml"><span class="tag"><<span class="title">h4</span>></span>This is a H4 Heading<span class="tag"></<span class="title">h4</span>></span></code></pre>
    <h5>This is a H5 Heading</h5>
    Tristique nascetur ultrices et porttitor, tincidunt augue quis eu ultricies montes, auctor et turpis! Cum lundium tortor! Scelerisque eros ultrices, adipiscing porttitor nec est nascetur placerat porta tincidunt augue, diam sociis, a lacus elementum hac porttitor! Tincidunt, tincidunt ut nec tortor parturient diam. Ultrices! Magnis penatibus diam porttitor arcu.
    <pre><code class="xml"><span class="tag"><<span class="title">h5</span>></span>This is a H5 Heading<span class="tag"></<span class="title">h5</span>></span></code></pre>
    <h6>This is a H6 Heading</h6>
    Tristique nascetur ultrices et porttitor, tincidunt augue quis eu ultricies montes, auctor et turpis! Cum lundium tortor! Scelerisque eros ultrices, adipiscing porttitor nec est nascetur placerat porta tincidunt augue, diam sociis, a lacus elementum hac porttitor! Tincidunt, tincidunt ut nec tortor parturient diam. Ultrices! Magnis penatibus diam porttitor arcu.
    <pre><code class="xml"><span class="tag"><<span class="title">h6</span>></span>This is a H6 Heading<span class="tag"></<span class="title">h6</span>></span></code></pre>

    <h4>Block Quotes</h4>
    <hr />
    [etheme_blockquote align="left"]<p>Consectetuer adipiscing elit. Mauris fermentum dictum magna</p>[/etheme_blockquote]Aliquam erat volutpat. Duis turpis. Integer rutrum ante eu lacus consectetuer. Adipiscing elit. Maurisfetun Duis ultricies pharetra magna. Donec accumsan malesuada orci lorem ipsum dolor amet consecttuer unean auctor wisi eturna. Aliquam erat volutpat. Duis turpis. Integer rutrum ante eu lacus consectetuer. Adipis cing elit. Maurisfetun Duis ultricies pharetra magna. Donec accumsan malesuada orci. Donec amet eros. Lorem ipsum dolor amet.
    <hr />
    [etheme_blockquote align="right"]<p>Consectetuer adipiscing elit. Mauris fermentum dictum magna</p>[/etheme_blockquote]Aliquam erat volutpat. Duis turpis. Integer rutrum ante eu lacus consectetuer. Adipiscing elit. Maurisfetun Duis ultricies pharetra magna. Donec accumsan malesuada orci lorem ipsum dolor amet consecttuer unean auctor wisi eturna. Aliquam erat volutpat. Duis turpis. Integer rutrum ante eu lacus consectetuer. Adipis cing elit. Maurisfetun Duis ultricies pharetra magna. Donec accumsan malesuada orci. Donec amet eros. Lorem ipsum dolor amet.
    <hr />
    [etheme_blockquote align="center"]<p>Consectetuer adipiscing elit. Mauris fermentum dictum magna. Aliquam erat volutpat. Duis turpis. Integer rutrum ante eu lacus consectetuer<p>[/etheme_blockquote]Aliquam erat volutpat. Duis turpis. Integer rutrum ante eu lacus consectetuer. Adipiscing elit. Maurisfetun Duis ultricies pharetra magna. Donec accumsan malesuada orci lorem ipsum dolor amet consecttuer unean auctor wisi eturna. Aliquam erat volutpat. Duis turpis. Integer rutrum ante eu lacus consectetuer. Adipis cing elit. Maurisfetun Duis ultricies pharetra magna. Donec accumsan malesuada orci. Donec amet eros. Lorem ipsum dolor amet.</p>

#### Products and categories import

You may also import XML file, where some demo data from our site are, which can facilitate your work with theme. XML file (blanco.wp_e_commerce.xml - WP E-commerce, blanco.woo_commerce.xml - WooCommerce) you can find in the archive.

For this you need:

- Navigate to Tools -> Import and install WordPress import plugin.

- Select the XML file and upload it.

Do not forget:
- Folder wp-content/uploads should have permissions 777.
- Download and import file attachments should be checked.

### Upgrade

Before you begin the Blanco updating process, we recommend to do the backup of all your files!

You can update theme via FTP:

1. Download the zipped package from ThemeForest and extract to your desktop.
2. In the extracted package you will find archive Blanco_Theme.zip, which is the WordPress theme.
3. Extract zip file and upload the extracted folder to /wp-content/themes/ folder on your server with overwriting.

Important!

Do not forget to re-save your Blanco options after upgrading the theme. Navigate to admin panel > Theme Options and hit Save changes.

### Primary Menu

Blanco supports custom WordPress menu. Navigate to WP Admin > Appearance > Menus page and create menu. Check Theme locations "Top Navigation" as it mentioned on screenshot and press Save button.

####

### SlideShow

The theme supports two sliders, Layer Slider and Revolution Slider, the installation of which would be provided for you after theme activation.

After that you may create the sliders and use them on the site according to the plugin documentation. We have included folders called "documentation_Revolution_Slider" and "documentation_Layer_Slider" that contain the documentation from the authors of the sliders. Please, refer to them for further information about sliders settings. Both of the sliders can be added to any page.

Layer Slider

To set up your Layer Slider follow the next steps:

- If you want, you may use our demo slides by importing the Blanco-Layer-Slider.zip file.
- Or you may import default layer sliders by pressing Import sample sliders button
- Or create your own slider (press Add New button).
- After that you will reach a form where you are prompted to enter the slider name and set Global Settings.
- To create new slides, click on Add New Layer button.
- To add new content and animations over it, click on "add new sub layer" button for each different element you want to add.
- Once you have made your slides, press save.
- Include the Slider in our theme: from the widgets panel (drag the "Layer Slider WP" widget to the desired sidebar) or from the post editor (insert the shortcode from the sliders table).

Layer Slider update

To avoid the issues while theme installation, caused by heavy theme package, we have included last version of Layer Slider plugin in Documentation folder. If you are using an old plugin version, please, update it manually with previously mentioned LayerSlider.zip archive.

Revolution Slider

To setup Revolution Slider follow the next steps:

- Navigate to Revolution Slider -> Create New Slider.
- After that you will reach a form where you are prompted to enter the Sliders Basic Settings, a Slider Title and a Slider Alias.
- The next step is creating/editing slides. Insert the slider content.
- If you want, you may use our demo slides by importing the blanco-revolution-slider-sample.txt file, as it mentioned on the screenshot. Upload file and next push Import Slider button.

- Include the Slider in our theme: from the widgets panel(drag the "Revolution Slider" widget to the desired sidebar) or from the post editor(insert the shortcode from the sliders table).

Pay attention for the slider to be on the home page, you need to insert there shortcode of the slider.

### WP E-Commerce Settings

A lot of the WP e-Commerce settings are optional, for example breadcrumbs and category images, however there are a few presentation settings you should change to make sure everything works fine.

### Settings

- Product Groups/Products Display: Product Groups Only (All Products Displayed)
- Shopping Cart Settings: Widget
- Default Product Thumbnail Size: Height(220), Width(220)
- Default Product Category Thumbnail Size: Height(220), Width(220)
- Single Product Image Size: Height(400), Width(400)
- Display Fancy Purchase Notifications: Yes
- Use Pagination: Yes
- Page Number Position: Bottom
- Use Intense Debate Comments: No

### WooCommerce Settings

Our theme is fully compatible with WooCommerce plugin, but it's not included in theme package. You should install WooCommerce plugin before theme installation:

- Go to Plugins > Add New;
- Enter WooCommerce plugin in search field;
- Find and install WooCommerce - excelling eCommerce plugin by WooThemes;
- Activate plugin and install WooCommerce Pages (see screenshot)

- Or go to WooCommerce > System Status > Tools > Install Pages
- You can also create them manually using WooCommerce shortcodes.

After successful plugin installation you should change some WooCommerce options.

Go to WooCommerce > Settings > General and disable Lightbox.

Go to WooCommerce > Settings > Products and set image dimensions.

### Product Image Sizes

- Catalog Images: Width(220), Height(220), Hard Crop (uncheck)
- Single Product Image if you use:
  Default product page layout: Height(400), Width(400) (unmark),
  Horizontals: Height(400), Width(460) (unmark),
  Vertical, Universal: Height(400), Width(330) Hard Crop (unmark),
- Product Thumbnails: Width(68), Height(68), Hard Crop (uncheck)

### Blanco Theme Options

#### General

- Site Layout: theme has a boxed or a wide layout. When you have the boxed version activated, you can choose if the background be a custom image, a pattern or a solid color;
- Enable Custom CSS file: When you need to make some changes in the theme design, you can enable additional CSS file "custom.css", in which you can override the default styling of the theme. To create "custom.css" you can use the file "default.custom.css" which is located in theme directory.

All the CSS styles placed in this file will not be lost after upgrading the theme in the future!

- Disable 'Add To Cart' button and shopping cart: ability to turn on/off 'Add To Cart' button and shopping cart;
- Use Google Font For Headings: use your fonts for all the headings and navigations links (using Google API);
- Enable "Back To Top" button: ability to turn on/off the button “Back to top”;
- Copyright Text: custom copyright information using in footer area;

#### Product page

- Products per row: you can display products in desirable quantity per row;
- Enable Sidebar on Product Page: if you use 4 products per row, you can turn off sidebar on product page to display products on the hole width of the site;
- Product Image Hover: you can change the hover effect(swapping or enlarging);
- Sidebar position on mobile version: you can set where will be the product page sidebar on mobile version;
- Show product name: ability to show/hide product name on shop page;
- Show Price: ability to show/hide price on shop page;
- Show 'Add to cart' button: ability to show/hide 'Add to cart' button on shop page;
- Enable Navigation Accordion: add Accordion functionality to categories navigation on product page;
- Enable "NEW" icon: display the "NEW" icon (you can set your own image as its icon in the same place) for products that marked as new ones.
- Enable "SALE" icon: display the "SALE" icon (you can set your own image as its icon in the same place) for products that have special price.
- View mode: you can use List or/and Grid (E-Commerce only).
- Product Page Banner: image that is shown on default product page.

#### Single Product Page

- Ajax 'Add To Cart': you can disable/enable pop up little window on single product page indicating that cart has been updated, and then lets the user choose between “Go to Checkout” and “Continue Shopping”;
- Enable Cloud Zoom for products: ability to turn on Cloud Zoom or disable it and to have lightbox instead;
- Product page layout: you can use different page views (based on the size of the main image);
- Size Guide image: you can upload custom image with information about the sizes of the product (it will be displayed on the products where this option is turned on);
- Custom Tab: this information will be displayed on Single Product page.

#### Color Scheme

- Main color: the color used in the most of links, buttons, and other elements;
- Background settings: you can set background whatever you like.

#### Header

- Logo image URL: you can upload your logo;
- Enable top links (Register | Sign In): the ability to turn on/off links in the header;
- Enable cart widget: ability to turn on/off the shopping cart widget.

#### Contact form

- Your email for contact form: you can enter your e-mail here to receive letters sent via contact form;
- Address for Google map: you can mark your location on Google map.

#### Footer

- Use Prefooter: If its off - widget from Prefooter area will be shown.

In this section you can also find the settings of some social links, gift image and phone image.

### Registration Page

First of all allow the registration. Navigate to Settings -> General -> Membership and mark Anyone can register. Then create Register Page and set the page template (under page attributes) to Custom Registration Page.

### Portfolio

You may also use our theme as a Portfolio. It is the perfect way to share your artwork, photography, or anything visual you want to show off.

Create Portfolio Page and set the page template (under page attributes) to Portfolio. It will be the main page where will be displayed all your projects.

Then go to Theme Options -> Portfolio and set necessary options.

You may create New Projects at Portfolio -> Add New.

### Wishlist

If you use WooCommerce plugin your customers can browse through your store and add items to list to compile an itemization of goods or services they desire.

Crete WishList page if it's not created yet using following shortcode [yith_wcwl_wishlist]

Go to WooCommerce > Settings > Pages and select your Wishlist Page.

Go to WooCommerce > Settings > Wishlist and set other desired settings.

### Blanco Shortcodes

There are several shortcodes which can be used in Blanco theme inside posts and pages. You can look at examples on Typography page of our demo here.

- [etheme_bestsellers title=""] insert the bestselled products slider (only for WP e-Commerce plugin) ;
- [etheme_featured] insert the featured products slider (only for WooCommerce plugin);
- [etheme_new title=""] insert the slider of new products (where the option "NEW" on);
- [etheme_contacts] insert the functionality of a contact form;
- [etheme_template_url] the path for template folder;
- [etheme_base_url] the path for WordPress folder;
- [etheme_btn title="" url="" class="" big="0" active="1"] insert the button. Set attributes big and active to specify the type of button
- [etheme_blockquote align="right"] insert the blockquote. Set attribute align to left, right or center alignment of blockquote. Left is default.
- [etheme_list style="circle"] insert the unordered list. Set style attribute to specify list styling.
- [etheme_dropcap] insert the dropcap. Set class attribute (dark, standard) to specify dropcap type.
- [etheme_alert type="success" title="Success!"] insert the alert block with custom title and message. Set type attribute to specify type of alert, and title attribute to specify title of alert. You can use any custom text inside shortcode
- [etheme_tabs], [etheme_tab title=""] shortcodes to create block with tabs. Should be used together in a specific order. For example:
  [etheme_tabs][etheme_tab title="First Tab"]Tab_1 content[/etheme_tab][etheme_tab title="Second Tab"]Tab_2 content[/etheme_tab][etheme_tab title="Third Tab"]Tab_3 content[/etheme_tab][/etheme_tabs]
  this code will create three tabs with three contents for it.
- [etheme_column size="one_half" last="1"] insert a column. You can put any content inside column, using opening and closing shortcode. Attributes: size (one_half, one_third, one_fourth, two_third, three_fourth) specify size of column, last (1, 0) specify will there be any columns after it. Use this shortcode on pages with "One column, no sidebar" template!
- For example:
  [etheme_column size="one_half" last="0"]column1_content[/etheme_column]
  [etheme_column size="one_half" last="1"]column2_content[/etheme_column]

If you use WooCommerce plugin you may also use WooCommerce shortcodes. To make them work in our theme, you need to insert prefix "etheme_" before shortcode words. For example: [etheme_best_selling_products per_page="12"] will display best selling products and [etheme_product_category category=" "] - multiple products in a category by slug etc.

### Widgets

There are a total of 13 widget areas which you can use to add your own content and functionality. There are five widgets in the sidebars, one in top footer area, seven in the lower footer area.

##### Home Page sidebar:

- Text widget with following code:

    <a href="#"><img src="http://YOUR_PATH/wp-content/themes/blanco/images/assets/home_1.png"></a>
    <a href="#"><img src="http://YOUR_PATH/wp-content/themes/blanco/images/assets/home_2.png"></a>
    <a href="#"><img src="http://YOUR_PATH/wp-content/themes/blanco/images/assets/home_3.png"></a>
    <span class="close-parent"> </span>

##### Product Page sidebar:

- 8theme - Subcategories List
- Woocommerce Price Filter (WooCommerce) or Price Range widget (WP E-Commerce)
- Text widget with following code:

    <div class="side_banner">
    <img src="http://YOUR_PATH/wp-content/themes/blanco/images/assets/side_banner.png">
    <a href="#" class="button active"><span>Shop Now</span></a>
    </div>

- Text widget "CUSTOM BANNER" with following code:

    <p style="margin-bottom: 10px;border-bottom: 1px solid #efefef; padding-bottom:10px;">This is a HTML block; you can create it via admin panel. There are many blocks like this on site. They are created especially to set to everybody’s preferences. If you have any questions please make a request via our <a href="#" target="_blank">contact form</a></p>
    <p>Thanks</p>

##### The First, Secont, Third, Fourth Footer Widget Area:

- Text widgets with following code:

    <ul>
     <li><a href="#">New products</a></li>
     <li><a href="#">Top sellers</a></li>
     <li><a href="#">Specials</a></li>
     <li><a href="#">Manufacturers</a></li>
     <li><a href="#">Suppliers</a></li>
     <li><a href="#">Specials</a></li>
     <li><a href="#">Customer Service</a></li>
    </ul>

##### Footer Twitter Area:

- 8theme - Twitter feed:

- Go https://dev.twitter.com/apps and sign in with your own twitter ID.
- Click on the Create A New Application button;
- Fill out the required fields;
- After creating the app, click Create My Access Token button to generate the necessary codes;
- Then will appear all 4 items you need: consumer key, consumer secret, access token, access token secret;
- Copy and paste each of those items along with your Twitter ID into the appropriate Twitter widget fields in Appearance > Widgets;
- Push Save button.

If you get an error on frontend, please, check permissions on your wp-content/themes/blanco/code/cache folder, it should be 777 with recursion.

##### Payments Area:

- Text widget with following code:

    <a href="#"><img src="http://YOUR_PATH/wp-content/themes/blanco/images/assets/payments.png"></a>

##### Copyrights:

- Text widget with following code:

    <ul class="links">
     <li><a href="#">Site Map</a></li>
     <li><a href="#">Search Terms</a></li>
     <li><a href="#">Advanced Search</a></li>
     <li><a href="#">Contact Us</a></li>
    </ul>

### How to translate

The translation file you can find in languages folder (/wp-content/themes/blanco/languages). Edit the .pot file using POEdit, use the translation field to make replacements. Read here how to do it right.

From the file menu, save file with your language name e.g de_DE.po into languages folder. It will generate both a .po and .mo file for your translation.

Next edit wp-config.php located in the root folder of wordpress and define the WPLANG prefix with your language name which should be similar to the translation file name.

### Child Theme

Blanco fully supports Child Theme.

A WordPress child theme is a theme that inherits the functionality of the parent theme. With child theme you can make modification or add additiona functionality to parent theme. A child theme is the safest and easiest way to modify an existing theme, whether you want to make a few tiny changes or extensive changes.

You may read how to create child theme here http://codex.wordpress.org/Child_Themes

### JavaScript

This theme utilises the jQuery framework and imports a number of custom and 3rd party scripts:

- jQuery Easing (jquery.easing.1.3.min.js) - which is used for all transition effects;
- jQuery Cookie Plugin(cookie.js) - which is used for cookies storing;
- hoverIntent.js - for hover effects;
- Cloud Zoom (cloud-zoom.1.0.2.js) - for product Zoom;
- Google Map Service;
- Superfish v1.4.8 - jQuery menu widget (superfish.js) - for menu functionality;
- Lightbox (lightbox.js).