-
検索結果
-
キタジマさん
add_action は任意のフックポイント（ここでは snow_monkey_prepend_body や snow_monkey_prepend_contents）で処理を実行したり、HTML を追加するものになるので削除はできません。
基本的には、既存の Snow Monkey の HTML を削除したり書き換えたりする場合は snow_monkey_template_part_render フィルターフックを使ったり、My Snow Monkey や子テーマを使ってテンプレートを上書き（同名のファイルを My Snow Monkey や子テーマに配置したら Snow Monkey のテンプレートではなくそのテンプレートが使用されるという仕組み）で対応することになります。
理解できた・・・と思います。勉強になりました！(フィルターフックはまだわかっていないので、これから勉強します)
ありがとうございましたm(_ _)m
いいねをした人:
トピック: リンクをボタンからではなくカード全体へ適用したい
【お使いの Snow Monkey のバージョン】17.2.4
【お使いの Snow Monkey Blocks のバージョン】 16.0.3
【お使いの Snow Monkey Editor のバージョン】 8.0.1
【お使いのブラウザ】crhomeこんにちは。
ボタンではなくカード全体にリンク範囲を設定したく、filterフックで書き換えを試みていますが、理解が足りずなかなかうまくいきません。
### 実現したいこと
下記ブロック内の各カード全体にリンクを適用したい。
snow monkey の機能を活かしたまま可能ならそれがベストですが、カード部分のみオリジナルでコーディングしたものを入れれるならそれでも問題ありません。
### 発生している問題
フィルターフックを使用して書き換えを試みましたが、思うような表示にならない。
### 試したこと
テストとして、下記のように
my-snow-monkey.phpへ記載しましたが表示崩れがおきています。add_filter( 'snow_monkey_template_part_render_template-parts/content/entry/content/content', function ($html) { if (is_front_page()) { $card_container_before = ' <div class="wp-block-snow-monkey-blocks-items-item-standard c-row__col"> <div class="smb-items__item"> <div class="smb-items__item__figure"> <img src="" alt="" /> </div> <div class="smb-items__item__body"> <h3 class="smb-items__item__title"></h3> <div class="smb-items__item__content"></div> </div> </div> </div>'; $card_container_after = ' <div class="wp-block-snow-monkey-blocks-items-item-standard c-row__col"> <a href=""> <div class="smb-items__item"> <div class="smb-items__item__figure"> <img src="" /> </div> <div class="smb-items__item__body"> <h3 class="smb-items__item__title"></h3> <div class="smb-items__item__content"></div> </div> </div> </a> </div>'; $html = str_replace( $card_container_before, $card_container_after, $html ); return $html; } }, 10, 3 );上記のような感じで記述してみましたが、そもそもフィルターフックじゃないほうがいいとかあったりしますか？
【お使いの Snow Monkey のバージョン】17.2.4
【お使いの Snow Monkey Blocks のバージョン】16.0.3
【お使いの Snow Monkey Editor のバージョン】8.0.1
【お使いのブラウザ】Chrome
【当該サイトのURL】### 実現したいこと
英語の切り替えボタンを押して英語のページを表示した際に、ロゴ画像も英語で用意したものに切り替えたい。### 発生している問題
自分なりに参考にしてコードを書きましたが、他に書き方があるのか、問題ないのか等知りたいです。
### 試したこと
本題ではないのですが、まずMy Snow MonkeyにフォーラムやオレインさんのHAPPY SNOW MONKEYの情報をもとに下記のコードを書いて言語切替のボタンを表示させています。
/* グローバルナビの上部にbogoの言語切替ボタンを挿入 */ add_filter( 'snow_monkey_template_part_render_template-parts/nav/global', function( $html, $name, $vars ) { ?> <div class="translation-btn-wrapper"> <div class="translation-btn"> <?php echo do_shortcode( '[bogo]' ); ?> </div> </div> <?php return ob_get_clean() . $html; }, 10, 3 ); /* ドロワーメニュー上部にbogoの言語切替ボタンを挿入 */ add_action( 'snow_monkey_prepend_drawer_nav', function() { ?> <div class="translation-btn-wrapper"> <div class="translation-btn"> <?php echo do_shortcode( '[bogo]' ); ?> </div> </div> <?php } );肝心のロゴ画像の切り替えについては「bogo ロゴ画像 変更」で検索して、他テーマで変更されているケース等ありましたがSnow monkeyの場合にどうすればいいかわからず、フックでできるのか、テンプレートを上書きすべきかなど試行錯誤していましたが、うまくいかず下記のロゴの差し替えを参考に
My Snow Monkeyに下記を追加して、最終的に英語のページに切り替えた際にはロゴが英語で用意したものに変更できるようにはなりました。
add_filter( 'get_custom_logo', function( $html ) { if(get_locale() == "en_US") { $html = preg_replace( '|<img .+? />|', '<img class="custom-logo" src="'.MY_SNOW_MONKEY_URL.'/aseet/image/logo.png" />', $html ); } else { } return $html; } );ただ、途中
MY_SNOW_MONKEY_URLでのパスの指定がなかなかうまくいかず、結果的になんとか動いている状態ですので、書き方等に問題がないか？また、Bogoでロゴの出し分けをされたい方の参考になればと投稿させていただきました。お手数ですがご確認お願いいたします。若干コードに誤りがございました。正しくは以下です。
add_filter( 'snow_monkey_template_part_render_template-parts/content/share-buttons', function( $html ) { $html = str_replace( 'html', 'html @yamakenkenken より', $html ); return $html; } );いいねをした人:
ありがとうございます！
知識不足でした。
ポップアップは、PHP⇒JSで出力されフックでは対応できないと、間違った予想をいたしました。以下のコードで対応できました。いつもありがとうございます！
add_filter( 'snow_monkey_template_part_render_template-parts/content/share-buttons', function( $html ) { $html = str_replace( 'html', 'htem @yamakenkenken より', $html ); return $html; } );いいねをした人:
【お使いの Snow Monkey のバージョン】17.1.0
【お使いの Snow Monkey Blocks のバージョン】16.0.1
【お使いの Snow Monkey Editor のバージョン】8.0.1
【お使いのブラウザ】firefox
【当該サイトのURL】local### 実現したいこと
①任意のタクソノミーで表示されているc-entry-summary__title部分にカスタムフィールドを表示させたい。
②カスタム投稿のアーカイブページの横一列の表示数を３つから４つに変更したい。
できれば任意のタクソノミー投稿の表示数も3つから4つに変更したい。### 発生している問題
①カスタム投稿のアーカイブページではカスタムフィールドの出力が行えたが、任意のタクソノミーで表示されているパネル？には同じようにカスタムフィールドを表示させることができない。
②どこを弄っていいかわからない。
### 試したこと
/*カスタム投稿 */ add_filter( 'snow_monkey_template_part_render_template-parts/loop/entry-summary/title/title', function ($html) { if (get_post_type('seles_cats')) { // カスタムフィールドで設定したフィールド名を代入 $acf_year = get_field('sex'); $acf_faculty = get_field('price'); $acf_birthday = get_field('birthday'); // テンプレートのh2タグの後に<div class='employee-info'>を追加 $acf_employee_info = "</h2> <div class='employee-info'> <p>" . esc_attr($acf_year) . "</p>" . "<p>" . esc_attr($acf_faculty) . "</p>" . "<p>" . esc_attr($acf_birthday) . "</p>" . "</div>"; // テンプレートパーツのh2タグの後ろにdivタグを追加する $html = str_replace( '</h2>', $acf_employee_info, $html ); } return $html; } );アーカイブの時は
is_post_type_archiveを指定することで表示できたので、ここをget_post_typeに変更したが表示されなかった。こちらも参考にしましたが、表示ができませんでした。
↓アーカイブページ
↓任意のタクソノミー表示
よろしくお願いします。
まーちゅう様
上記コードで無事実装することができました。
この度は、ご教示いただき誠にありがとうございました。
それではトピック閉じさせていただきます。
P.S.
ご教示いただいた内容を参考に、
.c-entry__metaを、以下.c-entry__header__header内に含有させる場合、以下のように実装できましたので念の為共有いたします。/** * シングルページのページヘッダーにアイキャッチを追加 * * @param $html テンプレートパーツの出力HTML * @param $name テンプレートパーツの名前 */ // use Framework\Helper; add_filter( 'snow_monkey_template_part_render_template-parts/content/entry/header/header', function( $html, $name ) { if ( "post" === $name ) { ob_start(); // アイキャッチ画像のHTMLを記録開始 if ( has_post_thumbnail() ) { ?> <div class="c-entry__thumbnail"> <?php the_post_thumbnail("large"); ?> </div> <?php } $thumbnail_html = ob_get_contents(); // 記録結果を変数に代入 ob_end_clean(); //記録終了 $search_1 = '<h1 class="c-entry__title"'; $replace_1 = '<div class="c-entry__header__header"><h1 class="c-entry__title"' ; $search_2 = '</header>' ; $replace_2 = '</div>'.$thumbnail_html.'</header>'; $html = str_replace( [ $search_1, $search_2 ], [ $replace_1, $replace_2 ], $html ); } return $html; }, 10, 2 );いいねをした人:
こんにちは。
カスタマイザーの設定でアイキャッチ無しにしたうえで、My Snow Monkey に以下のコードを追加してみてください。/** * シングルページのページヘッダーにアイキャッチを追加 * * @param $html テンプレートパーツの出力HTML * @param $name テンプレートパーツの名前 */ // use Framework\Helper; add_filter( 'snow_monkey_template_part_render_template-parts/content/entry/header/header', function( $html, $name ) { if ( 'post' === $name ) { // アイキャッチ画像 ob_start(); if ( has_post_thumbnail() ) { ?> <div class="entry-thumbnail"> <?php the_post_thumbnail( 'medium' ); ?> </div> <?php } $thumbnail = ob_get_contents(); ob_end_clean(); $search_1 = '<h1'; $replace_1 = '<div class="entry-header"><h1' ; $search_2 = '</h1>' ; $replace_2 = '</h1>'.$thumbnail.'</div>'; $html = str_replace( [ $search_1, $search_2 ], [ $replace_1, $replace_2 ], $html ); } return $html; }, 10, 2 );CSSでの調整が必要になるので以下のような感じでレイアウト調整してみてください。
.entry-header { display: flex; justify-content: space-between; } .entry-thumbnail { width: 20%; }いいねをした人:
ちょっときれいなやり方ではないかもですが、下記のコードでとりあえず実現はできると思います。My Snow Monkey に貼り付けて調整してみてください。
add_filter( 'snow_monkey_template_part_render_template-parts/common/page-header', function( $html ) { // img タグを picture + source + img に置換 // 639px以下のときは source で指定した画像を表示する return preg_replace( '|(<img [^>]+>)|ms', '<picture> <source srcset="https://placehold.jp/100x100.jpg" media="(max-width: 639px)"> $1 </picture>', $html ); } );いいねをした人:すみません。こちら、返事が遅くなてしまいました。
キタジマさんにご提示いただいたコードを参考に、以下のように対応しようと思います。add_filter( 'snow_monkey_template_part_render_template-parts/header/hamburger-btn', function( $html ) { ob_start(); ?> <span class="c-hamburger-btn__close-label">とじる</span> <?php $close_label = ob_get_contents(); ob_end_clean(); $html = str_replace( '</button>', $close_label.'</button>', $html ); return $html; }, 10 );.c-hamburger-btn__close-label { display: block; } .c-hamburger-btn[aria-expanded="true"] .c-hamburger-btn__label { display: none; } .c-hamburger-btn[aria-expanded="false"] .c-hamburger-btn__close-label { display: none; }いいねをした人:
