人気記事ウィジェットをスマホでは2列表示にしたい - 要望 https://wp-cocoon.com/community/demands/%e4%ba%ba%e6%b0%97%e8%a8%98%e4%ba%8b%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e3%82%b9%e3%83%9e%e3%83%9b%e3%81%a7%e3%81%af2%e5%88%97%e8%a1%a8%e7%a4%ba%e3%81%ab%e3%81%97%e3%81%9f/ Cocoon ディスカッション掲示板 ja Sun, 08 Mar 2026 18:23:28 +0000 wpForo 60 RE: 人気記事ウィジェットをスマホでは2列表示にしたい https://wp-cocoon.com/community/demands/%e4%ba%ba%e6%b0%97%e8%a8%98%e4%ba%8b%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e3%82%b9%e3%83%9e%e3%83%9b%e3%81%a7%e3%81%af2%e5%88%97%e8%a1%a8%e7%a4%ba%e3%81%ab%e3%81%97%e3%81%9f/#post-74892 Tue, 24 Oct 2023 05:10:43 +0000 試してみたところ、即理想の形になりました！私のようなド素人に、ご親切に本当にありがとうござました。

]]> 要望 dakurk82 https://wp-cocoon.com/community/demands/%e4%ba%ba%e6%b0%97%e8%a8%98%e4%ba%8b%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e3%82%b9%e3%83%9e%e3%83%9b%e3%81%a7%e3%81%af2%e5%88%97%e8%a1%a8%e7%a4%ba%e3%81%ab%e3%81%97%e3%81%9f/#post-74892 RE: 人気記事ウィジェットをスマホでは2列表示にしたい https://wp-cocoon.com/community/demands/%e4%ba%ba%e6%b0%97%e8%a8%98%e4%ba%8b%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e3%82%b9%e3%83%9e%e3%83%9b%e3%81%a7%e3%81%af2%e5%88%97%e8%a1%a8%e7%a4%ba%e3%81%ab%e3%81%97%e3%81%9f/#post-74882 Tue, 24 Oct 2023 03:58:08 +0000 例えば、 人気記事ウィジェットの設定で「表示タイプ」を「大きなサムネイル」にするのが 1 つの案です。

]]> 要望 Akira https://wp-cocoon.com/community/demands/%e4%ba%ba%e6%b0%97%e8%a8%98%e4%ba%8b%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e3%82%b9%e3%83%9e%e3%83%9b%e3%81%a7%e3%81%af2%e5%88%97%e8%a1%a8%e7%a4%ba%e3%81%ab%e3%81%97%e3%81%9f/#post-74882 RE: 人気記事ウィジェットをスマホでは2列表示にしたい https://wp-cocoon.com/community/demands/%e4%ba%ba%e6%b0%97%e8%a8%98%e4%ba%8b%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e3%82%b9%e3%83%9e%e3%83%9b%e3%81%a7%e3%81%af2%e5%88%97%e8%a1%a8%e7%a4%ba%e3%81%ab%e3%81%97%e3%81%9f/#post-74880 Tue, 24 Oct 2023 03:49:37 +0000 子テーマが使われていないように見えます。もし、子テーマをお使いでないのなら、まずは子テーマをダウンロードし有効化します。

子テーマのダウンロード

そして、子テーマの style.css に以下の CSS を書けば、PC では横 5 列、タブレットやスマホでは横 2 列になります。

.home .popular-entry-cards {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

@media screen and (max-width: 834px) {
  .home .popular-entry-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

ただし、このままでは記事タイトルを表示する部分が狭いです。サムネイルと記事タイトルをどのように表示するかを決めないといけません。

]]> 要望 Akira https://wp-cocoon.com/community/demands/%e4%ba%ba%e6%b0%97%e8%a8%98%e4%ba%8b%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e3%82%b9%e3%83%9e%e3%83%9b%e3%81%a7%e3%81%af2%e5%88%97%e8%a1%a8%e7%a4%ba%e3%81%ab%e3%81%97%e3%81%9f/#post-74880 人気記事ウィジェットをスマホでは2列表示にしたい https://wp-cocoon.com/community/demands/%e4%ba%ba%e6%b0%97%e8%a8%98%e4%ba%8b%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e3%82%b9%e3%83%9e%e3%83%9b%e3%81%a7%e3%81%af2%e5%88%97%e8%a1%a8%e7%a4%ba%e3%81%ab%e3%81%97%e3%81%9f/#post-74872 Mon, 23 Oct 2023 19:51:09 +0000 お世話になっております。当方ド素人です。

人気記事ウィジェットで表示される記事一覧を、pcでは横5列、スマホでは横2列ずつ表示したいと思っております。当方ど素人なもので何も分からずご迷惑おかけしますが、そのように表示させる方法をお教えくださいますと大変助かります。どうかよろしくお願い致します。

当方のサイトhttps://beautifuljapanesewomen.com/

]]> 要望 dakurk82 https://wp-cocoon.com/community/demands/%e4%ba%ba%e6%b0%97%e8%a8%98%e4%ba%8b%e3%82%a6%e3%82%a3%e3%82%b8%e3%82%a7%e3%83%83%e3%83%88%e3%82%92%e3%82%b9%e3%83%9e%e3%83%9b%e3%81%a7%e3%81%af2%e5%88%97%e8%a1%a8%e7%a4%ba%e3%81%ab%e3%81%97%e3%81%9f/#post-74872