Collection image shadow

Hi @ilyeszoltan

Jasmine here from Plak theme support,

In order to have a shadow boxed collection page images (screenshot below), i invite you to follow these steps :

• From your Shopify dashboard, click Online store > Actions > Edit code
• Open the file theme.liquid
• Before the closing tag </head>, add the following code

<style>
.product-card, .product-single__photos {
background: #fff;
padding: 1rem 1rem 1rem 3rem !important;
box-shadow: 0 0.2rem 1.2rem rgba(0, 0, 0, 0.2);
@media only screen and (max-width: 667px) {
padding: 1rem;
}
} 
</style> 

• Click Save

However regarding your second question about adding the discount badge on the product images in the collection page, I invite you to follow these steps.

• Open the file product-card-grid.liquid
• Under this line

<div class=" grid-view-item{% unless product.available %} grid-view-item--sold-out{% endunless %} product-card" data-product-card>

• Put this code

 {% include 'discount-label-product' %}

• Click Save

Notes:  For more advanced styling to meet your business expectation I invite to use our Custom Tasks service

Kind regards,
Jasmine

Hi, 

none of the solutions work as they should.

1 The shadow boxed collection page will look great but there are some differences between desktop and mobile. If the picture and text are in the middle of the box on the desktop then on mobile are slid to the right, if you set it to be in the middle on the mobile then on the desktop are slid to the left. On the homepage, the shadows are cut on the top and on the right, and on the product page, the shadow is cut on the left on mobile.

2. The discount badge from the collection pages is not the same as the discount badge from the product page and it is bigger. 

Hi @ilyeszoltan

Adjusting the features to fit your pages and different devices needs advanced coding and requires accessing your store.

As these features don't exist by default in Plak theme, our support is restricted to basic assistance, if you need those features looking great in your store, I invite you to use our Cutom Task service.

Meanwhile if you have any other questions, feel free to post again

Kind regards,
Jasmine