<<

Attribute and Images Live Demo

Attribute Tooltip and Images

Installation/User Guide

Support Attribute Tooltip and Images Live Demo

Installation Process: Note: Please take a backup of your all Magento files and database before installing or updating any extension.

Extension Installation:  Download the Attribute Tooltip and Images .ZIP file from the Magento account.  Log in to the Magento server (or switch to) as a user, who has permission to write to the Magento file system.  Create folder structure /app/code/Solwin/attribute-tooltip-image/ to your site root directory  Extract the contents of the .ZIP file to the folder you just created  Navigate to your store root folder in the SSH console of your server:  Run upgrade command as specified : php bin/magento setup:upgrade  Run deploy command as specified : php bin/magento setup:static- content:deploy -f  Clear the cache either from the admin panel or command line php bin/magento cache:clean  Now, you can see the Solwin in the admin panel. Please go to Solwin -> Attribute Tooltip And Image -> Configuration and select Enable to Yes.  Change/Set all other options as per your requirements and save settings.

Overview:

The Attribute Tooltip and Images extension for Magento 2 adds a custom tooltip to the attributes for the Magento website. The tooltip can display as text and/or image. The Attribute Tooltip and Images extension for Magento 2 provides an option to show an image for an individual attribute. Once the store owner enables the “Visible on Product View Page on Front-end” option then the attributes tooltip image displays on the product detail page. The Attribute Tooltip and Images displays on the product filtering option in the filtering blocks, in configurable product options, and the product More Information . The extension provides several options from the admin side for the tooltip like,

Support Attribute Tooltip and Images Live Demo

 Maximum & Minimum width  Position of tooltip  Tooltip layout  Animation effect & speed  Tooltip arrow color  The delay time for tooltip

Key Features: The Extension provides the below features:  Displays on the product detail page in additional information block, for configurable product options, and in filtering block on the category page.  Tooltip position can change in the top, right, bottom, or left, and combinations of all these.  There are 5 theme layouts for the tooltip.  Set Minimum and Maximum width of the tooltip it can fix as per content.  Tooltip displays textual data and images.  The store owner can add the HTML for the tooltip.  “Show Content As HTML” option to display any HTML structure, which interprets the data as HTML.  Different animation effects like fade, grow, slide, fall, swing, etc.  Allows to set speed of the animation.  Tooltip effect can be changed from the admin control panel, i.e., it display on click or hover.  Allows the store admin to set tooltip delay time.  Allows to choose tooltip arrow color.

Support Attribute Tooltip and Images Live Demo

Admin control panel: In the configuration tab, the Attribute tooltip and Images extension for Magento 2 allows store owners to enable or disable the module in the store and provide more configuration options. There are many configuration options in the Configuration tab. Let’s discuss it all in more detail. Go to Solwin >> Attribute Tooltip And Image >> Configuration.

General  Enable Attribute Tooltip: Yes | No.  Tooltip Icon: Add icon for tooltip.  Tooltip Maximum Width: Enter tooltip maximum width.  Tooltip Minimum Width: Enter tooltip minimum width.  Select Tooltip Position: Top | Right | Bottom | Left | Top Left | Top Right | Bottom Left | Bottom Right (Its adjusts as per the content & space).  Select Theme For Tooltip Layout: Punk | Light | Noir | Default | Shadow.  Tooltip Border: Select border color for tooltip theme.

Support Attribute Tooltip and Images Live Demo

Support Attribute Tooltip and Images Live Demo

 Tooltip Text Color: Select Color for tooltip text.  Tooltip Theme Background: Select Color for tooltip theme background.  Show Content As HTML: Yes | No.  Include Animation Effect: Yes | No.  Select Animation Style: Fade | Grow | Swing | Slide | Fall.  Animation Speed: Set animation speed.  Initial Delay: Set speed for tooltip initial delay.  Select Tooltip Effect: On Click | On Hover.  Display Tooltip Arrow?: Yes | No.  Tooltip Arrow Color: Select the tooltip arrow color.

How To Configure In the admin control panel, the administrator can manage attribute tooltip image and description. 1. Go to STORES >> Attributes >> Product. 2. Select Particular Attribute. 3. In the Storefront Properties section, upload attribute image and set attribute tooltip content, and save attribute. View the below screenshot for more details.

Support Attribute Tooltip and Images Live Demo

Customer View:

On the frontend, customers can view the tooltip on the product list page, product view page, and in the additional information tab.

1. On Product List Page. The below screenshot shows the attribute tooltip (top position) in the on the product list page.

Support Attribute Tooltip and Images Live Demo

2. On Product View Page – with Configurable Product. The below screenshot shows the attribute tooltip (top position) on the product view page.

Support Attribute Tooltip and Images Live Demo

3. On Product View Page - Additional Information Tab.

The below screenshot shows the attribute tooltip (top position) on the product view page additional information tab.

Support Attribute Tooltip and Images Live Demo

Documentation: Online Documentation

Support: Do not hesitate to reach us in any case regarding the extension. Our team is ready to help you. Visit our support portal and create a ticket. support.solwininfotech.com

Support