There are varies ways to layer commerce functionality onto your Zmag. Product links pull information from your online database and present it in to a product window.
What are product links?
Zmags Enriched makes it easy to add and update product links in your publication, enabling customers to make transactions without ever leaving the page. Product links pull product information from your database and present it in a pre-designed dynamic product window. Your end user may then add the product directly to their shopping cart and continue reading.
In the page shown below, the three "Buy Now" graphics have been overlaid with invisible box product links.
When one of these buttons is clicked, the corresponding window is shown.
How to Create a Basic Product Link
1) Log into the Zmags Publicator and click on "All Publications".
2) To the right of the publication you'd like to add links to, click the little icon in the 'Enrichments' column.
3) Wait for Zmags Enriched to load. Using the page-select menu on the right side, navigate to the first page you would like to link.
4) Click the link icon on the left side and choose "Product Link". Use the mouse cursor to draw a link box on the page.
5) This will open the product link dialog box, which has the following properties:
Product Source: Choose whether to use the product database or manually enter product details. The product database is available exclusively for Zmags CommercePro accounts. Manual product links provide a variety of options; entering a product ID will launch existing "quick views" when the Publication is embedded into a webpage or if using Demandware. To launch a light box instead, manual product links are best used with the base URL functionality.
Product Name: The name of the item or product.
Product Description: A description of the item or product.
Product ID: The serial number of the Item or product. When using the product database or a base URL, this will be the only product information you must manually enter. After that, click 'search' to fill in all other fields automatically.
Product Price: A price for the Item or product.
Width, Height: The width and height of the link box on the page, in pixels.
Top, Left: The position of the link box on the page, in pixels.
Tooltip type: Determines whether the tooltip for the specific link is plain text or rich media. Mouseover tooltips are available in the Flash viewer only, and will not appear in the HTML5 viewer:
- Text: If the text option is selected, the desired tooltip text must be entered in the Tooltip text field.
- Media: If the media tooltip type is selected, a media resource must be selected from the "Media Source" dropdown.
Note: Media Source includes all images, flash files, and movies that have been added to your account. Media tooltips are shown in a tooltip window with a fixed size.
Rollover effect: Determines what happens when the reader hovers over the link. The default effect is 'none', meaning the effect is disabled. Available effects are:
- Fade InOut: sets transparency to 0%, increases it to 100% and decreases it again.
- Pulsating: repeatedly cycles the transparency
- Frame: magnifies the linked area while highlighting it with a frame.
- Shadow Frame: Like frame, but includes a shadow visual effect.
External source: Allows you to use or overlay flash or images from the media library in the link area you have defined. The default value is None, which will make the link behave as a normal link.
Transparency: Determines how transparent the link should be. Set to 0% for completely invisible links.
6) After creating the link(s) choose File > Save All from the top menu. You may then close / exit Zmags Enriched.