FROM CACHE - jp_header
このコミュニティはピアツーピアサポートに移行しました。Shopify サポートは今後、このコミュニティへのサービスを提供いたしません。これからもぜひ、他のマーチャントやパートナーとつながり、サポートし合い、経験を共有してください。 当社の行動規範に違反する行動や削除を希望するコンテンツがありましたら、引き続きご報告ください

dawnでブログ記事のサムネイルのサイズを画像比にする方法

dawnでブログ記事のサムネイルのサイズを画像比にする方法

makoto4
訪問者
1 0 0

テーマdawnでメインページのブログ記事の

サムネイル画像のサイズを画像比、またはheight100%にする方法はありますか??

1件の返信1

nakano_thesense
Shopify Partner
30 7 9

こちらですが、メインページのブログ記事というのは「ブログ記事」セクションで認識あっておりますでしょうか?

こちらであれば少しコードの編集は必要になりますが、以下の方法で編集可能かと思われますので参考にしていただけますと幸いです。

 

ブログ記事セクションはDawnの場合ですと`featued-blog.liquid`ファイルに該当しますのでこちらのファイルをコード編集から開き以下の変更を行ってみてください。

 

71行目から記載されている 'article-card'を以下に変更してください。

変更前に記載されている 1.66 という数値がデフォルトで設定されているサムネイル画像のアスペクト比になります。そちらの値を `article.image.aspect_ratio`と変更することで記事のサムネイルに設定されているアスペクト比に変更可能になります。

 

// 変更前
{% render 'article-card',
  blog: section.settings.blog,
  article: article,
  media_aspect_ratio: 1.66,
  show_image: section.settings.show_image,
  show_date: section.settings.show_date,
  show_author: section.settings.show_author,
  show_excerpt: true
%}

// 変更後
{% render 'article-card',
  blog: section.settings.blog,
  article: article,
  media_aspect_ratio: article.image.aspect_ratio,
  show_image: section.settings.show_image,
  show_date: section.settings.show_date,
  show_author: section.settings.show_author,
  show_excerpt: true
%}

 

アスペクト比の変更に合わせて他の箇所のデザイン崩れ等が起こる可能性がありますので、その際は適宜CSS等の変更を行なっていただければと思います。

参考にしていただけますと幸いです。

株式会社thesenseはアパレルの輸入代行サービスやクーポン保有アプリなど様々なEC運営サービスの提供、自社ブランドの運営を行っている会社です。
わたしたちについて: https://biz.thesense.tokyo