[Kumai Kazuyuki]

【お使いの Snow Monkey のバージョン】v5.4.8
【お使いのブラウザ】Chrome 72.0.3626.121
【当該サイトのURL】(制作中・発表前につき非公開)

---

ヘッダーコンテンツを出力するテンプレート、 template-parts/header/content.php を少し変更したくて、プラグインで snow_monkey_get_template_part_template-parts/header/content を利用して書き換えを試みたところ、ヘッダーコンテンツが重複して出力されます。

具体的には、本来の位置のほかに、 <div class="l-contents" role="document"> の直下にも出力されます。「モバイルでもヘッダーコンテンツを表示」がオンでもオフでも同じでした。

content.php の中身を変えずに、そのまま下記のようにしてみても同様でした。

add_filter(
    'snow_monkey_get_template_part_template-parts/header/content',
    function( $name, $vars ) {

        $header_content = get_theme_mod( 'header-content' );
        if ( ! $header_content ) {
            return;
        }
        ?>
        <div id="js-selective-refresh-header-content">
            <?php echo wp_kses_post( $header_content ); ?>
        </div>
        <?php
    },
    10, 2 
);

♥ 0

いいねをした人: 居ません

[Hatsuki]

横からすみませんー。
このトピックのおかげで、こちらも２重で出ていることに気づけました。。。

相当の横幅じゃないと出ないので、一応SS貼っておきます。
多分、こう言う事かなーと思ったので…（＾＾；
元々のヘッダーコンテンツがメニュー横に表示されている方です。

私も以前にフックを試していて、サイトの説明とかの表示などのカスタマイザーで設定すると、
ヘッダーコンテンツ用テンプレートだけのフックでは予想しない所に表示をする時もあるようです。
ヘッダーのスタイル（オーバーレイ、固定、シンプル）などのカスタマイザーの時で、それぞれ検証が必要そうな気もしています。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

「出力」というのが画面への表示ではなく、HTML としての出力ということを指すのでしたら、それは仕様となります。

PC とモバイルでどうしても HTML の共通化をおこなうことができなかったので、HTML 的には PC 用とモバイル用の2箇所にヘッダーコンテンツを出力し、 .p-header-content--lg 、 .p-header-content--sm という CSS でブラウザの横幅に応じて表示/非表示を切り替えています。

画面上に両方共見えてしまうということであればバグですね…。

倉本さんのスクショをみると両方共でちゃってるようなのですが、設定の組み合わせなど教えてもらってもいいでしょうか…？

♥ 0

いいねをした人: 居ません

[Kumai Kazuyuki]

あ、なるほど、そういうことですか。
いったん元に戻してHTMLソースを見たら、確かにそうなっています。

いきなり snow_monkey_get_template_part_template-parts/header/content フックを使うと、content–lg や content–sm が吹っ飛んでいきなりヘッダーコンテンツが出力されてしまうため、両方見える状態になってしまうのですね。

snow_monkey_get_template_part_template-parts/header/content--lg と、
snow_monkey_get_template_part_template-parts/header/content--sm の 2つのフックを使って変更するようにしたら期待どおりになりました。

お騒がせしました。

♥ 0

いいねをした人: 居ません

[Hatsuki]

倉本さんのスクショをみると両方共でちゃってるようなのですが、設定の組み合わせなど教えてもらってもいいでしょうか…？

念のために共有いたしますね。

ヘッダーレイアウト　＞　シンプル
ヘッダー位置　＞　固定
ヘッダー位置設定をモバイルのみに適用 ＞ オフ(チェックを外す）
ヘッダーコンテンツ　＞　ヘッダーコンテンツと言う文字列をテストで記述
モバイルでもヘッダーコンテンツを表示　＞　オン（チェック）

です。
その形だと、トピックの書いてあるフックの場合は、メニュー下部に２重で出てしまいます。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

あーそうかわかりました。

ヘッダーコンテンツは get_template_part( '.../content', 'lg' ) 、 get_template_part( '.../content', 'sm' ) で呼び出し、それぞれの内部で get_template_part( '.../content' ) が呼び出されるという仕組みなのですが、 snow_monkey_get_template_part_template-parts/header/content だと第2引数関係なく全部書き変わっちゃうので、コールバック関数の中で '' === $name みたいにして分岐させないとダメですね。僕もよくわかってませんでした…。

ということでトピック閉じます！

♥ 0

いいねをした人: 居ません

[投稿者]

投稿