WordPressエディター対決：HTMLエディターとビジュアルエディター、どちらがいい？

コンテンツの編集は、ワードプレスの不可欠な部分です。HTMLエディタ高度なカスタマイズとページレイアウトの制御を必要とする開発者に最適です；ビジュアルエディターコードを知らない一般ユーザーにも最適で、簡単に素早くコンテンツを編集できます。適切なエディタを選ぶことで、あなたの記事やページを2倍効果的にすることができます！今日は HTMLエディタ 歌で応える ビジュアルエディターあなたに最適なウェブサイト編集ツールを素早く見つけるのに役立ちます。

1.WordPressのHTMLエディタとは何ですか？

ワードプレス HTMLエディタ はHTMLコードを直接編集できるプレーンテキストエディタです。バックエンドで投稿やページを編集する際、HTMLエディタを選択すると、ページのソースコードを見ることができ、直接修正することができます。

つまり、HTMLタグ、CSSスタイル、JavaScriptコードなどを直接入力したり修正したりして、ページの表示をコントロールすることができる。図のように、これが表示されているHTMLエディターです。

HTMLエディタの機能：

ソースコードの直接編集ページの構成やレイアウトを正確にコントロールできます。
高いカスタマイズ性HTMLコードを編集することで、カスタムフォームやサードパーティ製ウィジェットの埋め込みなど、高度な機能を実装することができます。
コーディング経験者向け開発者、または開発者をお持ちの方 HTML 基本的なユーザーであれば、HTMLエディターの方がより柔軟性があります。

HTMLエディタの使用シナリオ：

カスタムページHTMLエディターは、高度にカスタマイズされたページコンテンツが必要な場合に最適です。
サードパーティのコードを埋め込む例：YouTube動画、Googleマップ、広告コードの埋め込みなど。
正確なレイアウト調整HTMLエディターは、ページの構造やレイアウトを完全にコントロールする必要がある場合に、より自由度が高くなります。

2.WordPressビジュアルエディタとは？

