[Share] Blog page custom aspect ratio

These CSS code will help you change aspect ratio on specific blog page, specific blog post...

#1. Specific Blog Page

First, find Blog Page ID.

In my example, it is: #collection-6677756d03a4f15ba27ce9d8

Next, use this CSS code

#collection-6677756d03a4f15ba27ce9d8 article.blog-item .image-wrapper {
    padding-bottom: 75% !important;
}

#2. Specific Blog Page (Desktop Only)
If you want the code affects Desktop Only, you can use this CSS code

@media screen and (min-width:768px) {
  #collection-6677756d03a4f15ba27ce9d8 article.blog-item .image-wrapper {
      padding-bottom: 75% !important;
  } 
}

#3. Specific Blog Page (Mobile Only)
If you want the code affects Mobile only, use this CSS code

@media screen and (max-width:767px) {
  #collection-6677756d03a4f15ba27ce9d8 article.blog-item .image-wrapper {
      padding-bottom: 75% !important;
  } 
}

#4. Specific Blog Item
First, you need to find blog item url.
In my example, it is: /blog-2-1/the-mountai-bike

Next, use this CSS code

article.blog-item .image-wrapper[href="/blog-2-1/the-mountai-bike"] {
    padding-bottom: 120% !important;
}