[キタジマ タカシ]

ありがとうございます！ ちゃんと propertys が入っているみたいなので if ( 'propertys' === $name ) { は通っているのじゃないかと思うのですが…。実際のページの URL を教えてもらうことってできますか？

書き間違えがなければ条件は通過しそうなので、ちゃんと <div class="property-info"> などの HTML は追加されているけど get_field(...) が取得できていないから見た目が変わっていないだけなのが、それとも <div class="property-info"> などの HTML 自体も追加されていないのか確認したいです。

♥ 1

Who liked:

[キタジマ タカシ]

ページをスクロールしていない状態でのサイドバーの位置を大体50pxほど下にずらしたいとも考えています。

padding を使うのが簡単ですかね。

@media (min-width: 707px) {
  .l-sidebar-sticky-widget-area {
    padding-top: 50px;
  }
}

♥ 1

Who liked:

[キタジマ タカシ]

ちょっと実際にどういう値が入ってきているのか確認したいので、コードを下記のように改変して、固定ページでどのような値が表示されるか教えてください！

add_filter(
	'snow_monkey_template_part_render_template-parts/loop/entry-summary/title/title',
	function ( $html, $name ) {
		var_dump( $name );
		var_dump( get_post_type() );
		if ( 'propertys' === $name ) {
		// 〜前後省略〜
	},
	10,
	2
);

♥ 1

Who liked:

[キタジマ タカシ]

原因わかりました！

追尾サイドバーは 1024px 以上のときにだけ固定（position: sticky）になるような CSS を書いているのでした。v19 でサイドバーありのページが2カラムになる条件が変わっているので本来はここも調整する必要があったのですが未調整となってしまっていました。

ひとまず暫定的な処置として、

@media (min-width: 707px) {
    .l-sidebar-sticky-widget-area {
		position: sticky;
		top: 0;
        background-color: red;
	}

    .l-contents {
        overflow: visible;
    }
}

のような CSS を追加すると追尾するようになるのではないかと思います。

♥ 1

Who liked:

[キタジマ タカシ]

template-parts/loop/entry-summary/title/title　はアーカイブページの記事一覧部分でも最近の投稿ブロックの記事一覧部分でも共通して使用されているので、フックはどちらの場合も通っていると思います。

気になるのは if( is_post_type_archive('propertys') ){ のところで、この条件だと「propertys というカスタム投稿アーカイブページのとき」だけしか処理が実行されなくなってしまいます。

add_filter(
	'snow_monkey_template_part_render_template-parts/loop/entry-summary/title/title',
	function ( $html, $name ) {
		if ( 'propertys' === $name ) {
		// 〜前後省略〜
	},
	10,
	2
);

のように書き換えるとどうでしょうか？

♥ 1

Who liked:

[キタジマ タカシ]

ありがとうございます！おそらくですが、見出しがセクションブロック等の中に入る形で配置されていないでしょうか？

目次ブロックはデフォルトでは記事の直下の見出しだけが対象なので、見出しの配置を見直すか、目次ブロックの設定で「セクション内の見出しを表示」にチェックすると目次が表示されるようになるのではないかと思います。

♥ 1

Who liked:

[キタジマ タカシ]

なるほどです。

「スライダー（非推奨）」は slick という JavaScript のライブラリを使用しています。もしかしたらそのライブラリの仕様か問題なのかもしれません。

slick – the last carousel you

slick is a responsive carousel jQuery plugin that supports multiple breakpoints, CSS3 transitions, touch events/swiping & much more!

kenwheeler.github.io

「スライダー」のほうは完全に自作なので、こちらの問題であれば僕の技術レベルの範囲内であれば対応できるのですが、「スライダー（非推奨）」の場合はそういう事情で対応が難しそうです。一応「スライダー（非推奨）」は本来は削除したいけど既に使っている方がいて削除できない（削除してしまうと、その方がアップデートした場合にスライダーが表示されなくなる）ので残しているものなので、できるだけ「スライダー」のほうをお使いいただくか、別のスライダープラグインをお使いいただくのが良いかと思います。

♥ 0

Who liked: No user

[キタジマ タカシ]

ブロックは「非推奨」がついていないほうのスライダーブロックでしょうか？

一応ついていないほうのスライダーブロックで、Android、iOS、両方で矢印をクリックとスワイプを試してみたのですが、しばらくするとまた自動でスライドし始めました。

「タッチ検出でスライダーにタッチする」というのはどういう意味でしょうか？

♥ 0

Who liked: No user

[キタジマ タカシ]

こちらでも再現してみたいので、このページの編集画面でエディターをテキストモードに切り替えて、表示された HTML をここに貼り付けてもらうことはできますか？

♥ 0

Who liked: No user

[キタジマ タカシ]

カスタム投稿アーカイブの一覧部分と全く同じデザインの一覧を、特定の固定ページにも表示させたいということでしょうか？

今どういうコードを書いて、実際どういう見た目になっていて、最終的にどういう見た目にしたいかがわからないので、具体的なコードやデザインの例があるとどういうカスタマイズが可能なのかが提示しやすいかなと思います。

♥ 1

Who liked:

[キタジマ タカシ]

その場合にはセクションブロックなどを使うと思うのですが、この場合の拡縮リセットは可能でしょうか？

セクション（背景画像/動画）ブロックは仕様上難しい気がします。

カバーブロックであれば、下記のような CSS でそれっぽい感じにできそうです（実際にはブロックスタイルや CSS クラスをつくって必要なカバーブロックにだけ適用するのが良いと思います）。

.wp-block-cover {
    padding: 0;
    min-height: 0;
}

.wp-block-cover .wp-block-cover__image-background,
.wp-block-cover video.wp-block-cover__video-background,
.wp-block-cover-image .wp-block-cover__image-background,
.wp-block-cover-image video.wp-block-cover__video-background {
    position: relative;
    height: auto;
}

.wp-block-cover__inner-container {
    position: absolute;
}

セクション（背景画像/動画）ブロックやカバーブロックで背景がトリミングされるようになっているのは、中のコンテンツに応じてブロック自体と背景がきれいに広がるようにするためです。背景が固定サイズだともし中身が多くなったときに背景が途中で途切れてしまったり、背景を優先するなら中のコンテンツが途中で途切れて見えなくなってしまったりします。

実務的には中のコンテンツの量は制作者がコントロールできるので背景が固定サイズというのもできるとは思うのですが、中にどんなコンテンツが入るか想定できない、みんなが使うブロックの場合は、ある程度どういうコンテンツが来てもきれいに見えるようにということを考えると、やはりセクション（背景画像/動画）ブロックやカバーブロックのような実装がベターということになるのかなと思います。

♥ 0

Who liked: No user

[キタジマ タカシ]

画像に文字を入れるというとは、HTML なテキストを画像に重ねるということは不要ということですよね？ それであれば画像ブロックを配置するのが良いと思います。画像ブロックはもともとのアスペクト比のまま表示されるので。基本的には max-width: 100% なので親のサイズに合わせて横幅は縮みますが、height: auto なのでアスペクト比を維持したまま高さも縮むはずです。

♥ 0

Who liked: No user

[キタジマ タカシ]

下記のページは追尾サイドバーを使っていますが、1025px だと1カラムになるので、1025px でも2カラムになるように何らかのカスタマイズをされていますかね？

Snow Monkey でこれまでにおこなった Gutenberg 対応についてまとめてみた

この記事は Snow Monkey アドベントカレンダー 2018 4日目の記事です。 テーマサポー…

snow-monkey.2inc.org

♥ 0

Who liked: No user

[キタジマ タカシ]

ご返信おそくなってすみません！ なるほど、PHP のバージョンですか。確かに僕の普段開発している環境は8.1ではなかったです。アクツさんが共有してくださったエラーメッセージをもとに調べてみます！

♥ 1

Who liked:

[キタジマ タカシ]

もう一点すみません、Query Monitor をほとんど使ったことがないので教えてほしいのですが、「メッセージに Implicit conversion from float 0.9 to int loses precision」というのは具体的にどこに出力されるのでしょうか？

♥ 1

Who liked:

[投稿者]

投稿