またまた修正を入れてみました。iPhone のシミュレーターで開発用ページを見ながら修正した限りでは直っていそうなのですがどうでしょうか…。
その再現の場合、ボタン要素を消した上で flex-direction: column も定義をさせない場合、横幅が狭くなるかと
その挙動は display: flex の仕様通りなので、Blocks 側でよしなに対応するよりユーザー側で flex-direction: column や flex プロパティで都度対応するのが一般的だと思います。
その再現の場合、ボタン要素を消した上で flex-direction: column も定義をさせない場合、横幅が狭くなるかと（これは、かなり極端な条件だとも思いますが…）
その場合であっても、アコーディオン要素に width: 100%; を加えてやれば、正しく横幅いっぱいになると思います。
親要素の CSS が影響して、ということであれば個別に対応するしかないのではないですかね？
アコーディオンの場合、個別に対応する方が良いのかは悩んでます。
個別にスタイルをガチガチに弄ることでチェックボックスとtitle部分やbodyの部分のズレも生じるので、可能な限りは 基礎で fix した方が良いのかなーと思ってます。
アコーディオンでもないような閲覧者が操作しない要素系はその部分部分を個別で対応しても良いと思いますが…。
一応確認です
add_filter( 'body_class', 'add_page_slug_class_name' );
function add_page_slug_class_name( $classes ) {
if ( is_page() ) {
$page = get_post( get_the_ID() );
$classes[] = 'my-page-' . $page->post_name;
}
return $classes;
}
こういうことでよいでしょうか よければ閉じますね。
@キタジマさん
いつもお世話になっております。
反応が遅くなりまして大変失礼しました。
さて、いただいた zip のファイルをアップロードして試したところ、
長谷川さんがおっしゃっているように、最後のサムネイルをタップしてみると
やはり前回同様の挙動のままですね。。
お忙しいところ恐れ入りますが、
お時間のある時に確認していただけましたら幸いです。
よろしくお願いします。
このサイトのトップページの「よくあるご質問」でアコーディオンを使っていて、
.c-container.u-slim-width > .smb-section__body > .smb-accordion
という入れ子になっているので、これを
.c-container > .smb-section__body > .smb-accordion
として幅を広く、そして
.smb-section__body に style 属性で display: flex; flex-direction: column を追加してみたのですが、特にアコーディオンの幅が狭くなるということはありませんでした。
イマイチどういう状況のことを指しているのかがわからないので、実際のページか具体的な再現方法をいただけないと適切な回答をするのが難しいと思います…。親要素の CSS が影響して、ということであれば個別に対応するしかないのではないですかね？
アクツさんが書かれている通りだと思います。
関さんのサイトを見てみました。一覧は
のようなので、2ページ目だと下記の URL になりますかね。
関さん、ご返答ありがとうございます。
※こちらは不具合ではなくて（ウィジェットではなく張りたかったURLにブラウザから直接アクセスしてもうまく飛ばないので）、設定が足りてないのが原因かと思います
すでに、投稿ページは設置されてますでしょうか？？（投稿のアーカイブページ）
その場合は、素直にそのページのURLを設定すれば大丈夫かと思います。
もしまだの場合は、カスタマイズ > ホームページ設定 > 投稿ページの部分で新規追加でページを作って、そのURLを設定すると良いかと思います。
ここまでで、多分とりあえず一覧ページが表示されるかと思います。
あとは、１ページに表示する投稿数を設定で調整したり、当初試されてたpaged=2 などを活用すれば、やりたいことは実現できるかと思います
アクツさん、ありがとうございます！
やってみたいのは、固定ページ（または記事）ではなく、「最新の投稿の続きを一覧で表示する」という形です。
ブログトップでは、最新の投稿は12件表示される設定にしていて、その後の「続きを見に行く」ボタンを押すと、最新の一覧の表示（カテゴリなど関係なく）がズラッと出るというイメージです。
カテゴリの一覧とかだとこのように出せるのを、カテゴリ関係なく表示出来るようにしたいという感じです。
このようなイメージです。
https://www.neppie.com/blog/?cat=442
例では「Apple」カテゴリの一覧のみが表示されていますが、これをカテゴリ関係なくしていきたい感じです。参考にしたパーマリンク設定の説明にも入ってなかったので、つまずいてます。
関さんこんにちは！
私の環境でテストしてみた所、とくにパーマリンクが基本でも全然支障無く動きました
リンクをつけたいのは、固定ページ（または記事）とかでしょうか？？
もしその場合ですと、「paged=xxx」ではなく「page_id=xxx」でうまくいくと思います（＾＾
※paged=xxx は、表示しているページが複数ページ存在する場合（投稿アーカイブなど）の何ページ目かを指定するパラメーターになります。
ブロック組むなりしないと駄目なので再現コードは結構大変と思います。
軽くやるなら、ボックスか何らかの子ブロック(インナーブロック)にアコーディオンを入れて、親ブロックで
親ブロック > div {
display: flex;
}
なりで、子ブロックのdivの詳細度を上げさせるようなスタイリングをしたらなるかと。
(親要素は横幅いっぱいだが、flexなどの詳細参照により、アコーディオンの横幅がデフォルトの幅でブラウザにレンダリングされるはず)
Chromeだと再現されずSafariだとなるとかもあるのでChromeで再現されなければSafariで見てください。
Oleinさん
アクツさん
ご指摘、ありがとございました！
以前はここまでハッキリと罫線が出なかったので、ちょっと気になってしまい、お問合せさせて頂いた次第です。
キタジマさんのおっしゃる通り、一度保存したら枠線の表示が消えて、イメージ通りになりました。
皆様、ありがとうございました！
トピック閉じます。
Olein さん
いつも丁寧に教えていただいてありがとうございます！
アドバイス頂いた通り、WordPressで使えるプラグインを探してみます！
トピック閉じます。
こちらはプラグインといえばプラグインなのですが、WordPressのプラグインではないですね。
こちらを指されているという前提でお話をしますと、こちらSwiper本体を利用してSnow Monkey内に実装しようとするならば、カスタムHTMLブロック内でゴニョゴニョとコードを書くしかないかなと思います。
ただ、上記カスタムHTMLブロックだけでは推奨する形でCSSやJavaScriptを読み込むことができなくなるので、結果的にあまりお勧めしたい方法ではなくなってしまいます。
また、コードを書かれず実現したいという場合には、プラグインを活用する方法がベターだと思いますので、ウェブ検索などで「wordpress slider draggable plugin」といった形で検索をしてみて、色々なプラグインを片っ端から試してみることもお勧めします。
もうちょっと良いアイデアをお持ちの方がみえるかもしれませんが、いただきました情報から考えるとこのようなお返事になるかと思います。
よろしければ参考になさってください。
失礼しました。
こちらです。
恥ずかしながら、ショートコードで出力できるほどまだ実力がありません。
