Draft:X-Cart:X-Showroom - Revision history

Dohtur: /* Activating the module */

2015-02-09T10:40:41Z

‎Activating the module

Dohtur: /* Managing interactive banners */

2015-02-09T10:24:17Z

‎Managing interactive banners

Dohtur: /* Managing interactive banners */

2015-02-06T20:25:48Z

‎Managing interactive banners

Dohtur: /* Creating interactive banners */

2015-02-06T20:20:57Z

‎Creating interactive banners

Dohtur: /* Creating interactive banners */

2015-02-06T18:53:15Z

‎Creating interactive banners

Dohtur: /* Overview */

2015-02-06T17:08:40Z

‎Overview

Dohtur at 17:03, 6 February 2015

2015-02-06T17:03:15Z

Dohtur: /* Creating interactive banners */

2015-02-06T16:48:28Z

‎Creating interactive banners

Dohtur: /* Creating interactive banners */

2015-02-06T15:19:57Z

‎Creating interactive banners

Dohtur: /* Creating interactive banners */

2015-02-06T14:57:57Z

‎Creating interactive banners

@@ Line 61: / Line 61: @@
 ==Activating the module==
-If the module X-Showroom is installed, but not active, you can enable (activate) it.
+If the module X-Showroom is installed but not active, you can enable (activate) it.
 To enable the module:

@@ Line 119: / Line 119: @@
 ==Managing interactive banners==
 The list of previously created interactive banners can be found on the Showroom page ('''Content''' -> '''Showroom''').
-[[File:showroom_enable_disable_banner.png|700px|border]]<br />
+:[[File:showroom_banner_list.png|700px|border]]<br />
-[[File:showroom_edit_banner_link.png|700px|border]]<br />
+It is possible to edit banners, disable/re-enable banners and delete banners.<br /><br />
-[[File:showroom_delete_banner.png|700px|border]]<br />
+When you need to change a banner image, re-adjust the hotspots or change the pages on which a certain banner is displayed, you need to edit this banner.<br />

← Older revision		Revision as of 20:25, 6 February 2015
Line 118:		Line 118:

	==Managing interactive banners==		==Managing interactive banners==
