Product Tile

Product tile variations

Basic tile

See the Pen Product tile by Reach (@reach_commerce) on CodePen.

– Minimalistic layout for products that represent their benefits efficiently with just an image and a title.

Click opens dialog with product details

– Click anywhere but “buy button” opens a modal dialog with product’s details
– Click on “but button” adds product to a cart

Long title gets shortened

– Maximum lines number can be set to 1, 2 or 3, by adding a class reach-product-tile__info-container–line-clamp-x (where x is the number) as in the example above.

Product tile without any modifications

It’s the most basic layout of the product tile. It represent all the content that can be easily added or removed from the tile. 

your next steps

Need assistance?

Send us an email to publishers@usereach.se to get in touch with us today.