フォーラムへの返信
-
投稿者投稿
-
修正版の v1.2.1 をリリースしました、確認されてみてください！
♥ 0いいねをした人: 居ませんどうも画像を入れる機能があるブロックが全滅しているみたいです。急いで修正版アップデートします！
♥ 0いいねをした人: 居ませんぐわー！ご報告ありがとうございます、確認します！
※なんか他のブロックもいろいろだめになってる気がしますね…。Gutenberg v4.2 との相性かもしれません
♥ 0いいねをした人: 居ませんこれは投稿タイプは「投稿」ですかね。
投稿であれば、子テーマに
template-parts/loop/entry-summary-post.phpをコピペし、その中の<?php if ( ! empty( $_term ) ) : ?> <span class="c-entry-summary__term"><?php echo esc_html( $_term->name ); ?></span> <?php endif; ?>を
<?php if ( ! empty( $terms ) ) : ?> <?php foreach ( $terms as $_term ) : ?> <span class="c-entry-summary__term"><?php echo esc_html( $_term->name ); ?></span> <?php endforeach; ?> <?php endif; ?>に変えてみてください。とりえあずこれで複数カテゴリーがでるようにはなるかと！
♥ 0いいねをした人: 居ませんこれは良さそうですね！とりあえず一番上に画像を入れられるようにしてみようかなと思います。
♥ 0いいねをした人: 居ませんでも25%、50%があるだけでも、だいぶ自由度が上がるかなと思いました。
もしそんなに大変でなければ、ご対応いただけると嬉しいです。追加します！
♥ 0いいねをした人: 居ませんこちらの記事にある CSS を追加してみてください！
♥ 0いいねをした人: 居ませんあ、Gutenberg じゃなくて Elementor なのですね。Elementor でそのような機能を追加する方法はちょっとわからないです、すみません！
♥ 0いいねをした人: 居ません見出しは、人によって「線だけなくしたい」「背景色だけなくしたい」「どっちもなくしたい」「色を変えたい」などいろいろなパターンが考えられるので、設定でできるようにするより、各々で CSS を追加して調整するのがベターだと思います。
.c-entry__content > h2 { border-left: none; background-color: transparent; padding: 0; }こんな感じでどうでしょうか？
♥ 0いいねをした人: 居ません画像を追加すると自動で白い枠（影？）が追加されます。
すみません、これスクショ貼っていただくことできますでしょうか？
影は意図的につけているのですが、普通に透過した薄い黒なので、「白い枠」というのがどういう状態なのかなと思いまして。♥ 0いいねをした人: 居ませんこの現象がおこるのは指定しているアイコンが存在しない、つまり指定がまちがっているからですね（もしかしたら他の理由があるかもですが）。
ちなみにSnow Monkeyの公式サイトをスマホで見た時に、スマホ用固定バーの「マニュアル」で同じ現象が起こっていました。
ですね、これも指定が間違っているからで、直すのがめんどくさくてそのままになってしまっています…笑
Snow Monkey に入っている FontAwesome はバージョン5なので、バージョン4のアイコンを指定していても同様の現象になります。バージョン5のアイコンを正しく指定しているか一度確認されてみてください。
♥ 0いいねをした人: 居ません残念ですが、いまのところ Gutenberg でそれをスマートにやる方法はないと思います。やるとすれば HTML ブロックやクラシックブロックを使うことですが、前回それでエラーになったということでしたので、安定的に運用することを考えるとそれもどうなのかなと…。
♥ 0いいねをした人: 居ませんこうする必要は特にありませんか？
PHPMD で「
else使うな！」と怒られるんで、必要ないときは使わないクセがつきました^^; 挙動は変わらないのでどちらでも好きなほうで良いと思います。例えばレイアウトの変更などはスタイルの書き出しではなく、条件分岐で読み込むファイルを変える、もしくはCSSクラスを切り替えるなどの処理が必要になってくると思いますが、そちらの方法に関して何かアドバイスいただければ幸いです。
カスタマイザーの設定値は
get_theme_mod( 'xxx' );で取得できるので、その値で分岐させたりすることになりますね。例えば、$output_description = get_theme_mod( 'output-description' ); if ( true === $output_description ) { // description を出力 }みたいな。
♥ 0いいねをした人: 居ません項目ごとに分割する方法
Snow Monkey がとっている方法です。項目が多くて1ファイルだとすごく長くなってしまうので、各パネル、各セクション、各コントロールごとにファイルを分割し、それぞれ include する、という方法をとっています。
// snow-monkey/functions.php use Inc2734\Mimizuku_Core\Helper; $includes = [ '/app/customizer', ]; foreach ( $includes as $include ) { Helper\load_theme_files( __DIR__ . $include ); }上記のコードが
app/customizerの中にある各カスタマイザーの項目（パネル、セクション、コントロール）を読み込む、という処理になります。Inc2734\Mimizuku_Core\Helper\load_theme_filesというメソッドで読み込んでいますが、これは inc2734/mimizuku-core というライブラリの中で定義された関数なので、WP Customizer Framework だけを使いたい場合は使用できません。なので、うーん、ちょっとめんどうですが、1ファイルずつ include させるのが簡単かもしれません。こんな感じ。読み込み順番は、パネル、セクション、コントロールになるようにする必要があります（多分そうしないと未定義でコケちゃう）。include_once ( get_template_directory() . '/app/customizer/design/panel.php' ); include_once ( get_template_directory() . '/app/customizer/design/sections/base-design/section.php' ); include_once ( get_template_directory() . '/app/customizer/design/sections/base-design/controls/accent-color.php' ); include_once ( get_template_directory() . '/app/customizer/design/sections/base-design/controls/base-font-size.php' ); include_once ( get_template_directory() . '/app/customizer/layout/panel.php' ); include_once ( get_template_directory() . '/app/customizer/layout/sections/header/section.php' ); include_once ( get_template_directory() . '/app/customizer/layout/sections/header/controls/header-layout.php' );あとは、Snow Monkey のファイルを参考に見てもらえればと思います。
次に、スタイルの定義についてです。これは
snow-monkey/app/setup/customizer-styles.phpで各スタイル定義用のファイルを読み込んでいます。こちらも inc2734/mimizuku-core のメソッドを使ったりしているので、単純化すると下記のような感じです。add_action( 'wp_loaded', function() { include_once( get_template_directory() . '/assets/css/foundation/_body/_body.php' ); include_once( get_template_directory() . '/assets/css/object/component/_btn/_btn.php' ); ... }, 11 // この数字は Snow Monkey デザインスキンを動作させる都合で必要なものなので、なくても構いません );/assets/css/foundation/_body/_body.phpなどのコードは Snow Monkey のファイルを参考にしてみてください。
わからない、動かない、などあればお気軽に書き込みどうぞ！
♥ 0いいねをした人: 居ません項目を増やしていく方法には、大きく分けて2パターンあると思います。1つは単純に1ファイルに追加していく方法、もう一つは Snow Monkey のように項目ごとに分割する方法です。それぞれにサンプルを書いてみますね。
基本的な考え方
あえて書く必要はないのかもしれませんが、理解しておいたほうがわかりやすいかなと思いますので、まず基本的な考え方を書いておきます。
「パネルの中のセクションの中のコントロール」という考え方ではなくて、「独立したコントロール、セクション、パネルがそれぞれあり、コントロールをどのセクションに属させるか、セクションをどのパネルに属させるかを定義する」と考えてください。
単純な方法
では、まず1ファイルに書いていく方法です。
$customizer = \Inc2734\WP_Customizer_Framework\Customizer_Framework::init(); $customizer->panel( 'design', [ ... ] ); $customizer->section( 'base-design', [ ... ] ); $customizer->control( 'color', 'accent-color', [ ... ] ); $customizer->control( 'number', 'base-font-size', [ ... ] ); if ( is_customize_preview() ) { $panel_design = $customizer->get_panel( 'design' ); $section_base_design = $customizer->get_section( 'base-design' ); $control_accent_color = $customizer->get_control( 'accent-color' ); $control_accent_color->join( $section_base_design )->join( $panel_design ); $control_base_font_size = $customizer->get_control( 'base-font-size' ); $control_base_font_size->join( $section_base_design )->join( $panel_design ); } $customizer->panel( 'layout', [ ... ] ); $customizer->section( 'header', [ ... ] ); $customizer->control( 'select', 'header-layout', [ ... ] ); if ( is_customize_preview() ) { $panel_layout = $customizer->get_panel( 'layout' ); $section_header = $customizer->get_section( 'header' ); $control_header_layout = $customizer->get_control( 'header-layout' ); $control_header_layout->join( $section_header )->join( $panel_layout ); }add_action( 'wp_loaded', function() { $customizer = \Inc2734\WP_Customizer_Framework\Customizer_Framework::init(); $cfs = $customizer->styles(); $accent_color = get_theme_mod( 'accent-color' ); // accent-color を使ったスタイルの定義を書く $cfs->register( ... ); // base-font-size を使ったスタイル定義を書く $cfs->register( ... ); });移動中に書いていて実際に試せていないので構文エラーなどがあるかもしれません、その際は適宜修正してください…（すみません><）。
♥ 0いいねをした人: 居ません -
投稿者投稿
