Make Gif Size smaller

Make Gif Size smaller

sixdreamz
Explorer
103 0 36

hey,

 

if you go on my website, pieces, click on the black shirt with a white print on it and scroll down, youre gonna see a gif of someone turning in a circle, i want to make that gif smaller, can you help me?

 

url: sixdreamz.com

 

sixdreamz_0-1726962814092.png

 

Replies 3 (3)

BSSCommerce-B2B
Shopify Partner
1718 512 574

Hi my friend @sixdreamz , 

I have reviewed your requirement, you just need to edit css script and the issue will be resolved.  You can follow my instructions! 

Step 1: Go to Admin -> Online store -> Theme > Edit code:

BSSCommerceB2B_0-1726967077163.png

Step 2: Search for the file base.css. And add this code snippet to the end of the file.

 

.product__media-list.contains-media.grid.grid--peek.list-unstyled.slider.slider--mobile li:nth-child(2) .product__media.media.media--transparent img {
    height: 400px !important;
}

 

In this step, you can change the height smaller or bigger as you want.

In my example, I choose 400px

Step 3: Save and reload home page.

=>> The result: 

BSSCommerceB2B_2-1726967134986.png

 

I hope these instructions will help you. If they are helpful, please give us likes and mark as the solution.

Have a nice day sir! 

B2B Wholesale Solution: Streamline your B2B operation with advanced features like wholesale registration forms, custom pricing.


B2B Portal, Quote, Net 30: Speed up purchasing and streamline your quotation process with advanced features like quick order, request for quote.


B2B Lock Password Protect: Easily control access to pages, products, and pricing with robust features.


BSS Commerce - Full-service eCommerce Agency I Use Shopify for 1$ in the first month now

BSS-TekLabs
Shopify Partner
2325 690 813

- Here is the solution for you @sixdreamz 
- Please follow these steps:
1. Go to Online Store --> Theme --> Edit code.
2. Open your theme.liquid file
3. In theme.liquid, paste the below code before </head> and press 'Save' to save it

<style>
.product__media-list .product__media-item:nth-of-type(2) img.image-magnify-none {
    max-height: 400px !important;
}
</style>

- Here is the result you will achieve:

BSSTekLabs_0-1726975382030.png

 

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.


Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)


Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page


BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

PageFly-Richard
Shopify Partner
4661 1068 1725

This is Richard from PageFly - Shopify Page Builder App

 

Hi @sixdreamz  Please add code here to fix it:

Step 1: Online Stores > Themes > Edit code

Step 2: Choose file theme.liquid
Step 3: Add code above the tag </body>

 

<style>
  .product__media-list.contains-media.grid.grid--peek.list-unstyled.slider.slider--mobile li:nth-child(2) .product__media img{
    height: 250px !important;
}

</style>

 

Hope my solution will help you resolve the issue.

 

Best regards,

Richard | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


➜ Optimize your Shopify store with PageFly Page Builder (Free plan available) 


All features are available from Free plan. Live Chat Support is available 24/7.