なるほど、VK Blocks ですね。それを聞いたら Snow Monkey Editor プラグインにも同じような見出しのブロックスタイル選択機能をつけても良いような気がしますね…これは別途検討します。
CSSで作ったいくつかの見出し装飾を投稿画面で選ぶようにできるようにするのは、My snow monkeyをつかって対応できますか？
register_block_style() という WordPress の関数を使って実現できます。下記のページにちょうど見出しのブロックスタイルを追加するサンプルコードが掲載されていました。このコードを My Snow Monkey に貼り付けてみてください（インラインスタイルを使う例のようです。inline_style のところを記述しなければ class 付与だけになるので、その際は別途 CSS ファイルに CSS を追記してください）。
まず、My Snow Monkey プラグインに下記のコードを追加してください。
add_filter(
'snow_monkey_template_part_render',
function( $html, $slug ) {
if ( 'template-parts/header/site-branding' === $slug ) {
ob_start();
?>
<div class="my-icons">
ここにアイコンの HTML を記入
</div>
<?php
return ob_get_clean() . $html;
}
return $html;
},
10,
2
);
次に、カスタマイザー → 追加 CSS に下記の CSS を追加して、PC サイズでのアイコン上の余白を調整してください（-24px の部分を任意の数値に設定）。
@media (min-width: 1024px) {
.my-icons {
margin-top: -24px
}
}
アイコンのサイズや数によっては折り返したりしてしまうことがあるかもしれません。そのときはまた言ってください。
そうですね…スマートに固定ページに設置する方法がないので、コードを書いてみました。投稿とちょっとだけ表示位置が変わってしまいますが、試してみてください。下記のコードを My Snow Monkey プラグインに貼り付けてください。
あ、失礼しました、上じゃなくて左ですね。alignwide（幅広）がされているようなので、ツールバーから幅広を解除すれば揃うと思います。
[data-has-sidebar=false] .c-entry__content>.alignwide, [data-has-sidebar=false] .c-entry__content [class*=smb-]>.alignwide, [data-has-sidebar=false] [data-is-content-widget-area=true] .custom-html-widget>.alignwide{
margin-left:calc(50% – (95vw – var(–body-margin-left, 0px))/2)
}
開発ツールで、margin-leftの値を調整して左揃えにしました。
ただクラスがわからず、適用しても反映されません。
コアの「メディアと文章」ブロックを使っていますか？
それであればブロックツールバーで垂直位置の設定ができますよ。
こちら、カスタムCSSに下記の記述を追加することで対応できましたので閉じさせていただきます。
.smb-items__item {
height: 100%;
padding-bottom: 60px;
}
.smb-items__item__action {
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
キタジマさま、返信ありがとうございます。
この部分、他の案件でもしょっちゅう目にするものだったのでてっきりWPがデフォルトで用意しているものだと思いこんでいました！
確認したところ、VK Blocksから出力されているものでした。
もともとLightningが入っていたためだと思います。
CSSで作ったいくつかの見出し装飾を投稿画面で選ぶようにできるようにするのは、My snow monkeyをつかって対応できますか？
キタジマさま
ご返信ありがとうございます。
>実際のページを見せていただければ、
私のサーバーに入っていないため、申し訳ございません。
カスタムCSSに下記のように追記するとボーダーなどは消せることが確認できています。
.p-entry-content>h2{
border-left:none;
background-color:transparent;}
ただこれですと他の場所で標準やその他のスタイルを適応しようすると背景色やボーダーが表示されなくなってしまいますし、運用する人がCSSを扱えないと変更がでません。
下記画像のセミナーの部分は、標準の背景もボーダも表示されていませんが、プレビューで確認すると、標準のボーダーや背景色が出てしまう状況です。
例えば、装飾なしを選んでも標準と同じ装飾が施されます。
下記画像の投稿画面右に出るブロックのカスタマイズを使用したスタイルの変更で、CSSを使わないと標準のスタイルが残ってしまうのは、あまりにも使い勝手が悪く、バグではないかと思ったのですが…。
ご回答ありがとうございます。
Snow Monkey のキャッシュは、Super Casheを使ってるときは不要とのことですね。
Autoptimize は CSS・JS 向けなので、有効にしてよいと
考え方が整理できました。
ありがとうございました！
Snow Monkey のキャッシュは「ヘッダーだけ」「フッターだけ」などの部分キャッシュです。Super Cashe はページキャッシュ、Cache Enabler は存じ上げませんが、おそらくページキャッシュプラグインですよね？ Autoptimize は CSS・JS の圧縮ツールだったかと思います。一言でキャッシュといってもそれぞれ異なるものをキャッシュする機能になるので、必要に応じて取捨選択する必要があると思います。
ページキャッシュを使う場合は部分キャッシュする意味がないので、ページキャッシュをする場合は部分キャッシュは無効化してください。またページキャッシュプラグインも2つ使う必要はないのでどちらか1つにしてみてください。
.c-row--margin が含まれるヘッダーレイアウトだと発生してしまう気がします（ネガティブマージンがあるため）。Snow Monkey 公式サイトは「中央」ヘッダーレイアウトで、これは .c-row--margin を持っていないため横スクロールがでなかったみたいです。次のアップデートで、先に書いた CSS を入れるようにしたいと思います。
うーんなるほどです…。FTP で入らせてもらうことは可能でしょうか？ セキュリティ上 NG であれば、下記の変更を試してみてほしいです。
wp-content/themes/snow-monkey/Framework/Model/Design_Skin.php の
$plugin_data = get_file_data(
dirname( $this->file ),
[
'label' => 'Plugin Name',
],
'plugin'
);
を
$plugin_data = get_file_data(
$this->file,
[
'label' => 'Plugin Name',
],
'plugin'
);
に変更です。
Spring のバージョンは 2.1.0
Snow Monkey Footer CTA のバージョンは 0.4.1 です。
こまめにアップデートしてるので、最新版だと思います。
他のプラグインとかぶってるのですかね….
Spring のバージョンは 2.1.0、Snow Monkey Footer CTA のバージョンは 0.4.1 でしょうか？ もし違う場合はアップデートしてください。どちらもそのバージョンだとサーバーに入って見てみないとわからないかもしれません…こちらではエラーがでないんですよね。
