[対馬 俊彦]

ありがとうございます。

15.8.5 にアップデートして、段落部分が見やすく、使いやすくなりました。
ブロックの下に空きがないと ＋ (ブロックを追加) が出せなくて困るんですよね。

editor.css に以下のようになっていますが…

.editor-styles-wrapper .is-layout-flow>:is(.wp-block-table,p,ul,ol,dl,blockquote,iframe) {
    -webkit-margin-after: var(--vk-margin-element-bottom);
    margin-block-end:var(--vk-margin-element-bottom)
}

以下のようにして、見出し (h1,h2,h3,h4) の後ろにも空きを作っていただくとさらに使いやすくなると思います。

.editor-styles-wrapper .is-layout-flow>:is(.wp-block-table,h1,h2,h3,h4,p,ul,ol,dl,blockquote,iframe) {
    -webkit-margin-after: var(--vk-margin-element-bottom);
    margin-block-end:var(--vk-margin-element-bottom)
}

個人的に h5,h6 は使うことはないと思うけど、一般的にはあった方がいいのかなぁ。

ご検討のほどよろしくお願いします。

　

WordPress に追加された .is-layout-flow、なくていいのに…って思っちゃいます。

きっと面倒で厄介な作業なんだろうなと推察しますが、
そういう部分をテーマ側で吸収してくれて、サイト制作する者としてすごく感謝しています。

[対馬 俊彦]

私のブラウザ (Windows 11 ＋ Chrome) で表示すると、出力される画像部分の HTML が、

<img src="https://sample.landl-w.com/cafe/wp-content/uploads/2023/04/Test_HeaderLogo-1.png" alt="喫茶お食事　ABCDEFG">

と PNG 形式になったり、

<img src="data:image/webp;base64,...(長いので略)" alt="喫茶お食事　ABCDEFG">

と WebP 形式になったりしています。

おそらく画像変換するプラグインのようなものが動作しているのだと思います。

それを停止すればなにかヒントが得られるかもしれません。

[対馬 俊彦]

用途から考えると、
ご質問の内容に加えてカバーブロック全体にリンクを設定したくなるので、
レスポンシブ対応まで考えていちからカスタマイズすると
けっこうなボリュームの CSS を書く必要があります。

そこで…

VK パターンライブラリ の 工務店TOP をコピーすると、
下の方に4カラムのバナー (会社案内～役立ちブログ) があります。

カバーブロックの動作はご希望にマッチしていると思います。

このカラムブロックをコピーして、それを元に作ってみたらよさそうです。

工務店TOP

[対馬 俊彦]

以下のアクションフックを書いてサムネイルサイズを指定すればうまくいきそうです。

function my_post_thumbnail_size() {
  set_post_thumbnail_size( 400, 400, true );
}
add_action( 'init', 'my_post_thumbnail_size' );

アップロード済みのメディアには適用されませんので、
再度アップロードするか、サムネイルを再生成するプラグインを使う必要があります。

[対馬 俊彦]

パスワードを再発行しても引き続きログインできない場合は、
メールアドレスとパスワードを以下よりご連絡くださいませ。

ありがとうございます。
その方に伝えて、うまくいかないようならベクトルさんに連絡してもらうようにします。

[対馬 俊彦]

今朝、私がオンラインでサポートをさせていただいた方のアカウントで同じ現象が起きていました。

パターンライブラリ登録完了のメールが届いていましたが、
登録したメールアドレスとパスワードを入力すると、以下のように表示されていました。

エラー: ユーザー名またはパスワードが正しくありません。
残り*回まで間違えることができます。

入力ミスの可能性がまったくないわけではありませんが、
もしかしたら関連するかもしれないので、とりあえずお伝えします。

[対馬 俊彦]

crossFade を使いたいのであれば、
VK スライダーは使えない（独自に JavaScript でコーディングが必要）
と思います。

そこまでしなくても、
以下の CSS で wkwk さんがやりたいことができる気がします。(たぶん)

.vk_slider_item {
    opacity: 0 !important;
}
.vk_slider_item.swiper-slide-active {
    opacity: 1 !important;
}

お時間があれば試してみてください。

• この返信は1年、 7ヶ月前に対馬 俊彦が編集しました。

[対馬 俊彦]

Lightning Pro 8.17.9 にアップデートして修正を確認しました。
ありがとうございます。

[対馬 俊彦]

カスタムカラーがとても便利なので、カスタムアイコンもきっと便利だと思います。

それはそれとして…

今回のご質問の場合、よく使うレビューポイントを VK ブロックパターン に登録しておくと効率アップになると思います。

Attachments:

You must be logged in to view attached files.

[対馬 俊彦]

以下のトピックが参考になります。

ヘッダーメニューをヘッダー画像下に表示したい

[対馬 俊彦]

お使いのテーマが Lightning Pro ですが、
Lightning G3 Pro Unit を使うためには、
テーマを無料版の Lightning に切り替える必要があります。

Lightning G3 Pro Unit のインストール

[対馬 俊彦]

VK Blocks / VK Blocks Pro を 1.52.0 にアップデートして、
[スライド設定] → [表示時間] を 0 に設定できることを確認しました。

修正、ありがとうございました。

[対馬 俊彦]

横から失礼します。

DRILL LANCER さんの回答通りなのですが、ちょっと補足させていただきます。

JavaScript を書かずにスライドショーを動かす TIPS を紹介します。

1行目の

<div class="swiper">

を

<div class="lightning_swiper-container swiper-container">

と書き換えれば、トップページのスライドショーと同じ設定で動作します。

エンドユーザーにこの操作を任せたら、レイアウト崩れが頻回に起こり…

ロックをかけておけば、そのリスクが軽減されると思います。

画面幅に応じたサイズの画像を WordPress が自動生成してくれるということもスライダーブロック（画像ブロック）で作るメリットです。

[対馬 俊彦]

参考情報です。

有料版では指定できないのでしょうか？

私の環境では、

* VK Filter Search Pro (有料版)
* VK Filter Search (無料版)

の両方とも、Category Order and Taxonomy Terms Order で表示順を指定できています。

ちなみに、使用テーマは Lightning (G3モード) です。

[対馬 俊彦]

はい、その通りです。

[投稿者]

投稿