Youtube videos
Newsflashes

UX-Pack Documentation
27.3.2013
Version 1.0.0
© Copyright 2013 - ARTIO International Co.
Abstract
This is user documentation of Magento module UX-Pack. Document describe component requirements, installation and usage. All main component parts are described in more details with examples. Document contain requirements for component environment as magento versions. Document is helpfull for components administrators.
You can also download UX-Pack documentation as pdf.
Table of Contents
Magento module Artio UX Pack provides the AJAX wrapper for layer navigation on catalog category view page, search result page and advanced search result page.
This module also replaces the standard pager system by "endless page system", where the pages are continously loaded when user scrolls the page in his browser.
Magento Community Edition 1.4.1.0 - 1.7.0.2 Magento Enterprise Edition 1.12.0.2
NOTE: If you use Magento 1.4.x or 1.5.x we recommend (but not required) the upgrade JS Prototype framework to version 1.7 or using X-UA Compatibility Meta Tag IE8
Extract disribution package (ZIP) to root of your website and refresh standard Magento cache.
Table of Contents
You can find all configuration settings in System/Configuration/Catalog/UXPack.
There are four configuration sections. First "Activation" and second "Basic Settings" for common users. Third "Extended Settings" and fourth "Endless page Settings" is intended for Magento Developers which can make compatibility with the various design templates. There assumes a basic knowledge of HTML, CSS and Magento design developing.
Activation Key - here enter your activation key, which was sent with installation package.
Note: Activation key is related to your domain. If you use it for differ domain the activation key will not be accepted.
Note: Activation key is related to Magento version. If you use key for CE version on EE version or vice versa the activation key will not be accepted.
Enabled AJAX loading products - enable or disable AJAX loading. This is the main settings of this module. If you choose "No" module will be deactivated.
Note: You can activate this module only if you entered the correct activation key.
Enabled endless pages - enable or disable "endless page system", where products page are continously loaded when user scrolls page in his browser. It can be enabled only if previous settings is set to "Yes".
Note: If you want to use endless page for grid view mode then set the number of products per page as integer multiple by number of columns (3,6,9 for 3 columns), otherwise there will appear holes (empty blocks). The number of columns you can change at "System/Configuration/Catalog/Frontend"
AJAX action - internally identification of "category view" action. For most cases there should be set to "catalog_category_view". Change this only if you use some module 3rd party which rewrites standard "Catalog_Category" controller.
AJAX search action - internally identification of "search result" action. For most cases there should be set to "catalogsearch_result_index". Change it only if you use some module 3rd party which rewrites standard "CatalogSearch_Result" controller.
AJAX advanced search action - internally identification of "advanced search result" action. For most cases there should be set to "catalogsearch_advanced_result". Change it only if you use some module 3rd party which rewrites standard "CatalogSearch_Advanced" controller.
AJAX blocks - the list of the loaded blocks by AJAX. It says which block from the layout will be placed into which DOM element in HTML. This settings has following format:
layout name1 => css_selector1;layout_name2 => css_selector2 ...
Remember these rules:
-
"enterprisecatalog.leftnav=>div.block-layered-nav;" means replace DOM element <DIV> with class `.block-layered-nav` by block with layout name `enterprisecatalog.leftnav`
-
"product_list=>!div.category-view" means insert block with layout name `product_list` into DOM element <DIV> with class `.category-view`
-
"!" at the start CSS selector means place the block INTO element, not REPLACE the element.
Default settings for basic design template of CE edition: "catalog.leftnav=>div.block-layered-nav;catalogsearch.leftnav=>div.block-la yered-nav;product_list=>div.category-products;search_result_list=>div.categ ory-products"
Default settings for basic design template of EE edition: "enterprisecatalog.leftnav=>div.block-layered-nav;enterprisesearch.leftnav= >div.block-layered-nav;product_list=>!div.category-view;search_result_list= >!div.results-view"
CSS selectors of control elements - defineds the list of elements which can intiate AJAX loading.
There is supported the events `click` on elements <A> and the events `change` on elements <SELECT>. If user click on <A> then the list of products will be loaded from URL defined by HREF attribute of it. If user change the value of <SELECT> product list will be loaded from URL defined by VALUE attribute of choosen value.
Default settings for basic design template of CE edition: "div.block-layered-nav a,div.category-products div.toolbar a,div.category-p roducts div.toolbar select"
Default settings for basic design template of EE edition: "div.block-layered-nav a,div.toolbar a,div.toolbar select"
Layout names of main block - defines which blocks represents block with product list. The values separate by comma. Default settings is "product_list,search_result_list". Change it only if you are using other layout names for these blocks.
Note if you change this value do not forget to change also AJAX blocks setting in previous section.
CSS selector of main block - defines the DOM element with product list. Default settings is "div.category-products"
Relative level to activate AJAX loading (%) - defines when should be loaded the next page. If you choose 100 then next page will be loaded if bottom line (100% of height) of the product list block is visible (it appears in view rectangle of browser). Default settings is 66.
CSS selector of container element (grid), Target position in container (grid) - defines the target position of product list in view mode GRID. First value defines DOM element, the second value defines position. For example settings "div.products" and "Bottom" says: "Place product list in view mode GRID at the bottom of element <DIV> with class "products". This controls WHERE will be block placed. The place depends on your design templage.
Default settings for basic design template of CE edition:
"div.toolbar-bottom" and "Before"
Default settings for basic design template of EE edition:
"div.category-products" and "Bottom"
Before HTML (grid), Start substring (grid), Start substring type (grid), End substring (grid), End substring type (grid), After HTML (grid) - previous settings means WHERE will be block placed, this settings means WHAT will be placed. Suppose your template for product list in view mode GRID would looks like this:
<p>My Products</p> <ul class="product-list"> <li class="product"> <span>Product 1</span> <span>100.00</span> </li> <li class="product"> <span>Product 2</span> <span>400.00</span> </li> <li class="product"> <span>Product 3</span> <span>400.00</span> </li> <li class="product"> <span>Product 4</span> <span>400.00</span> </li> </ul> <p>This was our products</p>
We need place only the list of <LI> elements, not <UL> wrapper and <P> around them. Therefore we set "Start substring" to "<li" and "End substring" to "</li>". This extracts from your template all between first occurence "<li" and last occurence "</li>".
The settings "Start substring type" and "End substring type" determines whether HTML includes border substrings or not.
By settings "Before HTML" and "After HTML" you can add some HTML before or after product list HTML. It is good for placing for example some Java Scripts does some corrections (adding CSS class first/last, etc.).
Default settings for basic design template of CE and EE edition:
- Before HTML (grid):
-
"<script type="text/javascript">$$('ul.products-grid').each(function(el) { el.removeClassName('odd'); el.removeClassName('even'); el.removeClassName(' first'); el.removeClassName('last'); });</script>"
- Start substring (grid):
-
"<ul"
- Start substring type (grid):
-
"Outer"
- End substring (grid):
-
"</ul>"
- End substring type (grid):
-
"Inner"
- After HTML (grid):
-
"<script type="text/javascript">decorateGeneric($$('ul.products-grid'), ['o dd','even','first','last'])</script>"
CSS selector of container element (list) AND Target position in container (list) - this is the same meaning also "CSS selector of container element (grid)" and "Target position in container (grid)" but for view mode LIST.
Default settings for basic design template of CE and EE edition:
"ol#products-list" and "Bottom"
Before HTML (list), Start substring (list), Start substring type (list), End substring (list), End substring type (list), After HTML (list) - this is the same meaning also in previous case but for view mode LIST.
Default settings for basic design template of CE and EE edition:
- Before HTML (list):
-
"<script type=\"text/javascript\">$$('ol#products-list li').each(function(e l){ el.removeClassName('even'); el.removeClassName('odd'); el.removeClassNa me('last'); });</script>"
- Start substring (list):
-
"<li"
- Start substring type (list):
-
"Outer"
- End substring (list):
-
"</li>"
- End substring type (list):
-
"Inner"
- After HTML (list):
-
"<script type=\"text/javascript\">decorateList('products-list', 'none-recur sive')</script>"
Layout names of blocks to remove - defines blocks which will not be generated to next page. There is need to remove for example "Toolbar Block", because on page must be only once at the start page and once the bottom page, not between pages. The default settings is "product_list_toolbar".
CSS selector of elements to hide - defines DOM elements which will be hidden after page loading. There is need to hide the pager and the select for choosing the number of page at page (these elemenst has no sense for "endless page"). The default value is "div.limiter,div.pages".
Products counters - defines the way to show information about the number of displayed products and total number of products. This settings has follow format:
css_selecto1=>format1;css_selector2=>format2;
For example "span.counter=>There is %n / %t" means that into <SPAN> element with class "counter" will be displayed text "There is x / y", where x is the number of currently displayed products and y is number of total products.
- Default settings for basic design template of CE edition:
-
"p.amount => Items 1 to %n of %t total"
- Default settings for basic design template of EE edition:
-
"p.amount => Items 1-%n of %t"

