インストール
MevvBlocks には WordPress 6.0 以降と PHP 8.1 以降が必要です。ほかに依存するものはありません。外部ライブラリも、他社サーバーから読み込むフォントも、ビルド手順もありません。
- プラグインをアップロードして有効化します。
- ブロックエディターでページを開き、コンテナーブロックを追加します。
- その中に入れたいブロックを配置します。ブロックはデザインカテゴリーにあります。
- そのほかの設定は、管理画面サイドバーの MevvBlocks メニューから管理します。
- WooCommerce は任意です。導入すると、ブロックが 2 個増えます。
- MevvBridge は任意です。Elementor から移ってきた場合、それらのページをふたたび編集できるようにするのが MevvBlocks です。
- MevvLegal は任意です。導入されている場合、マップブロックは埋め込みを MevvLegal に預け、訪問者が同意するまでマップが読み込まれないようにします。
Pro 版は、無料版と並べてインストールする別のプラグインで、無料版を必須の前提として宣言しています。ライセンスキーは Lisans (ライセンス) 画面で入力します。Pro 版が無い状態では、MevvBlocks が当社のサーバーへリクエストを送ることは一切ありません。
画面幅ごとのスタイル — ここで埋まる隙間
コアのブロックが受け取れるのは、余白なら一つの値、最小高さなら一つの値、カラム数なら一つの値だけです。その値は、どの画面幅にも同じように適用されます。あるセクションにデスクトップで 100 ピクセル、モバイルで 40 ピクセルの余白が必要だとしても、コアにはそれを表現できません。この一つの隙間こそが、人々がページビルダーを導入する最も一般的な技術的理由です。
MevvBlocks は、一つではなく三つの値 — デスクトップ、タブレット、モバイル — を保存します。しきい値は固定です:
- デスクトップ
- メディアクエリなし。基準となる値です。
- Tablet (タブレット)
- 1024 ピクセル以下で適用されます。
- モバイル
- 767 ピクセル以下で適用されます。
この二つの数値は、プラグインのほかの場所でも同じように使われます。メニューがハンバーガーに変わるしきい値も、グリッドのカラム数もそうです。ピクセル値を自由に入力できる欄は、意図的に用意していません。900 を選んだ人は、ハンバーガーは 900 で切り替わるのに余白は 1024 で変わることになり、二つのブレークポイント体系は、自分自身と食い違うレイアウトを生むからです。
値はブロック自身の属性として、post_content の中に保存されます。専用テーブルにも投稿メタにも入りません。CSS はサーバー側で、リクエスト時に生成され、その要素のすぐそばに小さなスタイルブロックとして出力されます。
なぜ CSS をページと一緒に保存しないのか。保存された HTML が持てるブレークポイントは、一つだけだからです。リクエスト時に生成するからこそ、三つの値が成り立ちます。そしてそれは、ライセンスが切れても公開済みのページが暗くならない理由でもあります。その経路には、ライセンス確認が一つもありません。
エディターのプレビュー — 何が見え、何がまだできないのか
このページはかつて、プレビューは近似だと述べていました。レイアウトに関しては、もうそうではありません。キャンバスは、ページが実際に出力するのと同じ CSS をサーバーに要求し、フロントエンドと同じラッパークラスに適用します。
現在キャンバスで正確に再現されるもの: コンテナのレイアウト (方向、カラム、間隔、揃え)、余白、外側余白、背景、境界線、角丸、影、最小高さ、タイポグラフィ、変形、マスク、配置。画面幅を変えればタブレットとモバイルの値も適用されます。キャンバスは iframe であり、その中でメディアクエリが機能するからです。
なぜ CSS を JavaScript で組み直さず、サーバーから取得するのか。スタイルエンジンは一つであり、二つ目の写しはいずれ最初のものと食い違うからです。誰かが片方に設定を追加してもう片方を忘れた日、エディターは正確だと称しながら誤りを示すことになります。それは、正直に近似だと言っていた以前の状態より悪いのです。
まだ正確でないもの: ブロックの内側のマークアップを対象とするルールです。キャンバスでは、ブロックが編集用の操作要素を自ら描画するため、フロントエンドの構造に合わせて書かれたセレクターには一致する相手がありません。これを解消するには、101 個すべてのブロックについて、編集時のマークアップを公開時のマークアップと同一にする必要があります。それは相応の作業であり、まだ終わっていません。
主張ではなく、計測しました。同じセクションを同じスタイルシートのもとで二度描画し — 一度はフロントエンドが出力するとおりに、もう一度はキャンバスが組み立てるとおりに — 各要素について 16 個のレイアウトプロパティを比較しました。旧キャンバスは、そのうち 24 個で食い違っていました。現在は 64 個中 0 個です。計測に使うツールはプラグインのソースに含まれており (tools/onizleme-esitlik.js)、まず旧マークアップに向けて実行し、この計測が節穴でないことを確かめました。
ブロック
101 個のブロック、WooCommerce なしなら 78 個。すべて無料版に含まれており、Pro 限定のブロックはありません。インサーターのデザインカテゴリーにあります。
- レイアウトとテキスト
- コンテナ、見出し、テキスト、ボタン、区切り線、スペーサー、アンカー、画像、ショートコード、引用、チェックリスト、テーブル、コード
- 見せ方
- お客様の声、アイコン、アイコンボックス、アイコンリスト、画像ボックス、ソーシャルアイコン、著作権表示、チームメンバー、星評価、料金表、価格リスト、バッジ、バナー、ロゴストリップ、数値ボックス、アラート
- 操作と対話
- スライダー、スライド、タブ、アコーディオン、ナビゲーションメニュー、検索フォーム、フォーム、ログインフォーム、登録フォーム、目次、ソーシャル共有、FAQ、タイムライン、ステップ
- コンバージョン
- フリップボックス、CTA、アニメーション見出し、ビフォー / アフター、ホットスポット、オフキャンバスパネル、連絡ボタン、お知らせバー、比較表、データバー、読み進み表示、読了時間、トップへ戻る、パスに沿ったテキスト
- メディア
- 動画、音声、ギャラリー
- データと時間
- コンテンツグリッド、カウントダウン、カウンター、進捗バー、マップ
- サイトとテーマテンプレート
- サイトロゴ、サイトタイトル、キャッチフレーズ、ページタイトル、パンくず、投稿情報、著者ボックス、コメント、前へ / 次へ、アーカイブタイトル、アーカイブの説明、サイトマップ
- WooCommerce (20)
- 商品、商品カテゴリー、商品ギャラリー、商品名、価格、評価、簡単な説明、商品説明、商品メタ情報、追加情報、商品タブ、カートに入れる、在庫状況、関連商品、アップセル、クロスセル、ミニカート、カート、チェックアウト、マイアカウント、注文追跡、並び替え、件数表示 — WooCommerce が有効なときにだけ追加されます
モーション効果はブロックではありません: すべての MevvBlocks ブロックにモーションパネルが追加されます。
JavaScript が読み込まれなくても、ここにあるものが隠れることはありません。タブはすべてのパネルを表示し、アコーディオンはネイティブの details 要素で、スライダーはスクロールします。矢印は、スクリプトが動かせるようになるまで非表示で出力されます。何もしないボタンを見せることは、壊れたインターフェースを見せることだからです。隠れたコンテンツは、たどり着けないコンテンツです。
コンテンツグリッドとループビルダー
コンテンツグリッドブロックは投稿・固定ページ・商品を取得して並べます。ページ送りは単純なリンクなので、JavaScript を無効にしていても動作します。
- 並び順は固定の一覧 — 日付、更新日、タイトル、メニュー順、ランダム — から選びます。その値がデータベースまで届くからです。
- カードの見出しは h2 から h6 までです。h1 は選べません。すでに h1 があるページにカードのグリッドを置けば、見出しの順序が崩れるからです。
- リンクはカードごとに一つです。画像、タイトル、「続きを読む」をすべてリンクにすると、スクリーンリーダーが同じ行き先を三度読み上げることになります。
- グリッドがキャッシュするのは、見つけた投稿の ID だけで、描画済みの HTML ではありません。そしてどの投稿が保存されてもキャッシュは無効化されます。そのため「投稿を公開したのに表示されない」ということは起こりません。
ループビルダーを使うと、組み込みのカードではなく自分でカードを作れます。ループカードという種類のテンプレートを作り、通常のブロックと動的なバインディングで組み立て、グリッドの設定で選びます。
カードのテンプレートを編集しているあいだは投稿の文脈が無いため、動的な連携は静的な代替値を表示します。またテンプレートが空、削除済み、下書きのまま、あるいは自分自身を参照している場合、グリッドは何も出力しないのではなく、内蔵のカードに戻ります。ループの入れ子は 2 階層までです。
フォームエンジン
16 種類の項目と、サーバー側での検証。フォームは、ページの中で実際に何かを行う唯一の部分です。ですから JavaScript なしでも動きます。素の POST 送信でも、スクリプト経由の送信とまったく同じ検証と、同じメッセージが返ります。
- 項目の種類
- テキスト、メールアドレス、電話、アドレス (URL)、数値、日付、時刻、非表示、長いテキスト、ドロップダウン、複数選択リスト、単一選択、複数のチェックボックス、チェックボックス、同意テキスト (KVKK)、小見出し。Pro ではファイルアップロードの項目が加わります。
- 送信されたデータの行き先
- 専用のテーブルと、メールの両方です。先にレコードを書き込み、そのあとでメールを送ります。メールの配送は、データベースへの書き込みよりはるかに高い頻度で失敗するからです。
- 確認する場所
- MevvBlocks → フォームの送信内容。Pro ではそこに CSV 書き出しが加わります。
- 通知メール
- 差出人はお客様のサイトであり、訪問者ではありません。訪問者のアドレスを差出人にすることは、フォームのメールが届かない最も一般的な原因です。SPF と DMARC がそれを拒否します。訪問者のアドレスは、代わりに Reply-To に入ります。
スパム対策は CAPTCHA を使わず、三つの層で行います。セッションに依存しない署名、入力にかかる最短時間、そしてハニーポットの項目です。ハニーポットが埋められた送信は黙って受け付けられ、そのまま破棄されます。エラーを表示すれば、ボットに捕まったことを教えることになり、次の試みではその項目を飛ばされてしまいます。
なぜ WordPress の nonce ではなく署名なのか。nonce はセッションと 12 時間の有効期間に縛られます。キャッシュされたサイトでは同じ HTML が何時間も何日も配信され、その中の nonce はとうに失効していて、フォームは黙って動かなくなります。これはフォームプラグインの現場で最もよくある故障です。ここで使う署名は 7 日間有効で、誰が閲覧しているかには依存しません。
送信元の IP アドレスが、読める形で保存されることはありません。保存されるのは、お客様のサイト自身の鍵でソルトを加えたダイジェストだけです。そのため、異なる二つのサイトの記録を突き合わせることはできません。
送信データの保存は、ライセンスに縛られません。もし縛られていれば、支払いが切れた日が、お客様がデータを失い始める日になってしまいます。
テーマテンプレート
テンプレートの種類は 7 つで、すでにお使いの WordPress エディターで作成します — ヘッダー、フッター、個別コンテンツ、アーカイブ、検索結果、見つかりません (404)、ループカードです。エディターをもう一つ用意すれば、WordPress コアに追随させるものが増えるだけです。
種類と条件は、React のパネルではなく、素朴なサイドバーのボックスに置かれています。従来型のボックスは JavaScript を無効にしても保存でき、エディターの API が変わっても壊れないからです。
- 条件
- サイト全体、トップページ、投稿タイプ、カテゴリー、または単一のコンテンツ。空欄にすると、サイト全体が対象になります。
- 複数が一致した場合
- 最も狭い条件が優先されます。
- 不正な条件
- 保存時に破棄され、空として保存されます。不正な文字列のまま残せば、そのテンプレートは黙って一度も表示されなくなるからです。
ヘッダーとフッターのテンプレートが配置されるのは、Astra と GeneratePress だけです。お使いのテーマにレシピが無い場合、これらは一切出力されず、画面にその旨が表示されます。既存のヘッダーを外せないテーマにヘッダーを付ければ、確実にヘッダーが二つになるからです。個別コンテンツ、アーカイブ、検索、404 のテンプレートは、どのテーマでも動作します。ループを置き換えるだけで、テーマ自身のヘッダーとフッターはそのまま残すからです。
ループカードのテンプレートは、自分からどこかに配置されることはありません。グリッドブロックがそれを選びます。
パターンライブラリとブロックプリセット
すぐ使えるパターンが 20 種類: セクションが 16、フルページが 4 です。WordPress の通常のパターンとして登録されているので、いつもどおりの手順で挿入できます — + ボタン、パターンタブ、そしてMevvBlocks セクションまたはMevvBlocks ページカテゴリーです。
このために独自のモーダルを書くことはしませんでした。コアの挿入ツールが、プレビュー、検索、キーボード操作、翻訳をすでに無償で提供しており、そこから挿入されるのは素のブロックマークアップです。囲い込まれるものは何もありません。
パターンに画像は含まれていません。よそから画像を引いてくることは、著作権の問題であり、プライバシーの問題でもあり、さらにページの見た目を他人のサーバーの稼働状況に縛り付けることになります。画像ブロックは代替テキストを埋めた状態で配置してあります。画像はご自身で選んでください。
ブロックプリセットは、ブロックの見た目の設定に名前を付けて保存し、同じ種類の別のブロックに適用する機能です。内容は意図的に保存しません。テキスト、リンク、画像、リスト項目は取り除かれるため、プリセットを適用しても、書いた内容が上書きされることはありません。
パターンは、フロントエンドには一切登録されません。ページ表示のたびにマークアップを生成すると、109 KB と 3,59 ms かかることが計測されました。読んでいる最中にパターンを挿入する人はいないのですから、何の見返りもない支出です。
ポップアップ
他のものと同じようにブロックエディターで作ります。トリガー・条件・表示頻度は同じ画面のサイドバーにあります。管理は MevvBlocks → ポップアップです。
- 発火条件
- 読み込み後に遅延して、スクロール率で、離脱の兆候で、CSS セレクターに一致するクリックで、あるいは一定の操作時間が経過したあとで。操作時間のタイマーは、タブが背面にあるあいだは止まります。
- 条件
- サイト全体、トップページ、特定のページ、投稿タイプ、カテゴリー。ログイン中、ログアウト中、全員。そして端末ごと。
- 頻度
- 毎回、セッションごとに 1 回、または N 日ごとに 1 回。
- 見た目
- 位置、幅、タイトルを表示するか、外側をクリックして閉じられるか、そして表示時のアニメーション。
「今後表示しない」の回数は、サーバーではなく訪問者自身のブラウザに保持されます。サーバー側で数えるとなれば、同じ箱を二度見せないためだけに、すべての訪問者へ永続的な識別子を発行することになります。
端末の絞り込みは、ユーザーエージェントを覗き見るのではなく、ブラウザが判断します。ユーザーエージェントからタブレットとスマートフォンを確実に見分けることはできませんし、全ページキャッシュの裏側では、最初の訪問者の端末が全員に適用されてしまいます。発火条件が選ばれていない場合は読み込み時が使われ、端末が選ばれていない場合は三種類すべてが対象になります。黙って一度も表示されないポップアップは、表示されすぎるポップアップより悪いからです。
サイトのパレット
色とタイポグラフィをまとめた一つの画面です。MevvBlocks のメニューからも、外観からも開けます。多くの方がそこを見るからです。各項目には変数名が表示され、ブロックは具体的な値ではなく、その名前を参照します。
だからこそ、切り替え前に作られたページも、参照を失うことなく新しいパレットを受け取れます。変数名は、お客様のページがすでに使っているものと同じに保たれます。
削除はできません。色やタイポグラフィの設定は空にできますが、消してしまえば、それを参照していたすべてのブロックの指す先が無くなります。空にすることは元に戻せますが、参照を削除することは元に戻せません。
アクセシビリティ監査
MevvBlocks → アクセシビリティは、公開済みの固定ページ・投稿・テンプレートを検査し、各ブロックで抜けている点を報告します: 代替テキストのない画像、空の見出し、名前やリンク先のないボタン、崩れた見出しの順序、低すぎるコントラストなどです。
同じ監査は、編集中のサイドバーパネルからも使えます。指摘を最も安く直せるのは、その場だからです。
これは意図的に、オーバーレイではありません。ページに「アクセシビリティメニュー」を後付けする層は、何も直しません。代替テキストのない画像には依然として代替テキストが無く、コントラストの低い文字は依然として読めません。事実でないまま「このサイトはアクセシブルです」と掲げることは、何も主張しないことより悪い立場です。オーバーレイを使ったサイトが、まさにそのことで訴えられています。このツールは計測して知らせるだけで、直すのはお客様です。
コントラストが報告されるのは、両方の色が実際に分かっている場合だけです。継承された色を推測すれば、対処のしようがない警告を生むことになります。
速度 — 要素のキャッシュと画像
別々の二つの機能で、どちらも無料版に含まれます。
要素のキャッシュ。ブロックの出力を、リクエストのたびに組み立て直すのではなく保存します。計測値: ブロックの描画時間が 33〜72% 減。永続的なオブジェクトキャッシュ (Redis、Memcached) があればそれを使い、無ければ transient を使います。
訪問者ごと、検索条件ごと、あるいは時点ごとに出力が変わるブロックは、決して保存しません。フォーム、ログイン、登録、ミニカート、商品グリッド、検索、カート、チェックアウト、マイアカウント、ショートコードです。ショートコードがこの一覧にあるのは、その中身が分からないからです。かつて稼働中のサイトで WPForms のトークンを凍結してしまったことがあり、以来この規則はソースコードで強制しています。
画像の最適化。アップロードされたすべての画像について、WebP (任意で AVIF) の複製を元ファイルの隣に書き出します。元ファイルには手を触れません。計測値: 39〜78% の軽量化。小さくならなかったファイルは残しません。小さくて平坦な PNG は、WebP にするとたいてい大きくなります。
画像は <picture> 要素の中で配信されます。すべての形式のアドレスが HTML に含まれ、選ぶのはブラウザです。Accept ヘッダーを見てサーバー側で判断する方式は、意図的に採用していません。同じアドレスが訪問者ごとに違う中身を返すようになると、経路上のすべてのキャッシュが、誤ったファイルを誤った相手に渡し得るからです。
ほかのプラグイン (LiteSpeed、ShortPixel、Imagify、Smush、EWWW、Optimole、Converter for Media) が実際にこの役目を果たしている場合、MevvBlocks は自ら身を引き、その理由を表示します。判断の基準は「導入されているか」ではなく「実際に動けるか」です。画像最適化を有効にしていてもクラウドキーの無い LiteSpeed は、まったく何もしません。
Core Web Vitals — 訪問者のもとで計測
Core Web Vitals は、定義上フィールドデータです。実際の訪問者のブラウザで計測され、28 日間の 75 パーセンタイルとして報告されます。Lighthouse の計測はそれとは別物で、1 台の機械、1 つの回線、1 回の実行にすぎません。この違いを知ることが、「PageSpeed は 98 なのに Search Console は赤い」という混乱を解きます。
Web Vitals の画面には、端末の区分ごとに三つの数値が表示されます:
- LCP
- 主要なコンテンツが表示されるまでの時間です。2.5 秒以下が良好とされます。
- CLS
- 表示が落ち着くまでにページがどれだけ動くかを示します。0.1 以下が良好とされます。
- INP
- タップやクリックにページが応答するまでの時間です。200 ms 以下が良好とされます。
計測用のスクリプトは約 1 キロバイトで、ライブラリを読み込みません。処理を行うのはブラウザ自身の PerformanceObserver です。標本抽出は既定で訪問の 10% で、判断するのはサーバーではなくブラウザです。サーバーが判断すれば、同じ URL から二種類の HTML が生まれ、全ページキャッシュは先に見たほうを全員に配信してしまいます。
個人に関わるものは何も収集しません。IP も Cookie も識別子もありません。三つの数値、端末の区分、ページのパスを、区間ごとの件数としてお客様自身のサーバーに保存します。どこかへ送信されることはありません。
標本が 100 件に満たない場合、画面は数値をまったく表示せず、代わりに現在の件数を伝えます。十数件の計測から出したパーセンタイルはただのノイズであり、誤った数値は、数値が無いことより悪い結果を招きます。誰かがそれをもとに行動してしまうからです。パーセンタイルはヒストグラムから読み取るため、区間の幅の分だけ近似になります。そのことも画面に明記されています。
変形とマスク
どのブロックも、移動、拡大縮小、回転 (Z 軸および 3D の X/Y 軸)、傾斜、反転ができます。それぞれデスクトップ・タブレット・モバイルで別々の値を持てます。ホバー時の変形と、遷移にかかる時間も個別に設定できます。
マスクには円、三角形、六角形、不定形、花、手描きの形、またはご自身の画像を使えます。大きさ、位置、繰り返しも調整できます。
これらの形は個別の SVG ファイルとしてではなく、CSS の中に埋め込まれています。ファイルパスが誤っていると、マスクは黙って消え、その 404 は誰の目にも触れません。CDN の背後では、プラグインフォルダーのアドレスが変わることもあります。
サイト全体のカスタムコード
HTML、CSS、JavaScript を head、body の先頭、または末尾に置けます。認証用タグ、計測スニペット、ちょっとしたスタイルの修正などです。位置、優先度、セッションの条件を設定できます。
PHP は実行しません。ページビルダーの中に PHP の実行機能を置けば、デザイナーの権限が、サーバー上でコードを実行する権限に変わってしまいます。
必要な権限は unfiltered_html です。投稿に生のスクリプトを書けない人は、サイト全体にも書けません。MevvLegal が導入されている場合、ここに置かれたトラッキングスクリプトも、Cookie の同意があるまで保留されます。
WooCommerce 向けブロック
20 個のブロック: 商品名、画像、価格、カートに入れる、評価、在庫、メタ情報、簡単な説明、商品説明、データタブ、追加情報、関連商品、アップセル、クロスセル、カート、チェックアウト、マイアカウント、注文追跡、並び替え、件数表示。
どれ一つとして、WooCommerce を描き直してはいません。いずれも WooCommerce 自身のテンプレート関数とショートコードを呼び出します。お客様のテーマはそのテンプレートを変更し、プラグインはそこにフックします。配送、分割払い、在庫通知、サイズ表などです。独自のマークアップを描けば、そのすべてが黙って失われます。
カート、チェックアウト、マイアカウント、注文追跡は訪問者ごとに内容が異なります。これらでは全ページキャッシュが無効になり、要素のキャッシュも一切行われません。WooCommerce が有効でない場合、これらのブロックはサーバー側にもエディター側にも登録されません。
エディター内のメモ
どのブロックにもメモを貼り付けられます。誰が、いつ書いたか、そして解決済みかどうかが記録されます。
メモがページに出力されることは、決してありません。該当のファイルにフロントエンドのフックは一つもなく、そのことをテストで強制しています。メモは内部のやり取りです。訪問者にそれが見えることは、レイアウトが崩れるより悪い事態です。
メモはブロックの識別子にひも付きます。ブロックを複製すると、複製には新しい識別子が与えられるため、メモは引き継がれません。副次的な利点として、複製は独自の CSS スコープも得ます。
メモは投稿自身のデータの中にあります。投稿を削除すればメモも一緒に消え、行き場のない行は残りません。
エディターの中の AI — お客様自身のキーで
文章の作成、書き直し、要約、画像の代替テキスト生成、翻訳。Anthropic と OpenAI に対応しています。
入力するのは、お客様ご自身の API キーです。リクエストはお客様のサイトから、プロバイダーへ直接送られます。お客様のテキストが当社に届くことはなく、利用枠も請求もお客様のものです。当社は自前のクラウドサービスを作りませんでした。そうすれば、お客様のテキストが当社サーバーを通り、データに対する責任が当社のものになってしまうからです。
キーがブラウザに届くことはありません。リクエストはサーバーから行われます。どのエンドポイントもキーを返さず、設定フォームでさえ、その値を表示し直すことはありません。
キーを暗号化してはいません。そのことをはっきりと申し上げます。WordPress では暗号化の鍵も同じサーバーに置かざるを得ず、データベースに侵入した攻撃者は両方を手に入れます。「暗号化済み」と称することは、存在しない保護を約束することになります。
結果がブロックへ直接書き込まれることはありません。提案として届き、適用するかどうかはお客様が決めます。コンテンツに紛れ込んだ一文が命令として読まれてしまう事態に対する、本当の防御はここにあります。人が承認するのです。
無料版と Pro 版
無料版が、この製品のすべてです。101 個のブロック、テーマテンプレート、グリッドとループビルダー、送信データの保管を伴うフォームエンジン、メニュー、検索、ポップアップ、パターンライブラリ、ブロックプリセット、サイト共通のパレット、画像の最適化、ブロックのキャッシュ、サイト全体のカスタムコード、エディター内のメモ、Core Web Vitals の画面、そしてアクセシビリティ監査。
Pro 版が加えるのは編集の機能であって、出力ではありません:
- ブレークポイント — デスクトップ / タブレット / モバイルのタブで、ブレークポイントごとに最小高さ、コンテンツ幅、幅、そして 4 つの内側余白の値を設定します。
- ブロックごとのカスタム CSS。トークン
selectorはそのブロック自身を指します。 - フォームの追加機能 — 条件付きの項目、送信者への自動返信、Webhook、ファイルアップロードの項目。
- フォーム送信データの CSV 書き出し。
ブレークポイントとカスタム CSS のパネルは、現時点では中核となるブロックに表示されます — コンテナー、タイトル、テキスト、ボタン、区切り、画像、お客様の声、アイコン、アイコンボックス、アイコンリスト、ショートコード、フォーム、商品、商品カテゴリーです。ブレークポイントごとの設定のいくつかは、存在するところでは無料で使えます: グリッドのタブレットとモバイルの列数、メニューのハンバーガー切り替え幅、画像ボックスのモバイルでの位置、そして固定表示のデバイス選択です。
ライセンスが失効した、または無い場合:
- サイトの見た目は、まったく変わりません。保存されたタブレットとモバイルの値はすべて出力され続け、ブロックごとのカスタム CSS も同様です。これは約束ではなく、設計上の規則です。描画の経路にあるどのファイルもライセンスを問い合わせず、そのことをリリースごとにテストで確認しています。
- フォームは送信され続け、保存され続け、メールも送られ続けます。
- 既存のポップアップは、表示され続けます。
- 失われるのはエディターの Pro 版パネルだけで、それ以外はありません。
当社のサーバーに接続できない場合でも、有効なライセンスは 7 日間は動作し続けます。一度も確認に成功していない環境には、猶予は一切ありません。当社のアドレスを遮断することは、Pro 版を手に入れる方法ではないからです。
うまく動かないとき
- 「フォームのセッションが期限切れになりました。」
- そのページのキャッシュが 7 日より古いか、サイトのセキュリティキーが更新されています。ページキャッシュを消してください。
- フォームがメールを送らない
- まず送信データの一覧を確認してください。レコードはメールより先に書き込まれるため、そこに記録があれば、フォームは動いていて配送が失敗したということです。次に、宛先アドレスとサイトのメール設定を確認してください。
- エディターでは正しく見えるのに、フロントエンドで崩れる
- エディターのプレビューは、設計上あくまで近似です。上記をご覧ください。正しいのはフロントエンドです。ブロックがタブレットやモバイルの値を持っている場合、エディターにその旨の注意が表示されます。
- 編集しようとするとブロックが「無効」と表示される
- 以前は、サーバー側では登録されているのにエディターのスクリプトに含まれていないブロックで、これが起きていました。表示は完璧なのに、編集で開いたときにだけ失敗するのです。現在はテストで防いでいます。それでも発生する場合は、ブロック名をお知らせください。
- カウントダウンの時間がずれている
- マークアップが持つのは目標時刻そのものであり、「残り X 秒」ではありません。そのため、キャッシュされたページが時間を固めてしまうことはありません。ブロックはサーバーの時刻に照らして自らを補正します。そのリクエストが遮られた場合は、失敗するのではなく、訪問者自身の時計に頼ります。
- ヘッダーまたはフッターのテンプレートが表示されない
- お使いのテーマにレシピがありません。既存のヘッダーを外せるのは Astra と GeneratePress だけで、画面にも警告が表示されます。ほかの種類のテンプレートは、どのテーマでも動作します。
- ヘッダーが二つ表示される
- MevvBlocks と MevvBridge の両方がヘッダーを出力しています。MevvBlocks が先に枠を取るのは意図的です。ヘッダーは、どちらか一方に任せてください。
- コンテナが設定した幅より広い、または狭い
- テーマの CSS ルールが詳細度で勝っています。とくに Astra は、配下の要素に強くスタイルを当てます。確認できた事例については、
!importantではなく詳細度を上げることで対処しました。新しい事例に遭遇した場合は、テーマ名をお知らせください。 - 公開した投稿がグリッドに出てこない
- 本来は表示されるはずです。グリッドがキャッシュするのは投稿の ID だけで、どの投稿が保存されてもキャッシュは無効化されます。それでも解消しない場合は、投稿タイプと並び順が想定どおりか確認してください。
できないこと
- エディターのプレビューは近似です。見えるのは構造と内容であり、正確な見た目はフロントエンドで確認してください。
- ヘッダーとフッターのテンプレートが機能するのは、Astra と GeneratePress だけです。それ以外のテーマでは何も出力されず、警告が表示されます。黙って処理すれば、ヘッダーが二つになるからです。
- マップは OpenStreetMap の埋め込みです。マーカーは一つ、独自のマーカー画像も、地図のスタイル設定も、経路案内もありません。API キーも課金アカウントも不要で、ページのソースにキーが残ることもありません。
- アクセシビリティのオーバーレイはありません。行うのは計測と報告だけです。
- CAPTCHA はありません。
- 逐次検索はありません。キー入力ごとにリクエストを送ることは、依存先を増やし、レート制限の面倒を招きます。
- カウントダウンは訪問者ではなく、サイトのタイムゾーンを使います。キャンペーンは、世界のどこでも同じ瞬間に終わります。
- メニューが提供するのは二つのブレークポイントであり、自由なピクセル値ではありません。また、フライアウトやオフキャンバスのモードもありません。フォーカス管理を伴うスライド式のパネルは、ポップアップブロックの役目です。
- グリッドのカードを h1 にはできず、ループの入れ子は 2 階層までです。
- 動的コンテンツの取得元は、固定された一覧から選びます。「この式を実行する」といった入力欄はありません。それは、ページを編集できるすべての人にコード実行の権限を渡すことになるからです。
- サイト共通の色とタイポグラフィの設定は削除できず、空にすることだけができます。
- 商品カードを描くのは WooCommerce であり、当社ではありません。そのため、テーマもサードパーティのフックも動き続けます。
- インターフェースは 11 言語で提供されます。トルコ語、英語、スペイン語、ドイツ語、フランス語、ポルトガル語、イタリア語、オランダ語、日本語、ロシア語、ポーランド語。さらに es_MX や pt_PT といった地域別の変種にも対応します。それ以外のロケールでは英語が使われます。
- Web Vitals の集計期間は 28 日ごとにリセットされ、スライドはしません。スライド方式にするには日単位の区間が必要になり、保存容量は 28 倍になります。現在の集計期間がいつ始まったかは、画面に表示されます。
- アンインストールしても、送信データのテーブルや設定は削除されません。ブロックの内容はいずれにせよ読める状態のまま残ります。
post_contentの中の標準的なマークアップだからです。
サードパーティの JavaScript や CSS のライブラリは、どこでも一切読み込みません。スライダーにも、アコーディオンにも、動きの効果にも、マップにもです。そのいずれも、使うページごとに 40 から 100 キロバイトの負担になっていたはずです。