−	The list of previously created interactive banners can be found on the Showroom page ('''Content -> '''Showroom''').	+	The list of previously created interactive banners can be found on the Showroom page ('''Content''' -> '''Showroom''').
		+	[[File:showroom_enable_disable_banner.png\|700px\|border]]<br />
		+
		+	[[File:showroom_edit_banner_link.png\|700px\|border]]<br />
		+	[[File:showroom_edit_banner_page.png\|700px\|border]]<br />
		+
		+	[[File:showroom_delete_banner.png\|700px\|border]]<br />

@@ Line 110: / Line 110: @@
 #* '''Home page''': Select the check box for this option if you want the banner to be displayed on the home page of your store:<br />[[File:showroom_banner_homepage.png|700px|border]]<br /><br />
 #* '''Categories with selected products''': Select the check box for this option if you want the banner to be displayed on the pages of categories that are home to the products linked from the banner hotspots.
-#* '''Selected categories''': Select the check box for this option if you want to be able to choose specific categories in which to display the banner. The categories for selection will appear in the "Categories" section below:<br />[[File:showroom_banner_categories.png|700px|border]]<br /><br />To select a category, click on the category name. It is possible to select more than one category by holding down the Ctrl key while selecting categories.<br /><br />If you want the banner to be displayed on the pages of the products linked from the banner hotspots, select the '''Show on product page''' option next to the appropriate hotspot areas on the banner image above:<br />[[File:showroom_show_on_product_page.png|700px|border]]<br /><br />
+#* '''Selected categories''': Select the check box for this option if you want to be able to choose specific categories in which to display the banner. The categories for selection will appear in the "Categories" section below:<br />[[File:showroom_banner_categories.png|700px|border]]<br /><br />To select a category, click on the category name. It is possible to select more than one category by holding down the Ctrl key while selecting categories.<br /><br />If you want the banner to be displayed on the pages of the products linked from the banner hotspots, select the '''Show on product page''' option next to the appropriate hotspot areas on the banner image above:<br />[[File:showroom_show_on_product_page.png|border]]<br /><br />
 # Once you have provided all the necessary information, save the changes by clicking the '''Update''' button at the bottom of the page.
 Now if you go to your store's Storefront area, you should be able to see the banner you have created.

@@ Line 106: / Line 106: @@
 ## Press the left mouse button and drag the mouse in the desired direction to select the desired hotspot area.
 ## To finish the selection, release the mouse button. A dialog window titled "Select a product" will be displayed allowing you to select the product to which you want to add a link:<br />[[File:showroom_select_product.png|700px]]<br /><br />
-## Use the "Select a product" dialog to select the product you require.<br />The left-hand side of the dialog window displays your store's categories. To access the list of products in a category, double click the category name or click the category name once, then click the '''Show products''' button below the category list.<br />The list of products in the selected category appears on the right-hand side of the dialog. To select a product, double click the product name or click the product name once, then click the '''Select''' button below the product list.<br />Once the desired product has been selected, the "Select a product" dialog window will be closed, and a hotspot with a link to the product you have selected will be added to the banner image:<br />[[File:showroom_product_link_added.png|700px]]<br /><br />
+## Use the "Select a product" dialog to select the product you require.<br />The left-hand side of the dialog window displays your store's categories. To access the list of products in a category, double click the category name or click the category name once, then click the '''Show products''' button below the category list.<br />The list of products in the selected category appears on the right-hand side of the dialog. To select a product, double click the product name or click the product name once, then click the '''Select''' button below the product list.<br />Once the desired product has been selected, the "Select a product" dialog window will be closed, and a hotspot with a link to the product you have selected will be added to the banner image:<br />[[File:showroom_product_link_added.png|700px|border]]<br /><br />If necessary, it is possible to move a previously created hotspot over the banner image to adjust its position more precisely. To do so, place the cursor over the hotspot that needs to be moved, press the left mouse button and drag the hotspot to the desired position.<br />It is also possible to remove a hotspot. To do so, click the <u>Delete product tag</u> link for this hotspot.
-# '''Specify the pages of your store on which the banner should be displayed''':
+# '''Specify the store pages on which the banner should be displayed'''.<br />In the lower part of the Add Photo page - below the banner image - you will find the banner display options allowing you to specify where to display the banner you have created:<br />
-# Click '''Update''' to save the changes.
+#* '''Home page''': Select the check box for this option if you want the banner to be displayed on the home page of your store:<br />[[File:showroom_banner_homepage.png|700px|border]]<br /><br />
+#* '''Categories with selected products''': Select the check box for this option if you want the banner to be displayed on the pages of categories that are home to the products linked from the banner hotspots.
-[[File:interactive_banner_home_page.png|700px|border]]
+#* '''Selected categories''': Select the check box for this option if you want to be able to choose specific categories in which to display the banner. The categories for selection will appear in the "Categories" section below:<br />[[File:showroom_banner_categories.png|700px|border]]<br /><br />To select a category, click on the category name. It is possible to select more than one category by holding down the Ctrl key while selecting categories.<br /><br />If you want the banner to be displayed on the pages of the products linked from the banner hotspots, select the '''Show on product page''' option next to the appropriate hotspot areas on the banner image above:<br />[[File:showroom_show_on_product_page.png|700px|border]]<br /><br />
+# Once you have provided all the necessary information, save the changes by clicking the '''Update''' button at the bottom of the page.
 <br /><br />

@@ Line 1: / Line 1: @@
 ==Overview==
-X-Cart's module X-Showroom is an extension that allows you to create interactive banners and publish them in your X-Cart based store. Interactive banners are images marked up with interactive hotspots providing links to specific products in your store's catalog. When a user hovers over a hotspot on a banner image, a tooltip appears over the hotspot with the name of the product to which the hotspot is linked. By clicking on the product name in the tooltip the user can go directly to the product page for more information about the product.
+X-Cart's module X-Showroom is an extension that allows you to create interactive banners and publish them in your X-Cart based store. Interactive banners are images marked up with interactive hotspots providing links to specific products in your store's catalog. When a user hovers over a hotspot on a banner image, a tooltip appears over the hotspot with the name of the product to which the hotspot is linked:<br />
 Interactive banners can be inserted into any page in your store's catalog, including the home page, category pages and pages of specific products. The placement of interactive banners on the storefront is in the upper part of the page below the main site menu. The interactive nature of X-Showroom banners gives an attractive look to your site and promotes greater user engagement.
@@ Line 10: / Line 12: @@
 X-Showroom is available as an installable extension for X-Cart versions 4.6.6 and later.
 <br /><br />
 ==Getting started==
 # Install the X-Showroom module:

@@ Line 100: / Line 100: @@
 ## Click the '''Save''' button below the image preview to complete the upload. The uploaded image will appear on the page where you are creating your interactive banner.
 # '''Add hotspots with links that will point from inside your banner to specific products in your store'''.<br />To add a hotspot:
-## Place the cursor at the desired position near a specific area of the loaded banner image where you want to add a hotspot.
+## Place the cursor over the banner image you have uploaded at the position where you want to add a hotspot.
-## Press the left mouse button and drag the mouse in the desired direction to select this area.
+## Press the left mouse button and drag the mouse in the desired direction to select the desired hotspot area.
-## To finish the selection, release the mouse button. A dialog window titled "Select a product" will be displayed allowing you to select the product to which the module needs to add a link from the hotspot you have just added:<br />[[File:showroom_select_product.png|border]]<br /><br />
+## To finish the selection, release the mouse button. A dialog window titled "Select a product" will be displayed allowing you to select the product to which you want to add a link:<br />[[File:showroom_select_product.png|700px]]<br /><br />
-## then select the product to which the link should point.
+## Use the "Select a product" dialog to select the product you require.<br />The left-hand side of the dialog window displays your store's categories. To access the list of products in a category, double click the category name or click the category name once, then click the '''Show products''' button below the category list.<br />The list of products in the selected category appears on the right-hand side of the dialog. To select a product, double click the product name or click the product name once, then click the '''Select''' button below the product list.
 # '''Specify the pages of your store on which the banner should be displayed''':
 # Click '''Update''' to save the changes.

@@ Line 99: / Line 99: @@
 ## Select the image you require from one of the following sources:<br /><br />'''File on this server''': Use this source if the image file you require is located on the file system of the server on which your X-Cart store is installed. Click '''Browse...''' in the respective section of the image upload manager dialog. A new dialog window displaying the files and folders on your store's server will be displayed:<br />[[File:Showroom_choose_file1.png|border]]<br /><br />Select the image file you require and click '''Select'''.<br /><br />'''File on your local computer''': Use this section if the image file you require is located on the local file system of the computer on which you are currently working. Click '''Browse...''' in the respective section of the image upload manager dialog, select the image file you require and click '''Open'''.<br /><br />'''File on the Internet''': Use this section if the image file you require is located on the Internet. Enter the image URL into the appropriate field.<br />After selecting the file, click the '''Apply''' button opposite the respective section of the dialog.<br /><br />Once you have selected the image and clicked '''Apply''', the image preview will be displayed on the Add Photo page:<br />[[File:banner_image_preview.png|700px|border]]<br /><br />
 ## Click the '''Save''' button below the image preview to complete the upload. The uploaded image will appear on the page where you are creating your interactive banner.
-# '''Add hotspots with links that will point from inside your banner to specific products in your store'''.<br /><br />To add a hotspot:
+# '''Add hotspots with links that will point from inside your banner to specific products in your store'''.<br />To add a hotspot:
-## Mark the area of the banner image that you want to be a "hotspot" linked to some product, then select the product to which the link should point.
+## Place the cursor at the desired position near a specific area of the loaded banner image where you want to add a hotspot.
 # '''Specify the pages of your store on which the banner should be displayed''':
 # Click '''Update''' to save the changes.
@@ Line 109: / Line 112: @@
 <div id="ManagingInteractiveBanners"> </div>
 ==Managing interactive banners==
 The list of previously created interactive banners can be found on the Showroom page ('''Content -> '''Showroom''').