If this tutorial is not what you were looking for, you still have any questions, suggestions or concerns - feel free to let us know. Please help us to serve you better!

Your Name

Your Email

Your Message (required)

captcha

OpenCart 2.x. How to manage “TM Lookbook” module

The following tutorial will show you how to manage TM Lookbook module in OpenCart 2.

The lookbook is a set of photos, where you can mark any part of the image. This module serves for displaying the products of the one or several brands.

The module has two display modes for being displayed in the store position: in a form of a Banner (1) or in a form of a Collection (2).

  1. To manage it, open the Extensions > Extensions > Modules and scroll to TM Lookbook.

    OpenCart_2.x._How_to_manage_TM_Lookbook_module_01

  2. Click on Add new

    OpenCart_2.x._How_to_manage_TM_Lookbook_module_02

  3. Fill in the general info: Module Name, Collection Name, Display Content and Status. For Display Content you will have two options available:

    OpenCart_2.x._How_to_manage_TM_Lookbook_module_03

    1. Banner display mode;

      OpenCart_2.x._How_to_manage_TM_Lookbook_module_04

    2. Collection display mode.

      OpenCart_2.x._How_to_manage_TM_Lookbook_module_05

  4. For the Banner content define the following settings:

    1. Banner Wrapper Class: The class of the banner wrapper;

    2. Banner Image: The image of the banner;

    3. Banner Image Width: The width of the banner image;

    4. Banner Image Height: The height of the banner image;

    5. Banner Description: The description of the banner

    OpenCart_2.x._How_to_manage_TM_Lookbook_module_06

  5. For the Collection lookbook content define the following settings:

    1. Collection Image: The image of the collection;

    2. Collection Image Width: The width of the collection image;

    3. Collection Image Height: The height of the collection image;

    4. Products: Collection products;

    5. Product Image Width: The width of the product images;

    6. Product Image Height: The height of the product images.

    OpenCart_2.x._How_to_manage_TM_Lookbook_module_07

  6. To mark the selected products on the image:

    1. Press the “Add Image Map” button.

      OpenCart_2.x._How_to_manage_TM_Lookbook_module_08

    2. At the bottom, you’ll see a window, which allows creating selection areas and adding products to these areas.

      The areas that you create can be of 3 different forms: square, round, and complex (polygonal).

    3. To create a selection area on the picture, press the button, the name of which corresponds to the necessary form of selection area.

    4. After choosing the form, place it on the picture. Left-click the necessary part of the image, draw the area.

      Note: Polygonal selection should always be closed, make the first and the last point coincide.

    5. Press the “Edit” button.

    6. Double-click the selected area and choose the needed product from the dropdown list.

    7. Press the “Save” button.

    8. After marking all the areas and mapping all the products, press the Save button at the top.

      OpenCart_2.x._How_to_manage_TM_Lookbook_module_09

  7. Save module settings when all is done.

    OpenCart_2.x._How_to_manage_TM_Lookbook_module_10

Do you need more templates? Take a look at our selection of well-crafted OpenCart themes.

Feel free to check the detailed video tutorial below:

OpenCart 2.x. How to manage “TM Lookbook” module

If you need more premium templates to choose from, check out Best OpenCart Themes 2017.