html2wp / Visual Edit

WordPress エディター:ページをクリックして、その場で編集

Visual Edit Liteは、ページ上で直接編集できる無料のWordPress エディターです。Twenty Twenty-Fiveのようなブロックテーマなら、ページ上の見出し、画像、メニューをクリックして、その場で書き換えられます。html2wpで静的HTMLから変換したサイトも同じエディターで編集でき、ページのマークアップはデザインと1:1のままです。保存するたびに、あとで戻れるポイントが残ります。有料のPro版は年額€59で、ベータ期間中は初年度が30%オフになります。Pro版は単体で販売しています。

95秒のデモ

Twenty Twenty-FiveでWordPress エディターを試す

動画では、テキストとGoogle Fonts、セクションと色、ブログ記事、「Single Posts」テンプレート、メニュー、写真の差し替えを紹介しています。どの変更も保存され、元に戻せます。

Twenty Twenty-Fiveでのデモ

動画は、再生ボタンを押したときだけYouTubeから読み込まれます。YouTubeで見る。

どのブロックテーマでも

見出しをクリックして、入力して、保存

ブロックテーマでは、Visual Edit Liteのツールバーから、WordPress標準のサイトエディターと投稿エディターを開けます。クリックしたブロックの横には、設定パネルが浮かんで表示されます。ブロック、パターン、テンプレート、グローバルスタイルは、いつものWordPressの操作のままです。コンテンツは標準のブロックとして残ります。ページビルダーではないので、ページの表示がこのプラグインに依存することはありません。

ブロックテーマでのVisual Edit
Twenty Twenty-Fiveのホームページの段落に手書き風のGoogleフォントを適用し、スタイルパネルでサイズの一覧を開いたところ 複製して背景を黄色にした登録セクションと、フォントと色の設定を開いたグループパネル WordPressのエディターで開いた「Single Posts」テンプレートと、投稿コンテンツブロックのパネル 選択した写真と開いた画像パネル。その横に、ページの保存ごとに「Restore」ボタンが付いた履歴

Twenty Twenty-Fiveで動くプラグインの実際のスクリーンショットです。デモ動画から切り出しています。

その場で文字のスタイルを変更

クリックした要素のフォント、サイズ、太さ、大文字・小文字、色を設定できます。Google Fontsのライブラリ全体から選べて、よく使うフォントを最大5つまで手元に置いておけます。

テーマにあるセクションを使う

セクションを複製するか、テーマのパターンから新しいセクションを追加します。色、背景、グラデーションは、CSSを書かずに設定できます。

投稿とテンプレート

ブログ記事も、ページと同じ方法で編集できます。「Single Posts」などのテンプレートを変更すると、すべての投稿に反映されます。

メニューもページ上で編集

メニューが表示されている場所で、ナビゲーションのリンクを移動、追加、削除できます。中身は通常のWordPressのナビゲーションのままです。

メディアライブラリの写真

画像をクリックすると、メディアライブラリの別の画像と差し替えられます。代替テキストの欄も、すぐ横にあります。

どの保存にも戻れる

各ページには、直近10回分の保存(Pro版は最大300回分)と元のバージョンが残ります。テンプレートとグローバルスタイルには、WordPress自体のリビジョン機能があります。

HTMLから変換したサイトで

静的HTMLのサイトも、WordPress エディターでクリックして編集

同じエディターは、静的HTMLからWordPressに変換したサイトでも使えます。まず、HTMLをhtml2wpで変換します。Visual Editが編集するのは、html2wpが作ったテーマです。html2wp-to-gutenbergでネイティブなGutenbergブロックテーマにもう一度変換したテーマも編集できます。この2段階目はまだ実験的な機能で、設定から有効にできます。テキスト、画像、リンク、フォーム、メニューは、ページ上のその場所で編集します。手書きのHTMLから始まったサイトでも、クライアントがコードに触れずに使えるWordPress エディターが手に入ります。ページのマークアップは、その間もデザインと1:1のままです。

変換したサイトでのVisual Edit
変換したWordPressサイトでのWordPress エディターの編集モード:編集できる要素がすべて枠で囲まれ、ポートレート写真の画像パネルが開いている メインの見出しを選択し、フォント、サイズ、太さ、色、文字間隔のパネルを開いたところ ライブプレビューの横にあるAIアシスタントのパネル。読み込んだファイルと編集したファイルの一覧 ページの横にある履歴パネル:保存ごとに時刻とハッシュが表示され、どれでも復元できる

変換したサイトで動くプラグインの実際のスクリーンショットです。

エディション

WordPress エディターの2つのエディション:LiteとPro

Visual Edit Liteは無料で、ライセンスキーは要りません。クリックして編集する機能は、すべて入っています。Proには、制作会社がよく必要とする機能が加わります。Proは単体で、年額€59で販売しています。

 Lite(無料)Pro
