-
検索結果
-
なるほど！ 理解しました。3つの要因があって、全幅にするのはそのうちの1つです。
1つはヒーローヘッダーブロックのそもそもの考え方の部分になるのですが、ヒーローヘッダーブロックは CSS のグリッドレイアウトというものを使っていて、要は描画エリアをグリッドで区切ってそのグリッドにそって画像やコンテンツを配置するという仕組みになっています。セクション（背景画像/動画）ブロックだと、背景画像・動画は本当の意味で背景で、コンテンツが少ないと縮小されるし、コンテンツが多いと拡大されます。でもヒーローヘッダーの背景画像はグリッドにそって配置されるようになっているので、グリッドの指定や画像のアスペクト比も尊重されるようになっています。なのでコンテンツの量によっては背景画像の大きさが不足して今回のような見た目になってしまいます。
2つ目は背景画像のアスペクト比の設定です。デフォルトだと 16/9になっているので、コンテンツ量が多くて16/9に収まらないと今回のような見た目になってしまいます。
とうことで、セクション（背景画像/動画）ブロックの背景画像・動画みたいにコンテンツ量にあわせて拡大縮小される設定があっても良いかもですね。とりえあずは CSS で対応しておいてもらうのが良いかもです。下記は例ですが、全部のヒーローヘッダーに影響がでちゃうので、実運用では適当な CSS クラスを付与してセレクタを調整してください。
.smb-hero-header__figure { position: absolute; inset: 0; aspect-ratio: auto; }Who liked:ブロック間の余白が現れる時の様子です。
https://youtu.be/qIamosYkrooWho liked:
こちら解決しました。ラベルが表示されない原因は
↓
ページ速度最適化→get_template_part() を拡張する
これが無効化されていたことが原因でした。わからず色々やっていたのですが根本的なところが原因でした申し訳ありません。
※キタジマさんがTwitterでもシェアされていました
Who liked:
こんな感じでどうですかね？
add_filter( 'snow_monkey_get_template_part_args', function( $args ) { // 記事一覧カテゴリー以外のテンプレートの場合は無視 if ( 'template-parts/loop/entry-summary/term/term' !== $args['slug'] ) { return $args; } // 投稿以外の場合は無視 if ( 'post' !== $args['name'] ) { return $args; } $new_terms = array(); $terms = get_the_terms( get_the_ID(), 'category' ); foreach ( $terms as $term ) { $term_ids = get_ancestors( $term->term_id, 'category', 'taxonomy' ); krsort( $term_ids ); // チェックしたカテゴリーと先祖のカテゴリー情報をカテゴリーラベルとして使用 foreach ( $term_ids as $term_id ) { $new_terms[ $term_id ] = get_term( $term_id, 'category' ); } $new_terms[ $term->term_id ] = $term; } $args['vars']['_terms'] = $new_terms; return $args; } );Who liked:末端カテゴリーのみにチェックを変える事も可能です。
末端カテゴリーのみにチェックした場合の想定でコードを書いてみました。
add_filter( 'snow_monkey_get_template_part_args', function( $args ) { // 記事一覧カテゴリー以外のテンプレートの場合は無視 if ( 'template-parts/loop/entry-summary/term/term' !== $args['slug'] ) { return $args; } // 投稿以外の場合は無視 if ( 'post' !== $args['name'] ) { return $args; } $terms = get_the_terms( get_the_ID(), 'category' ); if ( $terms ) { // チェックしたカテゴリーを元にその先祖カテゴリーを取得 $term = $terms[0]; $term_ids = get_ancestors( $term->term_id, 'category', 'taxonomy' ); // チェックしたカテゴリーと先祖のカテゴリー情報をカテゴリーラベルとして使用 $new_terms = array(); foreach ( $term_ids as $term_id ) { $new_terms[] = get_term( $term_id, 'category' ); } krsort( $new_terms ); $new_terms[] = $term; $args['vars']['_terms'] = $new_terms; } return $args; } );Who liked:下記のパターンの下の方でコンテンツスライダーを矢印付きで使っているので（表示されていますよね？）
>>頂いたURL先のものは確かに表示されています。
自分のサイトではないので実際にURLが共有できないのですが、以下のような表示になってしまいます。
なお、親ブロックも含めて全幅になっております。
ちなみに、ブラウザの表示を90％にしてみたら、下記のようにズラシで入ったのですが、これは一応ズラシ機能は活きているということになるのでしょうか？相当広いディスプレイじゃないと重なり具合がわからないのかなと思うのですが。
矢印は依然として表示されないので、CSSを見て見ます。
Who liked: No user下記のパターンの下の方でコンテンツスライダーを矢印付きで使っているので（表示されていますよね？）、もし表示されないのであれば中身のコンテンツの
z-indexが影響しているとか、独自に追加されている CSS が影響している可能性があります。「スライダーをずらす」はスライダー自体が全幅か幅広でないとそもそも機能しないのと、ページの端か端までスライドさせる機能であるため、入れこの場合は親ブロックについても全幅状態になっている必要があります。
実際のページを見せてもらえれば、もっと具体的にアドバイスできると思いますので、可能であれば URL を教えてください！
Who liked: No user自動的に、となると GONSY さんが書かれているように JavaScript でリンクを書き換える感じになるかなーと僕も思います。
対象となるページが少なくて、もし僕がやるなら、もう自動化はせずに
/jump/?jumpto=https://hogehoge.comみたいな感じで、中間ページ（/jump/）に直接リンクさせる感じの運用にするかな〜と思います。で、中間ページ用の固定ページでは
?jumptoを受け取って、それをthe_contentフィルターフックとかショートコードとか、なんらかの方法でリンクとしてページに出力させれば良いと思います。Who liked:ちゃんとしたマニュアルが無いからわかりにくいですよね、申し訳ないです…。
「ログイン」部がリンクテキストにならないのですが、これは何かやり方があるのでしょうか。
これはならないのが通常の動作になります。最初期のバージョンでは WordPress 標準のログイン画面へのリンクになっていたのですが、WordPress 標準のログイン画面は表示させたくないというニーズがあったため、リンクはなくし、ログイン用のショートコードを追加しました（このログインショートコードからログインすると標準のログイン画面を介さずにログインできる）。
snow_monkey_member_post_restricted_content_messageフィルターフックを使えばメッセージを独自のものに書き換えられるので、それでリンク付きのメッセージに書き換えることはできると思います。緑背景の「ここから先はメンバー限定コンテンツです」が表示されません。
このメッセージが表示されるのは、下記の条件を満たすときになります。
– 記事が「メンバー限定でこの記事を表示する」になっている。
– 記事中に「続きを読む」ブロック（クラシックエディターの場合は more タグ）が入っている。
– ログインしていない。「続きを読む」ブロックが入っていると、それより前のコンテンツは非ログイン状態でも表示され、それより後のコンテンツはログイン状態でのみ表示されます。この「続きを読む」ブロックの部分に「ここから先はメンバー限定コンテンツです」は表示されます。「続きを読む」ブロックを配置しておらず記事全体が制限されている場合はこのメッセージは表示されません。
Who liked:外部サイトに移動する前にLPなどでよくある「ほかのサイトに移動します」という中間ページを挟んで外部サイトに移動する
実際にこの動きをしているサイトが参考になると思いますが、コードはご覧になりましたか？
SNOWMONKEY テーマで作成したサイト側からそのような動作にする方法があるか
Snow Monkeyに限らず、JavaScriptで実現可能かと思います。
【サイト内】
記事や固定ページ内のaタグを対象として・・・
①クリックした際、外部サイトのURLか判定
②外部サイトの場合、指定したURL（中間ページ）に移動
③サイト内URLの場合はクリックされたURLに移動
【中間ページ】
上記で取得した外部サイトのURLを「移動する」ボタンに適用
※「戻る」ボタンで、もとのページに戻れるように
※このページのみ外部サイトの判定はしない
こんな感じの構造だと思います。
また、中間ページは、固定ページ＋デフォルトのブロックのみで作成できると思います。
では、そのJavaScriptはどんなコードを書けばいいの？となりますが、中間ページ挟んで外部リンクに移動するサイトを見たことがなく、また、わたしに提示するほどの技術もないため、参考にしたサイトのコードやネット検索などで調べていただいたほうが良いと思います。
方法はたくさん出てくると思います。
また、チャット型AIは、具体的な質問をすると、コードそのものも提示してくれるとのことですので、利用してみてはいかがでしょうか。Who liked:
このサイトの問い合わせフォームも Snow Monkey Forms 製ですが、何も入力せずに送信するとどうなりますかね？
僕の環境 Mac + Chrome だと、エラー発生箇所が画面の中ほどに位置する感じで移動され、ナビゲーションには重なりませんでした。
Snow Monkey Forms のエラー発生時のスクロールは、単純にエラー位置にフォーカスさせているだけで、Snow Monkey Forms 側でスクロール処理をおこなっているわけではないのでどうやって調整すれば良いのかは僕もわかりません…。
エラー発生時のフォームには
data-screen="invalid"という属性がつくので、[data-screen="invalid"] { margin-top: 100px !important; }みたいにして強制的に上部に余白をつけてヘッダー分ずらすはできると思います。ただ、それだとスクロールしたときに変に余白があいているのが目立っちゃうと思うので、js でスクロールしたときに良きタイミングでその
margin-topを消す、みたいなことができれば良いかもしれません…。Who liked: No user
