- このトピックには9件の返信、2人の参加者があり、最後に
により2年、 8ヶ月前に更新されました。
-
投稿
-
【お使いの Snow Monkey のバージョン】バージョン: 15.0.1
【お使いの Snow Monkey Blocks のバージョン】バージョン 12.0.1
【お使いの Snow Monkey Editor のバージョン】バージョン 6.0.0
【お使いのブラウザ】Chrome
【当該サイトのURL】### 実現したいこと
記事ページのh1タイトルを別の場所に表示させる・またはh1を置き換えるようなことは可能でしょうか。### 発生している問題
記事ページのデザインをカスタマイズしているため、ページトップに表示されている”c-entry__title h１”タイトルをデザインした別の場所に表示させタイト思っているのですが。
ページトップの”c-entry__title h１”をdisplay:none;にて非表示にしたとしても、SEO的には同ページ内に
h１タグが２回出てくることになり良くないのではないかと思いますので、表示場所を変えたり置き換えるような記述ができたらご教授頂きたいです。
### 試したこと
ページトップ記事タイトルを非表示でデザイン上は再現できるが、h１がページ内に２回出るので良くない。
.type-page .c-entry__header {
display: none;}こちらの記事を参考にmy snow monkeyにて置き換える記述をしてみたのですが上手くいきませんでした。
https://whitewood-hp.com/web-tips/archives/2969いいねをした人: 居ません添付画像にタイトルが２箇所に用意されていることは分かるのですが、最終的にどのようにされたいのでしょうか？
それが具体的に共有いただけないと、CSSでなんとかなるのか、フックでなんとかなるのか、なんともならないのかなど、判断が難しいですねぇ。
いいねをした人: 居ません＠Olein_jpさま
貴重なお時間を割いて頂いているのに、情報不足で大変失礼をいたしました。
最終的には、添付画像のようにページトップのh1タイトルをなくして（cssにて非表示ですとh1が２箇所になったままになるので）
ブロックでデザインしている箇所にh1タイトルを表示させたいです。よろしくお願い致します。
いいねをした人: 居ませんもっとスマートな方法があるかもしれませんが、最終的にどんなDOM構造にされたいのかなど詳細はわかりかねるので、以下の流れで実現できそうだなと感じます。（未検証）
snow_monkey_template_part_render_template-parts/content/entry/header/headerへのフィルターフックで<header class="c-entry__header">〜</header>を出力させないようにする- （構造がわからないので的確かどうかわかりませんが）
the_contentの冒頭にタイトルを出力させるようフックで処理
これで、
ページトップのh1タイトルをなくして（cssにて非表示ですとh1が２箇所になったままになるので）
ブロックでデザインしている箇所にh1タイトルを表示させたいという要件はクリアできそうな気がします。ご確認ください。
いいねをした人:最終的なHTML構造にも寄るので正解かどうかわかりませんが、上記1のところは
str_replaceでheaderタグ全体を指定して空にすることでできると思います。また、2に関しては単純に任意の固定ページ向けに分岐を書いてから、
the_contentにフックでthe_titleをお好きなマークアップで頭に挿入したら実現できると思います。（未検証）どなたかより良い方法があれば教えて下さい！
いいねをした人: 居ませんHTML構造のどの部分にどう入れたいのかがわからないので、これが正しいのか判断できませんが、ページヘッダー部分（ページタイトルなどを出力している部分）をDOM構造ごと非表示にするには、このようなコードで実現できると思います。条件分岐は必要に応じて書き換えてください。
add_filter( 'snow_monkey_template_part_render_template-parts/content/entry/header/header', function ( $html ) { if ( is_page() ) { return; } return $html; } );単純に固定ページで出力させていないだけです。
そして、任意の場所に独自のタイトルを出力する場合ですが、例えば
the_contentの最上位に挿入したい場合（これだと上記を消す意味がないのであれですが）、add_filter( 'the_content', function ( $content ) { if ( is_page() ) { $page_title = '<h1 class="original-page-title">' . get_the_title() . '</h1>'; $content = $page_title . $content; return $content; } return $content; } );こんな感じでできると思います。一応動作は検証してあります。
デザインの都合上、ページタイトル部分の出力位置を変えたいということだと思うのですが、DOM構造的にどの部分を削除して、どのようなDOMを具体的に入れたいのかを明確に書かれた方がストレートな返答をしやすいので、問題解決には近道になると思います。
あと、開発段階とは言え現状が見られる共有URLを用意されると、よりスピーディーかと思います。
ご確認ください。
いいねをした人: 居ません＠Olein_jpさま
お世話になっております、何度も解説をいただき有り難うございます。
頂いた情報で調べながら実装できるか試行錯誤しておりました。コードまでご教授いただきありがとうございます！
サイトURLを載せておらずご迷惑をおかけ致しました。
【当該サイトのURL】https://m-syuzen.com/
クライアント様には、上記の変更が当方のスキル不足で実装できない場合もあるので
トップタイトルh1の該当箇所はdisplat:noneでh1ソースを残し、デザインしている記事内のトップタイトルはpタグでの実装でも問題ないとのことでした。上記解説いただいた内容で再度試してみます。
ありがとうございます。いいねをした人: 居ません＠Olein_jpさま
ご報告が遅くなり大変失礼をいたしました。
教えていただいたコードでh1タイトルを含むheader要素を投稿ページ(is_single)に出力させないようにしました。`add_filter(
‘snow_monkey_template_part_render_template-parts/content/entry/header/header’,
function ( $html ) {
if ( is_single() ) {
return;
}
return $html;
}
);その後、h1タイトルを出力させたい任意の場所にはブロックの＞カスタムHTMLにて表示させました。
この度は貴重なお時間を割いて検証までして頂きありがとうございます！いつもこのフォーラムやoleinさんのHSMとキタジマさんとのYoutubeも拝聴させていただいて本当に勉強になっていますし、トークも楽しませてもらっています！ありがとうございます。
いいねをした人: 居ません
- トピック「記事ページのタイトルc-entry__title h1 を別の場所に表示させたい」には新しい返信をつけることはできません。