クリックしてコンテンツを編集✓✓
フォーム、メニュー、SEO項目✓✓
AIチャットでの編集–✓(自分のAPIキーを使用)
テーマのエクスポート–✓
Turnstileによるスパム対策–✓
AIによる画像編集と、画像からのアニメーション–✓
編集履歴10回分の保存と元のバージョン300ステップ
サイト数に制限なし、キー不要ライセンス1つにつき1ドメイン
ライセンスGPL-2.0GPL-2.0

それぞれの入手方法

Liteは無料でダウンロードできます。WordPress.orgで公開していて、キーもアカウントも要りません。管理画面で「プラグイン」→「新規プラグインを追加」を開き、「Visual Edit Lite」を検索してインストールしてください。WordPress.orgのプラグインページからダウンロードすることもできます。インストールする前に試したい場合は、WordPress PlaygroundのLiteを開いてください。ブラウザのタブの中で動くWordPressが、エディターを開いた状態で立ち上がります。ライセンスはGNU GPLバージョン2以降で、WordPress本体と同じです。自分のサイトでもクライアントのサイトでも、有料の仕事を含めて何サイトでも使えます。登録は不要で、期限もありません。Proで加わる機能はLiteに入っていないので、Liteの中にロック解除するものはありません。

Proは別途購入します。料金ページで、年間ライセンスとして購入できます。無料枠でもProでも、どの変換もLiteを案内します。購入すると、Visual Edit Proのキーがメールで届きます。そのキーを使ってダウンロードページからプラグインをダウンロードし、インストールしたら、WordPressのプラグインに同じキーを入力します。ライセンスが有効な間は、アップデートがWordPress経由で届きます。ライセンスは、一度に1つのドメインに登録されます。別のサイトに移す場合は、先に古いサイトで無効化してください。テーマはライセンスがなくても動きます。

Visual Edit Proのキーはエディター専用です。変換には使えません。編集するテーマは、無料枠またはProでの変換から作られます。

ロックインなし

エディターを外しても、WordPressに残るもの

オフにしても、ページはそのまま

ブロックテーマでは、コンテンツは普通のブロックでできています。HTMLから変換したサイトでは、ページ、ブログ、フォーム、メニュー、SEO、リダイレクトがテーマ自身のコードです。プラグインを削除しても、デザインは残ります。

マークアップは1:1のまま

編集しても、裏でページの構造が組み直されることはありません。変わるのは、クリックした部分だけです。

AIのキーは自分のもの

ProのAIチャット編集は自分のAPIキーで動き、その料金は利用するプロバイダーに支払います。それ以外のエディターの機能は、キーなしで動きます。

履歴があるので、身構えなくていい

どの保存にも戻れます。Liteでは直近10回分の保存と元のバージョン、Proでは300ステップです。

WordPress標準のメニュー、投稿、フォーム

メニューはWordPressのメニューで、ブログはテーマの中にある本物の投稿です。エディターを入れていてもいなくても、これは変わりません。

納品したサイトは外部と通信しない

納品したサイトは、動作中に私たちのサーバーへ接続しません。変換のときはビルド済みのサイトをサーバーにアップロードしますが、納品したサイトは何も送りません。

よくある質問

WordPress エディター「Visual Edit」についての質問

ブロックテーマなら動きます。Twenty Twenty-Fiveのように、テンプレートとパターンで組み立てたテーマなら、そのまま使えます。静的HTMLから変換したテーマでも使えます。html2wpの変換では、エディターに必要なものを毎回テーマに宣言しているからです。従来型のPHPテーマでは、ビジュアルエディターは動きません。ただし、フォーム、メール送信、メーリングリスト、SEO、リダイレクト、llms.txtは引き続き動作します。

静的HTMLのままではできません。変更のたびに、ファイルを編集する必要があるからです。html2wpでサイトをWordPressに変換し、Visual Editエディターを入れれば編集できます。公開中のページで、変えたいテキスト、画像、リンク、フォーム、メニューをクリックして、保存するだけです。Visual Edit Liteは無料で、ライセンスキーは要りません。

いいえ。ページビルダーは独自のウィジェットでページを組み直すので、サイトを表示するだけでもビルダーが必要になります。Visual Editは、フロントエンドで動くWordPress エディターです。すでにページにある要素を、そのまま編集します。ブロックテーマではWordPress標準のエディターの中で動き、コンテンツは普通のブロックのままです。HTMLから変換したサイトでは、ページのマークアップはデザインと同じままです。どちらの場合も、テーマはプラグインなしで表示されます。

サイトはそのまま動きます。ページ、ブログ、フォーム、メニュー、SEO、リダイレクトは、テーマ自身のコードです。プラグインを無効化して消えるのは編集画面だけで、デザインはそのまま残ります。