UX-Pack: AJAX User eXperience for Magento
UX Pack provides the AJAX wrapper for layer navigation on the catalog category view page, search result page and advanced search result page.
E-Tickets Video Tutorials
E-Tickets DEMO Video - Joomla 1.7 Backend
E-Tickets DEMO Video - Joomla 1.7 Frontend
Content Management System
A content management system (CMS) is a computer program that allows publishing, editing and modifying content as well as maintenance from a central interface. Such systems of content management provide procedures to manage workflow in a collaborative environment. These procedures can be manual steps or an automated cascade.(repetoon)
Document Management System
A document management system (DMS) is a computer system (or set of computer programs) used to track and store electronic documents.

JoomDOC Documentation
26.5.2014
Version 1.0.3
© Copyright 2014 - ARTIO International Co.
Abstract
This is user documentation of CMS Joomla! component ARTIO JoomDOC 3 & ARTIO JoomDOC 4. Document describe component requirements, installation and usage. All main component parts are described in more details.
Document contains information about basic managing of files and folders, features of paid versions etc. Document is helpfull for components administrators, customers or web page visitors.
You can also download JoomDOC documentation as pdf.
Table of Contents
Table of Contents
- Joomla! 1.6, 1.7 or 2.5
- Write permissions for /documents directory in Joomla! (or directory you speficy in configuration)
-
mod_dav installed on server and enabled for documents directory.
For example:
<Directory "/var/www/documents"> DAV on </Directory>
-
Enabled mod_rewrite for directory components/com_joomdoc/assets/webdav.
-
Client: java plugin in web browser.
-
If you downloaded JoomDOC, enter download ID in order to receive online upgrade. Go to
→ → and enter it.
-
Go to
→ -
Here you can see your version and newest version version got from ARTIO server.
-
If new version is avaiable, click on Upgrade. Automatic upgrade will be performed.
-
If new version is not avaiabe, but for some reason you want to reinstall the component, click on Reinstall from ARTIO server.
-
If you obtained upgrade package some way, you can upload and install it and click on Upload & Install button.
JoomDOC allows you to upload document files into folders on server, manage them, edit them, save them, and provide them to download.
You can find them on
→ (top right corner of the page)- Document root
-
You can specify JoomDOC basic working folder, relatively to your server root. If not specified, standard "documents" is used.
- Icon theme
-
You can specify set of icons used for files on frontend. If you want to use different set of icons, create new folder in components/com_joomdoc/assetes/images/icons. First part of filename is icon size (16 or 32), next part is file extensions separated by - (see default icons set).
- File Versioning (Pro version)
-
If enabled, if uplading same file, old file is not rewrited, but stored in .versions subfolder. You can see list of all uploaded versions by clickin on "i" icon on admin documents list.
- Document Versioning (Pro version)
-
If enabled, all document changes will be stored as versions, so you will always see changes over time.
- Show Versions on Frontend (Pro version)
-
If enabled, all file versions will be available to download on frontend.
- Version note required
-
If enabled, user must specify version note after each document save (see section "Managing documents")
- Display favorite
-
Whether display special favorite icon on site.
- Display signature (paid version)
-
Whether show "Powered by JoomDOC: Document Management System for Joomla."
- Use WebDav (Enteprise version)
-
Whether enable WebDav to support directly editing documents by local editors (for example, Microsoft Word). See section Requirements for remote editing for information about system requirements to use WebDav.
- File deleting
-
Way of file deleting. If selected trashing, files can be still restored from trash, unless trash is emptied. If selected "force delete", files are deleted for good.
- Use search
-
If enabled, search
- Use Explorer
-
Wheater use tree explorer (same as in JoomDOC Explorer module) in administration.
- Download ID (paid version)
-
Enter your download Id, if you want to get automatic component upgrade from ARTIO server.
- Default title
-
Header and page title on main JoomDOC page.
- Meta keywords
-
Here you can specify meta keywords used on JoomDOC main page.
- Meta description
-
Here you can specify meta description used on JoomDOC main page.
- Default description
-
Text description main JoomDOC page.
- Permissions
-
You can manage user access permission for whole JoomDOC component. They use standrd Joomla! ACL system.
NOTE: By default, all public permissions are set to inherit (so they are disabled). You will probably want to enable public permissions at least for Enter folder, View file info Download file.
-
Go to
→ → -
Browse to folder, to which you want to upload file.
-
Select local file.
-
If you selected zip file, you can check "unpack zip". Archive will be unpacked to specified location.
-
Click on Upload.
-
If you are rewriting previous file and is enabled versioning of files, old file is placed into .versions folder.
Unpack zip doesn't work?
If you get any error when upload and unpack zip archive, then check characters especially for folder names (But for sure also file names). You can not use special characters like commas, exclamation marks, question marks etc. Try to upload zip archive again after those changes.
At file upload, only information about user, time and fulltext search index is created. For more possibilites you have to create "document" - a database entry with additional info about file/folder. Note that file physicall change (both by file upload or direct saving by WebDAV) are NOT the same as document's change. Document creating and filling it is voluntary and it is created for storing additional info and (if versioning is enabled) to enable tracking down it's changes. So, users changing file contents should enter information about changes also into document.
Create document by clicking Add document + icon.
At document, you can specify:
-
Main section
-
Document title
-
Alias - Used for SEO address.
-
State - Published - file will be published, Unpublished - file won't be shown on frontend, Trashed - file is in trash.
-
Favourite - Document will be highlighted as favorite. File <div> also gets "favorite" class, which can be used for specific styling.
-
User acces level
-
License - You can select license defined in Licenses section. User must accept the license, if he wants to download the file.
-
Document description - description, which will be shown at file detail
-
Creating user
-
Time of creation
-
Publishing time, starting and ending.
-
Meta keywords and description used on document's page.
-
-
Publishing options
-
Created by
-
Created
-
Publish up - Starting time of file show.
-
Publish down -Ending time of file show.
-
-
Versions (if document versioning enabled)
-
Version - Version number. It is automatically increased. Each document save is considered as new version.
-
Version note - You can describe changes you performed in document edit. If you enabled "Version note required", this field is always mandatory.
-
-
Document Parameters
-
Display files without document (only applies to folders). - If checked AND document is folder document (not file), inside this folder will be shown also files without their document created. If not checked, all files will be displayed.
-
Meta keywords - For SEO.
-
Meta description - For SEO.
-
-
Permissions
You can specify single file permissons by same way as in component configuration.
Versions tab.
Here you can see previous document versions, their time, descriptions and notes.
Table of Contents
If you selected file versioning (see configuration), uploaded same named files will be overwritten, but previous file version will be stored.
Previous versions are stored in .versions subfolder.
If you select document versioning in configuration, each document change (clicking on Save button) will be stored as new document.
Additional edit options will be displayed:
-
Version - Number of current document version. It is incremented after each save.
-
Version note - You can specify changes you performed on document or file.
-
Versions tab - Here you can see history of all document versions. You can filter list by version note, description or user.
Table of Contents
Enterprise version includes all features from Pro version, moreover with:
You can edit files directly on server using program on your computer. It is done by WebDAV technology.
-
At document list, select "Edit file on server". Choose, which local program do you want to use for editing.
-
Program wil be opened and you can edit the document. When you are saving file, it is saved directly on the server.
Table of Contents
JoomDOC Module can show newest or most popular documents. You can adjust look if module by many settings.
Module shows folder list on expandable tree similar to Explorer in Windows.
Editor button, that allows to insert link to JoomDOC document or folder. Note: you must enable plugin after install.
Book It! 2.0.0-beta Release
Book it! 2.0.0-beta has been just released. This new edition implements the newest Joomla API and thus is compatible both with Joomla 3.0 and 2.5. However, from the same reason the 2.x edition is not anymore compatible with Joomla 1.5. This beta version is focused on web developers and early adopters.
VirtueMart SMS Notifier Released
We have just introduced a new VirtueMart extension - VM SMS Notifier. It can send SMS messages on different events - you can let your customers know about their order status change or delivery just shipped. Be notified when new order is received. Or send single or bulk messages to customers from your VirtueMart customer database.