DigiPress

Highly Flexible WordPress Theme

【MAGJAM】関連記事などのサムネイル画像のサイズ(縦幅?)が揃いません

ホーム フォーラム デザイン関連 【MAGJAM】関連記事などのサムネイル画像のサイズ(縦幅?)が揃いません

  • このトピックには5件の返信、2人の参加者があり、最後に恵美子により5年、 10ヶ月前に更新されました。
6件の投稿を表示中 - 1 - 6件目 (全6件中)
  • 投稿者
    投稿
  • #277731
    恵美子
    参加者

    お世話になっております、MAGJAMのテーマを使用させていただいている者です。

    関連記事などに表示されるサムネイル画像の縦幅が、すべて同じサイズの画像(725×500のアイキャッチで統一しています)を使っているのに、一部の画像の縦幅が短く表示されてしまいます。ソースを見てみたら、トリミングされた小さい画像が指定されているみたい?でした。

    検索してみたのですが直し方がわからなかったので、対策をご教授いただけるととても助かります、よろしくお願いいたします。

    【参照URL】
    https://pumpkin-crown.com/main_contents/blue_steel_dragon/setting_02/

    添付ファイル:
    添付ファイルを開くにはログインしてください。
    #277739
    恵美子
    参加者

    すいません、ドメインを移行したのでURLが変わりました。

    【参照URL】
    https://dream-theater-blog.com/main_contents/blue_steel_dragon/setting_02/

    #278256
    DigiPress サポート
    キーマスター

    記事一覧を表示するウィジェットや関連記事などのサムネイル画像は、表示サイズに対して解像度が大きすぎる可能性があるため、軽量化の目的も含め、アップロードされた画像そのものではなく、アップロード時にWordPressによって生成されたサムネイルサイズの画像が利用されます。

    このWordPressによって生成されたサムネイル画像のサイズ設定により、元画像をトリミングしてしまっているために比率が異なっています。

    WordPressのメディア設定にて、生成されるサムネイルのサイズとトリミングの方法を見直してください。

    ●参考
    https://requlog.com/self-branding/wordpress/media-setting/

    変更後のサムネイルサイズを再生成するには、プラグインなどを利用してください。

    Regenerate Thumbnails

    #278316
    恵美子
    参加者

    お忙しいなか丁寧なご返信と詳しい方法を記載してくださりありがとうございます。

    さっそくRegenerate Thumbnailプラグインを利用して試してみました。メディア設定のサイズ(今まで初期状態で使っていました)や「サムネイルを実寸法にトリミングする」のチェックを入れたり外したりして、サムネイルを再生成してみたのですが、同じように表示されました。

    サイズを変えてもRegenerate ThumbnailプラグインのThumbnail Sizesというところに下の表示が出まして、

    dp-widget-thumb: 140×96 pixels (cropped to fit)
    dp-widget-thumb-2x: 280×192 pixels (cropped to fit)
    dp-related-thumb: 250×154 pixels (cropped to fit)
    dp-related-thumb-2x: 500×308 pixels (cropped to fit)
    dp-archive-thumb: 450×320 pixels (proportionally resized to fit inside dimensions)
    dp-archive-thumb-2x: 900×640 pixels (proportionally resized to fit inside dimensions)

    テーマのサムネイルをトリミングする設定がこのサイズなのかなと思いまして、MAGJAMのデモサイトの関連記事のサムネイル表示を見たら自分のブログと同じ表示をされていたので仕様だったみたいです大変申し訳ありません…!

    できれば縦幅ぴったりに表示できたら嬉しいので要望の一つとして見ていただければ嬉しいです、お忙しいなか丁寧なご返信をいただきまして大変ありがとうございました。

    #278320
    DigiPress サポート
    キーマスター

    画像が見切れてもよい前提であれば、CSSで対応する方法としてはオリジナルスタイルシート設定に以下を追記することで対応可能です。

    .widget-post-thumb img{
    height:100%;
    object-fit:cover;
    }
    #278343
    恵美子
    参加者

    ご返信と対応方法を記載していただきましてありがとうございます
    CSSをオリジナルスタイルシートに追記いたしましたら、
    サムネイルが縦幅ぴったりに表示されました!
    丁寧にご教示いただきまして本当にありがとうございます!

6件の投稿を表示中 - 1 - 6件目 (全6件中)
  • このトピックに返信するにはログインが必要です。