Discordコミュニティを作りました! 参加する

フォーラム

トピックを立てる前にチェック
  1. フォーラムガイドライン」に必ず目を通してください。
  2. バージョンアップデート後に表示がおかしくなった場合は、
    「SWELL設定」>「リセット」からキャッシュクリアを先にお試しください。
  3. フォーラム内検索で過去に同じようなトピックがないか検索してみてください。
サムネイル画像の比率を縦長にしたい
 
通知
すべてクリア

[解決済] サムネイル画像の比率を縦長にしたい

5 投稿
3 ユーザー
3 Likes
1,188 表示
miyazaki2021
(@miyazaki2021)
投稿: 2
メンバー
Topic starter
 

映画のポスターを表示したいので、記事一覧のサムネイル画像の比率設定を縦長(1:0.7)にする方法を教えていただきたい。

確認項目
利用規約に同意します*, ガイドラインを読み、内容を把握しています*, よくある質問を先にチェック済みです*, 過去に同じようなトピックがないか検索済みです*, WordPress更新後、SWELLは最新版にしましたか?, Googleなどでも検索してみました, プラグインを停止しても同じことが起こることを確認しました, デフォルトテーマ等、他のテーマでも同じことが起こることを確認しました, 自分で追加したコードに問題がないかチェック済みです, サポート範囲外だということを理解しているが助けが欲しい(有料サポートしてくれる方を探したい)
問題が確認できるページのURL
利用中のSWELL本体のバージョン
2.6.5
利用中のPHPバージョン
7.4.30
OS
MacOS 12.5.1
利用中のWordPressバージョン
6.0.1
利用中のサーバー会社
さくらインターネット
ブラウザ
Safari
利用中のプラグイン一覧

プラグインは利用していません

 
投稿済 : 26/08/2022 1:52 pm
Rockn Crawlers
(@rockn-crawlers)
投稿: 21
メンバー
 

カスタマイズ→追加CSS に

 .c-postThumb__figure {
    aspect-ratio: 0.7 / 1;
}

 

 

を追加することで、私の環境では縦長のレイアウトになりました。
試して見て下さい♩

 

 

 
投稿済 : 26/08/2022 10:08 pm
miyazaki2021
(@miyazaki2021)
投稿: 2
メンバー
Topic starter
 

ありがとうございます!!

縦長のレイアウトになりました!!

早急なご対応、感謝です。

 
投稿済 : 27/08/2022 9:05 am
了
 
(@loos_ryo)
投稿: 1248
メンバー Admin
 

@rockn-crawlers

コード共有ありがとうございます!

 

ただ、aspect-ratioはSafariの比較的新しいバージョンでしかサポートされていないため、以下のようにしていただく方が今の所は無難かと思います。

.c-postThumb__figure {
    --card_posts_thumb_ratio: 120%;
}

※「--card」の部分は、レイアウトタイプによって名前が変わります

 

 

SWELL開発者です。

 
投稿済 : 28/08/2022 11:04 am
Rockn Crawlers
(@rockn-crawlers)
投稿: 21
メンバー
 

@loos_ryo さま

 

貴重な情報をありがとうございます。
試して見ます!

 

 
投稿済 : 31/08/2022 12:35 pm
共有: