Back to top

YITH WooCommerce Ajax Navigation Documentation

Thank you so much for using our plugin.

YITH WooCommerce Ajax Navigation - Wordpress plugin

This document covers the installation and use of this plugin and reveals answers to common problems and issues - I encourage you to read this document if you are experiencing any difficulties.

Get started!


 

Getting started

To install this plugin you must have a working version of WordPress already installed. For information in regard to installing the WordPress platform, please see the WordPress Codex - http://codex.wordpress.org/Installing_WordPress

Installation

Upload via ftp:

First, unzip the zip archive you downloaded on your computer. Upload the folder to your server via ftp to the   /plugins/ directory on your Wordpress installation. (wp-content > plugins)

Upload via Wordpress admin:

Go to your Wordpress admin, and in the Plugins-panel, choose Add New. Click Upload in the below the title "Install Plugins". Upload the plugin zip.

Installing WordPress  http://codex.wordpress.org/Installing_WordPress

Activation

Once you have uploaded the plugin, activate your plugin in Plugins > Installed plugins.
This plugin will work only if WooCommerce - excelling eCommerce is installed and active.

The plugin is now active and can be included in your theme.

Use the Widget

In order to use the Widget in your Wordpress installation you first need to configure your shop.

The widget works with Product Attributes. This means you need to create the Attributes and to assign them to your products.

References:

Once you have customized your products with Product Attributes you're able to use the Widget. First of all open the Widgets section from Appearence > Widgets.

Choose the YITH WooCommerce Ajax Navigation and configure it. You can use multiple widgets at the same time.

The widget accepts the following customizations:

  • Title: the title of the widget
  • Attribute: the Product Attribute you want to display
  • Query Type: the query type.
    • AND – If a user selects two attributes, only products with match both attributes will be returned
    • OR – If a user selects two attributes, products which match either attribute will be returned
  • Type:
    • List - Common visualization. An unordered list of attributes
    • Color – A list of blocks in which you can define the color
    • Label – A list of blocks in which you can define the label contained
    • Dropdown – A select in which you can define the label contained

In case you selected a Color or Label type, you can configure each Product Attribute.

Color

Label

Dropdown

This is the final result

Codex

If you need to customize the style of Colors and Labels you just need to copy the code contained within the assets/css/frontend.css file and paste the code in your theme. Now you can easily customize the code.

Custom Javascript

If your product list contains some Javascript code, once the ajax filters are selected they cannot longer work. In order to fix this issue we have included two triggers you can include in your code:

  //trigger ready event
  $(document).trigger("ready");
  $(document).trigger("yith-wcan-ajax-filtered");
            

FAQ

The widget is not displayed in my sidebar. Why?

In order to display the widget you need to assign it to the sidebar in the Shop page and you need to add Product Attributes to your product. Read the Getting Started section to learn how to add them.

Localization

This plugin is ready for localization via .po/.mo files.

If you are not familiar with translating Wordpress plugins, I recommend you reading this article: http://codex.wordpress.org/Translating_WordPress

Change the language of YITH WooCommerce Ajax Navigation Languages for dummies

  1. Check the values of your wp-config, the language of this file must match to your translation;
  2. Find the folder languages of the plugin
  3. Duplicate default.po
  4. Rename your copy of default.po example: yit-fr_FR.po for France, yit-en_EN.po for English, yit-he_HE.po for hebraic, and so on.
  5. Download POEdit
  6. Open your file with the POEdit software
  7. Update the catalog using the POT file (Catalog -> Update from POT file...)
  8. Translate your file (edit catalog properties using POEdit to add your credits)
  9. In File click on Preferences and tick Automatically generate mo
  10. Save your file
  11. Send the new .mo and .po via FTP to your server, in the folder languages of the plugin
  12. Send the new .mo and .po via email to plugins@yithemes.com so we can improve the quality of the plugin and you can help other users. We will thank you with official credits

Version 1.3.1 - Released: Mar, 03 - 2014

  1. Added: Attribute order (All, Hieralchical or Only Parent style)
  2. Fixed: Dropdown Style on Firefox
  3. Fixed: Blank box on attribute without label (Label Style)
  4. Fixed: Blank box on attribute without color (Color Stle)

Version 1.3.0 - Released: Feb, 12 - 2014

  1. Added: Support to WooCommerce 2.1.X
  2. Fixed: One filter bug on sidebar

Version 1.2.1

  1. Fixed: Width of select dropdown too large

Version 1.2.0

  1. Added: Dropdown style
  2. Added: Support to Wordpress 3.8
  3. Fixed: Error with non-latin languages
  4. Fixed: Improved WPML compatibility

Version 1.1.2

  1. Added: Title to the color filters
  2. Removed: Limit of 3 characters in the label text input

Version 1.1.1

  1. Minor bugs fixes

Version 1.1.0

  1. Added new widget YITH WooCommerce Ajax Reset Navigation.

Version 1.0.0

  1. Initial release.