ワードプレス ビジュアルエディター(例 グーテンベルク・エディター 別名 ブロックエディタである。見たままが得られる（WYSIWYG）(WYSIWYG)エディターで、グラフィカルなインターフェイスで簡単にコンテンツを編集することができます。HTMLやコードを知らなくても、コンポーネントをドラッグ＆ドロップするだけでページをデザインできます。ビジュアルエディタでは、編集中のコンテンツのスタイルやレイアウトを直接確認できるため、直感的な操作が可能です。

ビジュアルエディター機能：

見たままが得られる（WYSIWYG）ソースコードを見ることなく、変更点を直接確認することができます。
シンプルなドラッグ＆ドロップ機能ブロックを追加、削除、調整することで、ページのコンテンツを構築することができます。
コーディング経験のないユーザーにも最適HTMLの基本的な知識がなくても、ユーザーは簡単にビジュアルエディターページや記事の作成

ビジュアルエディターの使用シナリオ：

迅速なコンテンツ編集: 深いカスタマイズを必要としない、日常的な記事やページの編集に適用されます。
コンポーネントをドラッグ＆ドロップしてページを構築例えば、画像ブロック、段落ブロック、ボタンブロックなどを使って、素早くページをレイアウトすることができます。

ワークフローの合理化一般ユーザーやブログライター、特にプログラミング経験のないウェブマスターに適しています。

3.ワードプレスのHTMLエディターとビジュアルエディターの比較

官能性	HTMLエディタ	ビジュアルエディター
操作方法	ソースコードを直接編集し、HTML、CSS、JavaScriptを手動で修正します。	WYSIWYG（What You See Is What You Get）ドラッグ・アンド・ドロップ・ブロックによる直接コンテンツ編集
カスタマイズ性	高度なカスタマイズのためのフルカスタマイズ可能なページレイアウト	一般的なコンテンツ編集は比較的簡単だが、カスタマイズ性は低い
該当ユーザー	開発者またはHTMLの知識を持つユーザー向け	プログラミング初心者や経験の浅いユーザーに適している
実用的なコンテンツ	HTMLタグ、スクリプト、スタイルなど、すべての詳細を制御する	テキスト、画像、ボタン、その他の要素を主にプリセットブロックで編集
お点前	高度な機能を実行し、ページのあらゆる部分をコントロールできる。	主にページレイアウトとコンテンツのプレゼンテーションに重点を置く。
ラーニングカーブ	HTML/CSSの知識が必要。	使いやすく、コーディングの経験は不要
適用シナリオ	カスタム設計、外部コードの組み込み、開発者による修正	迅速なコンテンツ公開、ブログ記事、シンプルなページレイアウト
リアルタイムプレビュー	効果を確認するには、手動でページを更新する必要があります。	リアルタイムプレビュー、コンテンツ編集時に効果をすぐに確認できる

4.いつHTMLエディターを選び、いつビジュアルエディターを選ぶのですか？

HTMLエディターシーンを選択します：

ページのカスタマイズに対する高い需要手動でレイアウトを調整したり、カスタムコードを埋め込むなど、ページの構造を完全にカスタマイズする必要がある場合は、HTMLエディターが最適です。
サードパーティのコードの埋め込みが必要HTMLエディタは、広告コード、フォーム、サードパーティウィジェットなどを埋め込むための柔軟性を提供します。
複雑な機能の開発ページが特定のスクリプトや機能を必要とする場合はHTMLエディタコードを直接操作して、より複雑な効果を得ることができます。

ビジュアルエディタのシーンを選択します：

迅速なコンテンツ編集ビジュアルエディタを使えば、時間と労力を節約できます。
プログラミング経験を必要としないユーザーコードの書き方がわからなかったり、手作業でページをいじりたくない場合はビジュアルエディターより直感的でわかりやすくなるだろう。
シンプルなデザイン単純にテキストや画像、ボタンなどを追加するだけなら、ビジュアルエディタの方が十分な柔軟性があり、使いこなすのも簡単です。

5.GutenbergビジュアルエディターでHTMLモードに切り替える：自由と視覚化の橋渡し

WordPressのGutenbergエディタは、その場でページを構築するWYSIWYG（What You See Is What You Get）アプローチで知られているが、同じように強力なHTML編集機能を保持している。必要なときにいつでもコードビューに切り替えることができ、ブロックやページ全体をより細かくコントロールできる。この柔軟性は、最新のWordPress編集体験のハイライトのひとつです。

1.HTMLモードに切り替える方法（ブロックレベル）

特定のブロックに対してのみHTML編集を行いたい場合は、そうすることができる：

Gutenbergビジュアルエディタでブロック.
ブロックの右上にある3つの点のアイコン（その他のオプション）をクリックします。
オプション "HTMLに編集".
この時点で、ブロックのHTMLコードが表示されます。
変更が完了したら、再度「ビジュアライゼーションとして編集」をクリックし、元のビューに戻ります。

🔧 適用されるシナリオ

スティック <span> もしかしたら <スタイル などの特別なラベルが貼られている。
画像のプロパティやボタンのスタイルを正確に調整します。
カスタムクラス、データ属性などの追加

2.全ページHTML編集モード（コードエディター）に切り替える方法

記事やページ全体のソースコードを統一的に変更したい場合は、以下の手順に従ってください：

エディターの右上隅で 縦3点メニュー(その他のツールとオプション）。
オプション 「コードエディター(コードエディター）。
ページ全体のコンテンツはHTML形式に変換され、すべてのブロックのコードを直接修正することができます。
終了したら、右上をクリックして再び「ビジュアル・エディター」に戻る。

⚠️ 注意事項

コードエディターで変更を加える場合は、特に構文エラーに注意してください。
グローバルレイアウトの微調整、スキーマタグの追加、入れ子構造の調整などに最適。

3.なぜこの機能が重要なのか？

この「視覚化とHTML編集のシームレスな切り替え」機能により、WordPressは初心者に適しているが、上級者に限定されないオーサリングプラットフォーム。つのエディター間で何度も何度もコピー＆ペーストする代わりに操作の視覚化に基づいて、コードで詳細をさらに絞り込むことができる。これは、多くのウェブ開発者やコンテンツ制作者が求める最も重要なことのひとつである。

6.まとめ

WordPressが提供する2つのエディターには、それぞれ利点がある。HTML エディタ高度なカスタマイズとページレイアウトの制御を必要とする開発者に最適です；ビジュアルエディターコードの書き方を知らない一般ユーザーでも、簡単に素早くコンテンツを編集できる。

どのエディタを選ぶかは、すべてあなたのニーズ次第です。ページを正確にコントロールし、コードを操作したいなら、HTMLエディタが最適ですし、シンプルさと効率的な編集体験を重視するなら、ビジュアルエディタが適しています。

この記事が、HTMLエディターとビジュアルエディターの違いを理解し、ニーズに応じて選択し、ウェブサイトコンテンツの編集効率を向上させる一助となれば幸いである！

お問い合わせ
チュートリアルが読めない？無料でお答えします！個人サイト、中小企業サイトのための無料ヘルプ！	カスタマーサービス WeChat
① 電話：020-2206-9892
② QQ咨询：1025174874
三 Eメール：[email protected]
④ 勤務時間: 月～金、9:30～18:30、祝日休み