Editorでは、シンプルなインターフェイスでコンテンツを更新・追加できます。Designerのような複雑さを必要としないクライアントやチームメイトに最適です。
ウェブサイトを構築・デザインするデザイナーとは異なり、エディターではあなたとワークスペースのメンバーだけがコンテンツを編集・管理できます。エディターはシンプルなインターフェイスで、公開されたウェブサイトを管理するためのいくつかのツールを提供します。
また、コンテンツエディターにアクセスすることで、デザインを崩すことなく、クライアントに自分のサイトを管理してもらうことができます。このレッスンでは、コンテンツエディターがエディターにアクセスする方法と、ログインに関する問題のトラブルシューティング方法について詳しく説明します。
このレッスン学ぶこと：
Webflow Editorは、サイトを公開した後（webflow.ioステージングサブドメインまたはカスタムドメイン）にアクセスできます。Editorでは、サイトのコンテンツをページ上で直接編集したり、エディタパネルでページやコンテンツを管理することができます。
Webflow ダッシュボードまたはDesignerでサイトをデザインしている場合、次のいずれかの方法でEditorにアクセスできます：
コンテンツエディターは、ブラウザのアドレスバーでウェブサイトのURLの最後に/?editを追加することで、自分のウェブサイトのEditorにアクセスすることができます（例：yourwebsite.com/?edit）。一度ログインすると、エディターモードでウェブサイトにアクセスできます。
サイトに戻ると、右下に "Edit site "ボタンが表示され、これをクリックするとエディターモードに移行できます。
エディターを利用するには、ブラウザでサードパーティからのクッキーを受け入れるように設定する必要があることを、コンテンツ編集者に伝えてください。エディターへのログインエラーのトラブルシューティングについては、こちらをご覧ください。
Webflow は、Chrome、Edge、Firefox、Safari を含むすべての最新ブラウザの最新3バージョンで Designer を正式にサポートしています。
ブラウザのサポートの程度は、使用する機能によって異なります（例:フィルターは Edge で部分的にサポートされます）一部のブラウザでサポートが制限されている機能については、関連記事で詳細をご覧いただけます：
Webflow は Internet Explorer をサポートしていません。Webflow で作成されたサイトは、最新の Web ブラウザでサポートされているすべての業界標準機能を引き続きサポートしますが、Internet Explorer でサイトが正しく機能することは保証できません。Internet Explorer サポート終了の詳細については、こちらをご覧ください。
プロTip：What's My Browserでブラウザとオペレーティングシステムのバージョンを確認できます。
Editorを開くと、プレビュー・モードまたは "ライブ・サイト "モードでサイトを探索することができます。Editorモードに切り替えるには、ページ右下の「Edit site」ボタンをクリックします。
プレビュー・モードでサイトを見たい場合は、"Back to live site "をクリックしてください。
Editorにログインしようとしたときにエラーメッセージが表示される場合は、次のいずれかの対処法をお試しください：
注意: サイトにカスタムコードがある場合、カスタムコードがエディターに影響することがあります。これはエディタが公開されているサイトの上にレンダリングされるために起こります。カスタムコードを削除するか、無効にしてみてください。
Editorでは、複数のチームメンバーやコンテンツエディターが、静的および動的なサイトコンテンツを同時に編集できます。2人が同時に同じコンテンツを編集した場合、最後に編集した方が優先されるため、チームメイトやコンテンツ・エディターと編集時間を調整する必要があります。エディターにはサイト・アクティビティ・ログも用意されているので、サイトを公開する前に、誰がどのような編集を行ったかを確認することができます。
Editorと同様に、サイトのデザインを編集する場合は、Designerでチームメンバーとコラボレーションできます。Webflow Designer でコラボレーションについては、こちらをご覧ください。
Editorにアクセスすると、Editorツールバー（グレーのバー）が画面下部に表示されます。このツールバーを通して、ページ設定、ダイナミックコンテンツ、フォーム、あなたのエディターアカウントを管理するための様々なエディターパネルにアクセスすることができます。また、エディターを通して行った変更を確認し、公開することもできます。
エディターツールバーには以下のタブとアイコンがあります：
メニュー - このメニューを使用して、ダッシュボード、サイト設定、またはデザイナーに移動します。このボタンには Webflow のロゴが表示されます。
ページ - ［ページ］パネルが開き、サイトの静的ページと動的コレクション ページが一覧表示されます。ここから、ページを参照したり、クリックしてライブ ページを表示したり、ページの設定を管理したりできます。
コレクション - すべてのコレクションを一覧表示するコレクションパネルを開きます。コレクションをクリックすると、ツールバーの新しいタブが開き、そのコレクション内の全アイテムのリストであるコレクションアイテムパネルが開きます。ここで、アイテムを編集したり、新しいアイテムを作成したりできます。これはDesignerのCMSパネルとよく似ています。CMSパネルについてはこちらをご覧ください。
Forms - Formsパネルを開き、サイト上で送信されたフォームを確認したりダウンロードしたりできます。
アカウント設定 - アカウント設定パネルを開き、コンテンツエディターアカウント情報の編集やプロフィール画像のアップロードができます。
ヘルプ＆サポート - ヘルプ＆サポートパネルを開きます。
ログアウト - 確認後、エディターからログアウトします。
ライブサイトに戻る - エディターモードからライブサイトモードに切り替えます。
保存/セーブ - すべての変更はエディターに自動的に保存されます。エディターでサイトに変更を加えると、"Saving... "または "Saved "ステータスが表示されます。
変更履歴 - 左下の公開ボタンの横に未公開の変更履歴が表示されます。変更履歴をクリックすると、未公開の変更があるアイテムやページのリストが表示され、どのコンテンツエディターやワークスペースメンバーが変更を行ったかを確認できます。
公開 - エディターで行ったすべての変更を公開できます。
Editorを使ってページ上で編集することができます。様々な要素にカーソルを合わせると、編集可能な要素の右上に「鉛筆」アイコンまたは「画像」アイコンが表示されます。これらの要素を編集するには、アイコンをクリックするだけです。
注意: スタイリングやカスタムコードの一部は、公開されたサイトでは表示されません。これはエディタでの通常の動作です。
編集可能なテキスト要素にカーソルを合わせると、テキスト要素の周囲に薄いグレーの輪郭が表示され、右上に「鉛筆」アイコンが表示されます。ボックス内をクリックすると、テキストを編集できます。
単語や語句を選択し、表示されるフローティングツールバーから書式を選択することでも、書式を設定できます。インラインテキストの書式設定についてもっと読む。
Rich text要素では、メディアの追加、リストの作成、スタイルの設定、テキストの書式設定など、さらに多くのことができます。リッチテキスト要素についてさらに詳しく
サイト上で画像を入れ替えることもできます。差し替えたい画像にカーソルを合わせ、「Image」アイコンをクリックしてください。これにより、あなたのコンピューターから新しい画像を選択してアップロードすることができます。
注意：デザイナーで要素に作成したビジュアル・スタイル（ベタ塗り、ボーダー・カラー、シャドウなど）は、エディタで置き換えた画像や背景画像に自動的に適用されます。
ボタン要素を編集するには、ボタンにカーソルを合わせ、右上に表示される設定の「歯車」アイコンをクリックします。
2つのオプションが表示されます：
リンク設定の編集 - ボタンのリンクを更新できます。テキストを編集する - ボタンのテキストを変更できます。
Editorのページパネルから、SEOメタタイトルと説明、Open Graph TitleとDescriptions、Open Graph Imageなどの重要なページ設定を管理できます。また、静的ページのパスワード保護設定やコレクションページのRSSフィード設定も管理できます。
ページの設定にアクセスするには
検索バーを使ってページ名で検索することもできます。
注：「Settings」ボタンではなく、ページをクリックすると、「Page」パネルが閉じ、対応するページが開きます。
サイトにコレクションがある場合、Editorでコレクションタブからアクセスできます。コレクションパネルには、すべてのコレクションが表示されます。コレクションをクリックすると、コレクション名と同じタイトルの新しいタブが開きます。このタブには、そのコレクション内のすべてのコレクションアイテムが含まれます。
既存のアイテムをクリックして編集したり、「New」ボタンをクリックして新しいアイテムを作成し、アイテムの様々なフィールドに入力することができます。
コンテンツの入力やフィールドの更新が終わったら、次のことを選択できます：
コレクションアイテムの作成と公開の詳細については、こちらをご覧ください。
アイテム名の右にある「page」アイコンをクリックすると、そのアイテムのCollectionページを表示できます。これにより、パネルが折りたたまれ、現在表示しているアイテムのページがブラウザに表示されます。必要であれば、パネルではなく、そこで編集することができます。
コレクションアイテムのリストに戻るには、[戻る] ボタンをクリックします。
コンテンツの管理Collectionパネルでは、すべてのCollectionアイテムとそのステータスを確認できます。コンテンツの大規模なデータベースを扱う場合、Collectionアイテムの管理は、編集対象を決定する際の救世主となります。次の方法でこれを行うことができます：
コレクションアイテムの管理についてもっと読む。
コレクションタブを閉じるには、タブ右上の「閉じる」（X）ボタンをクリックします。
変更をすべて行った後、それらを表示し、保存され、パブリッシュする準備ができていることを確認してから、Publishをクリックしてください。
エディターで作業中は、エディターパネルがウェブサイトの大部分を覆います。エディターパネルを折りたたんでウェブサイトを表示するには、上部にある「View site」ボタンをクリックしてください。
このビューでは、通常と同じようにウェブサイトを閲覧し、任意のページに変更を加えたり表示したりすることができます。
エディターで行った変更は、編集した項目を個別に公開するか、Publishボタンを押してすべてのstaged changesを公開するまで、本番サイトには反映されません。サイトが実際に公開される前に、すべての変更を公開するかどうかを確認する必要があります。緑色のPublishボタンで確認できます。
重要：Editorから公開すると、webflow.ioステージングドメインとカスタムドメインの両方に公開されます。これを避けるには、Designerまたはsite settinfsからPublishしてください。
サイトにフォームがある場合、エディターには「Form」タブがあります。ここでは、フォームから送信された基本的な情報を見ることができますが、フォームデータ全体をダウンロードする場所として最も便利です。ダウンロードしたCSVファイル（主要なスプレッドシートアプリで動作するフォーマット）では、送信されたすべての情報を見ることができます。
デフォルトでは、あなた、ワークスペースのメンバー、コンテンツエディターは、エディターを使ってライブサイトのすべてのコンテンツを編集できますが、必要に応じてコンテンツエディターが編集できないようにすることもできます。
また、Command + Shift + L（Macの場合）またはControl + Shift + L（Windowsの場合）を使用して、選択した要素のコンテンツエディタを切り替えることもできます。
重要：CMSエレメントは常にエディターで編集可能です。
役立つ情報：User Accountsのユーザーと設定を管理する機能はEditorにはありません。代わりに、デザイナーまたはAPIを使用する必要があります。
WorkspaceサイトにCMS、ビジネス、またはEコマースのサイトプランがある場合、コンテンツエディタを招待して、サイト上で共同作業を行うことができます。Editorでサイトを開き、コンテンツを編集し、変更をステージングするだけでなく、コンテンツエディタは CMS コンテンツを追加し、ページ設定を編集できます。
コンテンツ エディターには、ワークスペース メンバーとは異なる公開権限もあります。 コンテンツエディターの公開権限についてはこちらを参照してください。
