Create a new Lookbook

In the previous post, you learned about the Nitro Lookbook app. Now, let's create your own lookbook!

1. How to Create a new Lookbook

There are two ways to create a new Lookbook:

1. In app dashboard, click Create new Lookbook button

2. On the Lookbooks list page, click Create new Lookbook button in the top right corner
To Create new Lookbook, you need to follow 4 steps: Choose layout  => Customize => Display => Save & Publish
  • Step1 - Choose layout: 
Select a layout for your lookbook, enter your title and choose display 

    • Step2 - Customize: 
    In this step, we go to add images and manage items for lookbook

      - Add images: Select images from media, products, collections, or your uploaded files. Additionally, you can add images from instagram (please connect). Search or filter to add images faster

      - Manage items: Here you will configure the hotspot and tooltip display on the Lookbook, this is the most important part of our app. Click here to learn how to customize

      • Step3 - Display: 
      Now, let's adjust the layout. All 4 Lookbook layouts have common options such as:
        Show tooltip when: You can set the action to make Tooltip show on your lookbook here
        Column spacing: Set a gap between columns
        Enable click to view image in Lightbox: that allows users to click on an image to view it in an enlarged,  overlay window (Lightbox)
        Column number: Adjust the number of columns on desktop, tablet, mobile

        With slider layout, there will be some additional options:

        - Slider group: a group of sequential images that may be moved back and forth through when click next/previous slider.

        - Type: choose a type for slider

        - Show navigation: show button prev/next

        - Show pagination: show dots on slider

        - Speed (ms): adjust the time interval for the next slide

        - Rewind slider: creates a seamless loop

        - Autoplay: automatically advance through slides at a predefined interval, without requiring user interaction

        • Step 4 - Save & Publish: 
        The first, pay attention to the ID in the right sidebar of this screen. Each lookbook corresponds to an ID, use it to display your lookbook on the livepage
        Notice: Status must be Active for the lookbook to be displayed
        There are two methods to publish Lookbook
        - Method 1: Add app block to your theme
        * Notice:
        + When you clicking [Go to customize theme], the app will copy the ID for you, and you just need to paste it into the Lookbook ID field in the app block to show lookbook
        + Or you can use [Nitro Lookbook ID] metafield for each product, collection, page, post, blog post to show lookbook as you want
        - Method 2: Add embed codes to your page

        2. Lookbooks Manager 

        Go to App -> Lookbooks to view list of all Lookbooks created. Here you can select a lookbook to edit, clone, delete, etc., and you can also search or filter to find it faster