Tutorials Web Development

How to Create a Lookbook With Shopify?

No ratings yet.

Do you know what is a lookbook? Originally it was a collection of photographs to show off clothing style, model, or whatsoever used in printed magazines. But soon online clothing stores adopted this trick to showcase multiple products as an online lookbook, by adding hotspots to various parts of an image.

It’s an interactive section on your website where you can link various items by tagging separate items.

So when a user hovers these hotspots there appears a tooltip with a link of a product tagged on this photo.

As for me this a really cool feature especially for lazy guys like me who hate shopping, and who can buy the whole look by adding to the cart all items tagged on the photo (in case they are OK.)

Now let’s see how to make a look book functionality using a SuitUp Multipurpose Shopify theme by Zemez.

Here’s a handful of facts about the SuitUp Shopify theme.

This theme contains a bunch of sections which you can add to any of the seven homepage layouts.

There's also an awesome megamenu where you can add as much content as you need.

No matter what you are selling a piece of fabric or a high lifestyle, lookbook would be a great addition to your store. Make your own lookbook to create an emotional connection with your audience, show them how your latest collection will fit them, or how it can enrich their lives.



shopify discount
use code SHOPIFY15OFF

How to Make a Lookbook?

If you open the SuitUp demo you will see that the lookbook is placed on its homepage.

So when you hover any of these plusses you will find additional information about this item including image thumbnail, product name, and price.

Now let’s see how this thing works.

When you open the editor of the theme you will see the Shopify lookbook section in the sections list.

Click it to edit.

There you will see three buttons and three image alignment options. Everything is pretty straightforward:

  1. Change - you can replace an existing image with another one from the gallery.
  2. Edit - you can add alt description to lookbook photographer image.
  3. Remove -  will remove your image.

The thing we’re after here is the Content of the lookbook.

On the template demo there are three products added to the lookbook, let’s add another one.

Click the Add lookbook product button.

The new item will appear on your list of products.

Click it.

As you can see there are just a few things that you need to change in order to add the hotspot to your lookbook section.

Let’s add a sweater, hit the button Select product and type sweater in the search field.

Here are the sweaters that we have.

Select one and push the button Select.

Upon default, the hotspot’s position is the middle of an image, horizontal and vertical positions are 50%. By altering these values you can move the hotspot all around the image.

Now let’s put the dot on the girl’s left shoulder, we need to change those valued to 52% horizontal & 27% ventical, and here’s our dot:

No matter what type of goods you sell the photo lookbook section will be a perfect addition to your store especially if it’s a jewellery store, fashion store, or any other store.


Some Shopify Themes For Your Inspiration

Clothilla - Clothing Store Shopify Theme

This is a specialized theme with a clean and modern design, which is focused on the sale of clothing. With the help of a powerful control panel, you can quickly adjust any element of your site: from the mega menu to footer. Separately, it's worth noting the additions that greatly extend basic Shopify functionality. For a more convenient search of the items, there's an autocomplete function. It supports a countdown timer for selling promotional items. There are ready-made page layouts with categories of goods and pages for the products themselves.

Demo | Download | Hosting


Huge Sale Shopify Theme

Huge Sale is a multipurpose wholesale warehouse Shopify theme, which is most suitable for large online stores with a large and versatile inventory, as its homepage is oriented at displaying categories, rather than individual products. Huge Sale also includes several types of product labels, integrated Facebook and Olark Live Chat widgets, interactive Google Maps, and more. The theme supports multiple languages and currencies USD, GBP, and EUR, and is fully responsive.

Demo | Download | Hosting


Top-Top - Gym Shoes Shopify Theme

Your customers need their perfect pairs of footwear and you need a perfect theme for your new e-commerce website. This theme will help you showcase your fashion vision and get many delighted customers from all over the world. You will start a blog to keep them updated about your latest discounts and promos. The theme offers flawless navigation and checkout experience, so your customers will enjoy every moment they spend on your website.

DemoDownload | Hosting


Preggo - Maternity Shopify Theme

This Shopify theme is a pleasant and elegant eCommerce Shopify theme that fits your maternity fashion shop's style perfectly. This modern, minimal and intuitive design is suitable for online stores selling maternity dresses, maternity and flexible wear, and fashion clothing for pregnant women. The Bootstrap 4 based Preggo Shopify theme is the best maternity ware eCommerce theme for maternity wear and fashion business.

Demo | Download | Hosting


Glassesco - Goggles Shop Shopify Theme

Glassesco Shopify theme is an elegant and fashionable eyewear Shopify theme at a competitive price. This multipurpose Shopify theme is suitable for a stylish online store selling men & women fashion glass, sunglass, goggles, and eyewear. It is built with powerful Shopify Page Builder. Meanwhile, create the most reliable eCommerce store with fully responsive Shopify theme Glassesco.

Demo | Download | Hosting


Read Also

The Best Interior Shopify Templates In 2018

Top 15 Free Shopify Themes

The Best Medical Shopify Templates In 2018

The Best Sports Shopify Themes For Your Store In 2018

Leave a Reply

Your email address will not be published. Required fields are marked *