How to: Make an entire tile into a link in Slideshow with Promotions

For click-optimization or for personal preference, this article covers how to augment the functionality of the link coverage on a Slideshow with Promotions tile, which has been set to "card" layout.

1. Access your themes section

Log-in to your Shopify admin, and then click “Online Store” (on the left side of the admin). This takes you to the “themes” area of your Shopify store.

Example themes section

2. Open the Loft theme code

Next, click the button that says “Actions” - followed by “Edit code” which will load the live code editor. It consists of a left hand sidebar, which lists all the files on Loft, along with a right hand code editing panel.

Shopify code editor

3. Open Files

You will be copy/pasting code to two separate files. Complete the following steps.

Open Theme.scss.liquid (Assets folder)

Copy provided CSS to Theme.scss.liquid below (See step 4)

Open Home-Masonry.liquid (Sections folder)

Copy provided HTML to Home-Masonry.liquid below (See step 5)

4. Edit CSS

Scroll all the way to the bottom of Theme.scss.liquid and add in the following code