フォーラムへの返信
-
投稿者投稿
-
Snow Monkey テーマの
app/setup/assets.php
のforeach ( [ 'wp_enqueue_scripts', 'admin_enqueue_scripts' ] as $action_hook ) { add_action(
の読み込みを外せば動作する
んですが、これをどうやってプラグインなりで外せばいいんだろう…これでどうだ!!
add_action( 'load-post.php', 'fb3d_viewer_fix_post' ); add_action( 'load-post-new.php', 'fb3d_viewer_fix_post' ); function fb3d_viewer_fix_post() { global $current_screen; if( is_admin() && '3d-flip-book' === $current_screen->post_type ) { add_action( 'wp_print_scripts', function() { wp_dequeue_script( 'fontawesome5' ); wp_dequeue_script( \Framework\Helper::get_main_script_handle() . '-fontawesome' ); } ); } }
♥ 0Who liked: No userとりあえず、ビューアの表示の問題は プラグイン内の
add_filter('single_template', '\iberezansky\fb3d\custom_template');
と言ったこの処理が問題なので、こいつをpost-type
を見てremove_filter
して…発行されているshortcode
をハンドラーで処理されているのをそのまま同じように処理すれば 一応の表示を可能にできるかとました。(追記修正// ビューア画面を崩さず表示する(管理画面はまだ未対応) add_filter( 'single_template', 'fb3d_viewer_fix_template', 1 ); function fb3d_viewer_fix_template( $single ) { global $post; if ( '3d-flip-book' === $post->post_type ) { remove_filter( 'single_template', '\iberezansky\fb3d\custom_template' ); add_filter( 'the_content', function() { echo( \iberezansky\fb3d\shortcode_handler( [ 'id'=> get_the_ID(), 'classes'=> 'fb3d-default-page' ] ) ); } , 1 ); } return $single; }
管理画面の不具合の方も、プラグイン内の呼び込み処理云々が原因のようなので、調査しますが
少々難しい問題もあるのでお急ぎでしたら別テーマで管理画面でPDFをアップロードなどしていただき、 My Snow Monkeyに上記のコードを書いて対応していただければと思います。
(一応、ビューア表示がされるようになるはずです)調査中ですが…管理画面の設定も綺麗に動作するように対応するには Snow Monkey にも手を加えるしかないかもです…(北島さん、よろしくw
♥ 1Who liked: No user私も
twentytwentyone
テーマだと正しく動作しているのを確認しました。管理画面の方では、おそらく
removeChild
の直接的なエラーではなく、Loading でデータが何らかの不具合で取れていない → Detailの中のオブジェクトを remove しようとしているがそもそもデータが何らかの不具合で…なので、remove が正常にできなくて、それでremoveChild
としたエラー表示が出ているような感じがします。(保証はできませんが…)Snow Monkey テーマだと、
追加の不具合で、「ビューア(フロントの投稿)画面で、CSSやら色々当たらずに真っ白になる」
のもあるようです。
このビューアが表示されない問題は、投稿タイプ周りのテンプレートコール等の問題かも。
テンプレートの読み込み方法を変更したりして、ビューアが表示されるかとかも少し試してみます。(追って報告しま)♥ 0Who liked: No userまず、WordPressのディレクトリに別のディレクトリを割り当ててどうこうするのは最終手段です。(WP 3系時代に議論され済みのようで、現在でもこの思想は変わってない様子。)
WordPress本体のディレクトリにアレコレ置くのを公式は推奨しないと言う事です。テーマでもプラグインでも。そして、テーマで読まれるものはテーマ内、プラグインで読まれるCSS, jsなどのリソースはプラグインディレクトリ内で完結させるのが推奨とされています。
ですが、テンプレートのみ例外で、プラグインが使用するものであっても、テーマディレクトリに別領域を生成して、割り当てる形です。
bbPressやWooCommerce等のプラグインは、使用しているテーマ内にwoocommerce等のディレクトリを生成し、そこに商品ページなどのテンプレートを格納されています。
これはテンプレートと言う性質上、プラグインでは本来難しいWordPressの仕様に伴ってもいます(少し翻訳も難しいのですが、興味あればWP 3〜4系辺りの議論を調べてください)なので、My Snow Monkey もプラグインと言う事から WordPress のプラグインでするCSSの読み込ませ方法を用いるだけで良いと思います。
wp_enqueue_scripts
、またはadmin_enqueue_scripts
などを用いる方法です。いっそのこと、wp-content/plugins/my-snow-monkey配下に置くことも考えましたが、
My Snow Monkeyが汚染されるかなと思って辞めました。プラグインのディレクトリに機能を拡張させる為のリソースを置くのは汚染では無いです。
汚染というのであれば、WordPress本体などに別ディレクトリを生成する方が、深いです。WordPressのシステム全体の汚染につながってしまいます。メンテナンス性などを考慮する場合、通常のプラグインや作法に従って作られたコードの方が読みやすいですので、私なら
wp-content/plugins/my-snow-monkey/assets/styles/..(.css)
wp-content/plugins/my-snow-monkey/assets/scripts/..(.js)
wp-content/plugins/my-snow-monkey/assets/images/..(.png / .jpg)
wp-content/plugins/my-snow-monkey/App/..(.php)と言う感じで、Snow Monkey 等に合わせた構造を my-snow-monkey 内に作って実装するのがベストプラクティスかなーと思います。
コードで言うと、
add_action( 'wp_enqueue_scripts', 'my_snow_monkey_enqueue_assets' ); add_action('admin_enqueue_scripts', 'my_snow_monkey_enqueue_assets' ); function my_snow_monkey_enqueue_assets() { wp_enqueue_script( 'my-snow-monkey-js', MY_SNOW_MONKEY_URL . '/assets/scripts/my-snow-monkey.js', [ \Framework\Helper::get_main_script_handle() ], filemtime( MY_SNOW_MONKEY_PATH . '/assets/scripts/my-snow-monkey.js' ), true ); wp_enqueue_style( 'my-snow-monkey-css', MY_SNOW_MONKEY_URL . '/assets/styles/my-snow-monkey.css', [ \Framework\Helper::get_main_style_handle() ], filemtime( MY_SNOW_MONKEY_PATH . '/assets/styles/my-snow-monkey.css' ) ); }
って感じですかねー。
ブロックエディターに対しては、
admin_enqueue_scripts
じゃなくブロックエディターのやりたい事に合わせてリファレンスを参考にエディターのロード時などで読み込ませる方が良いかもしれません(ケースバイケースでもあるので、割愛します)。Snow Monkey Formsには、確認画面や、サンキュー画面等はありますか?
あります。
などでも詳しく書かれています。
何かを使用して制作をされる場合(Snow Monkeyであってもなくても)
使用するツールのアップデートや関連情報に常にアンテナを向けておくという姿勢は必ず必要と思います。
教えてもらった地点から常に進化を続けているものにはアンテナを向け続け、情報をキャッチし続けていなければ、古い知識のまま対応をしざるを得ないからです。
これらの最新情報は Snow Monkey のサポートフォーラムやオンラインコミュニティ(Slack)で検索するだけでも情報がでてきますので、今後の詳細情報を収集する際はそちらもご活用ください。♥ 1Who liked: No user@キタジマさん
“オーダー情報自体” はWCの仕様もあるので取れないっすね。(請求情報とか保護されてるので)
ただ、ユーザーIDやらカスタマーIDなりで、オーダーIDを掴んでそれと一緒に…叩いて
何なりの手順でIDを掴んで順よくやる事で、このサイトであれば、いつどんなユーザーが何を買ったか〜程度のオーダー系に近いステータス的な情報を取れはします。
(WCの仕様なのか、ブロックと連動させるためなのか、プラグインと連動しやすくする為なのか、その辺は割と緩めっぽいです)重要な情報は取得できないので安心と言えば安心ですが、不安ならwp-json閉めた方が良いかもです。
♥ 0Who liked: No user書いていいか解らんのでヒントだけ書いときますね。
https://snow-monkey.2inc.org/wp-json/wp/v2/users?slug=olein
こちらのWP-JSONでユーザーネームに対して、該当ユーザーのデータを取得できます。
(例は olein 氏の場合)それでユーザーIDなどが解るはずなので、後はWooCommerceのAPIをユーザーIDでバチバチ叩けば…
商品IDはプロダクト系のAPIから叩いてください。(基本変わらないので1回叩いて確認するだけで良いです)WCのAPIは
https://snow-monkey.2inc.org/wp-json/wc/v3
ですね。これのパラメーターを使い、WooCommerceのAPIを上手く叩けばサブスクの判定を外部からでも取れます。
(とは言え…WooCommerce API…のオーダー関係の取得していいのか…なぁと。ここはあんまり書かない方が良いかなーと言うことで…詳細は割愛しときます^^;)追記:
判定の方法は書いても大丈夫かなと。
プロダクトIDとオーダーした日時とステータスがcompletedなものからサブスク中か判定する感じです。(meta dataから取れるかもしれないけど…)
Snow Monkeyの場合であれば、1年の期間販売なので、オーダー日時+1年で割り出せるはずです。♥ 1Who liked: No user簡単にやるなら
<i class="fa fa-angle-right" aria-hidden="true"></i>
を「次へ」という文字列に置換。
<i class="fa fa-angle-left" aria-hidden="true"></i>
を「前へ」という文字列に置換。
そして、CSS で数字の部分をdisplay: none
で非表示にし、左右のボタンのスタイルを調整する形でしょうか。文字列置換に関しては、my snow monkey で
add_filter( 'inc2734_wp_basis_posts_pagination_args', function( $_args ) { $_args['mid_size'] = 0; return $_args; } ); add_filter( 'snow_monkey_template_part_render_template-parts/archive/pagination', function( $_html, $_name, $_vars ) { $_html = str_replace( '<i class="fa fa-angle-right" aria-hidden="true"></i>', '次へ', $_html ); $_html = str_replace( '<i class="fa fa-angle-left" aria-hidden="true"></i>', '前へ', $_html ); return $_html; }, 10, 3 );
かなと。
数値を消すとかのスタイルは、下記のCSSを参考に調整してみてください。
.c-pagination__item-link, .c-pagination__item current { display:none; } .c-pagination__item-prev, .c-pagination__item-next { display: inline-block; }
@ キタジマさん
ページャーの呼び出しって、inc2734
ライブラリの範囲なので…これってSnow Monkeyなやり方では綺麗に書けないんじゃ…と。とりあえず、テンプレート上書きとかしにくい範囲かなと思いますが、…ゴリ押しテンプレート置換するならDOMパーサーかなーって事で、別なページャースタイルにする方法も下記に書いときます…。
(上級者向けのコードです。読めない・解らないなら、やらない方がいいです)class Pager { function __construct() { add_filter( 'inc2734_wp_basis_posts_pagination_args', [ __CLASS__, '_posts_pagination_args' ] ); add_filter( 'snow_monkey_template_part_render_template-parts/archive/pagination', [ __CLASS__, '_render_pagination' ], 10, 3 ); } static function _posts_pagination_args( $_args ) { $_args['mid_size'] = 0; return $_args; } static function _render_pagination( $_html, $_name, $_vars ) { global $wp_query; global $paged; // 現在のページ値 $_links = []; $_paged = ( $paged >= 2 ) ? $paged : 1; $_navigation_html = '<span class="kt-pagination-text">' . $_paged . 'ページ (' . $wp_query->max_num_pages . 'ページ中)' . '</span>'; $_html = preg_replace( '/<span (.*)<\/span>/', '', $_html ); $_domDocument = new \DOMDocument(); $_pre_use = libxml_use_internal_errors( true ); $_domDocument->loadHTML( '<?xml encoding="UTF-8">' . $_html ); libxml_clear_errors(); libxml_use_internal_errors( $_pre_use ); $_xPath = new \DOMXPath( $_domDocument ); $count = 0; foreach ( $_xPath->query( '//div[@class="nav-links"]/a' ) as $_node ) { if ( $_paged === 1 ) { switch ( $count ) { case 0 : $_node->nodeValue = '最後のページ'; break; } } else { switch ( $count ) { case 1 : $_node->nodeValue = '最初のページ'; break; case 2 : $_node->nodeValue = '最後のページ'; break; } } $_links[] = $_node->ownerDocument->saveHTML( $_node ); $count++; } $_links = self::replace_array( $_links, 0, 1 ); if ( count( $_links ) === 4 ) { $_links = self::replace_array( $_links, 3, 2 ); } $_links_html = ''; foreach ( $_links as $_link ) { $_links_html .= $_link; } $_html = preg_replace( '/<div class="nav-links">(.*)<\/div>/s', '<div class="nav-links">' . $_links_html . '</div>' . $_navigation_html, $_html ); return $_html; } private static function replace_array( $_items, $_position, $_new_position ) { $_new_items = $_items; $_old_item = $_new_items[$_position]; unset( $_new_items[$_position] ); array_splice( $_new_items, $_new_position, 0, $_old_item ); return $_new_items; } }
こんな風になるかと。
♥ 1Who liked: No user.c-entries--text .c-entry-summary__meta .c-meta__item { /* 日付 */ font-weight: 300; } .c-entries--text .c-entry-summary__title { /* テキスト部分 */ font-weight: 300; }
この場合のやり方としては、ブラウザのデベロッパーツールで表示しているテキストの font-weight を見て、そのスタイリングされている要素の font-weight を 300 に上書きする形に当てると大体対応できます。
もし、このデベロッパーツールでのやり方の理解が難しい場合は、デベロッパーツールについて調べてみてください。Snow Monkey以外であってもCSSでのデザインカスタマイズの方法の基礎を掴めると思います。
(デベロッパーツールは奥が深いので、調べられる方がきっと色々身に付きます。ここではあえて割愛しておきます)もし、デベロッパーツールが理解できている場合であれば、
Snow Monkey の場合であれば、FLOCSSというCSS仕様を用いている為、それについて調べていくとSnow Monkeyのスタイリングの構造も理解しやすくなると思います。♥ 1Who liked: No userこちらのトピックについても
.smb-testimonial__item__content { font-weight: 300; }
お客さん情報(30代女性…の部分)は
.smb-testimonial__item__name { ... }
で、変更できると思います。
♥ 1Who liked: No userキタジマ氏ではありませんが。
.elementor-nav-menu--main .elementor-item { font-weight: 300; }
と、
font-weight
をスタイリングで当てることで調整できませんか?現在は
400
となっているようですので300か200か100にすれば細くなるはずです。♥ 1Who liked: No useradd_rewrite_endpoint
やadd_rewrite_rule
はパーマリンクの問題が大きすぎるので…ちょっと悩む問題があるかと。
プラグインでも結構使うのですが、現場で問題が起きやすいものなので、やる場合には整形するかどうかのオプションフックが要るかも。
add
してから外す際は正しく(綺麗に)外れない環境も多く、テーマで強制的なリライトルールを適用させるのはあまり推奨されないと思います。♥ 1Who liked: No user追加CSSで、こんな感じでどうですかね?
.wpco .contents-outline li li>a:before { border: 1px solid var(--accent-color,#cd162c); background-color: transparent; color: var(--accent-color,#cd162c); }
♥ 2Who liked: No userなお、特定のカテゴリーの関連記事を非表示にしたい場合はどうのようにすれば良いのでしょうか。
preレンダラーで空表示させれば良いと思います。
こんな感じでしょうか?add_filter( 'snow_monkey_pre_template_part_render_template-parts/content/related-posts', function( $html, $name, $vars ) { if ( is_singular() ) { if ( in_category( [ 3 ] ) ) { // 3のカテゴリーであれば return ''; // 空を返却 = 非表示 } } return $html; }, 10, 3 );
♥ 1Who liked: No userここまでリッチじゃないにしても下記のサイトの画像部分とかですね。
なるほど。リッチな遅延ロードとかのやつじゃなく…こう言うアニメーション効果でしたか。確かにこう言うのも増えましたね。
このパターンなら確かにそんな難しく考えなくても出来るので良さそうです。
調査してみると、コレはただ単にアニメーション…ですね(画像の遅延ロードとか関係なしの)
でも、軽量。今でも結構いろいろなサイトで見かける…
当然表示速度を気にするならアニメーション(的な表現)はしないほうが良い…
アニメーション的な表現は、遅延ロードの掛け合わせ技で表示速度を早めつつも、違和感なく切り替わるなどの為にも使われる場合を除いては、基本的に速度落とすので…確かに気にするならやらない方が良いかもですね。
ページ速度気にするのにリッチにしたいって人もWordPress案件の中で多かったので、バランス良くアニメーションを使わせるにはどうしたら良いのかとも、変に難しく考え過ぎてしまってますね。すみません。
♥ 1Who liked: No user -
投稿者投稿