当サイトを最適な状態で閲覧していただくにはブラウザのJavaScriptを有効にしてご利用下さい。
JavaScriptを無効のままご覧いただいた場合には一部機能がご利用頂けない場合や正しい情報を取得できない場合がございます。
承知しました
本サイトではWebサイトのエクスペリエンスを向上させるために、Cookieを使用しています。Cookieはブラウザの設定から無効にできます。本サイトで使用するCookieについては、プライバシーポリシーをご確認ください。

Blog

ブログ

コンテンツ管理

既存のKontentプロジェクトでWebSpotlightを使用する

By Tomas Nosek  

Web Spotlightは、Webサイトに使用されるKontentプロジェクトに行く正しい方法です。これは、ヘッドレスCMSの利点と、コンテンツ作成者が簡単に操作できる従来のWebファーストCMS視覚化を組み合わせたものです。新しく始めるときは、Web Spotlightを使用するだけで、何も処理する必要はありません。しかし、それをアクティブにしたい既存のプロジェクトがある場合はどうなりますか?

ヴァルハラまでわずか5歩

Web Spotlightは、Webページとそのコンテンツを管理するためのKontentの独立した拡張機能です。これにより、コンテンツ作成者(主にWebエディターとマーケター)は、従来のCMSから慣れ親しんだ方法でコンテンツを作成できます。想像しにくいコンテンツインベントリの代わりに、Webサイトのページツリーを表示して、そこからコンテンツを管理します。

これにより、WebSpotlightはオーサリングエクスペリエンスを容易にします。それでも、KontentはWeb Spotlightの背後にあるエンジンであるため、ヘッドレスCMSのすべての利点を利用できます。また、Web SpotlightはWebに重点を置いていますが、他のチャネルにもコンテンツを使用できます。 Web Spotlightのページツリーは、Webサイト専用の階層を作成します。

これは、 Webサイトのナビゲーションに必要なコンテンツモデルを作成します。これは、新しいプロジェクトに最適です。既存のプロジェクトにはすでに機能するナビゲーションがあるため、それらにはいくつかの調整が必要になります。ただし、変更は複雑ではありません。 NetConstructのKenticoのMVPであるRichardShackletonは、次のようにツイートしています。

始める前に、最初の恐怖を突破しましょう。 Web Spotlightをアクティブ化することにより、既存のプロジェクトと接続されているすべてのアプリは、何も変更されないまま機能します。新しく作成されたコンテンツタイプは、プロジェクトの動作を変更しません。

また、既存のナビゲーションをそのままにして、すべてがセットアップされてテストされたときにのみ新しいナビゲーションに切り替えることができます。

既存のプロジェクトをWebSpotlightに移行するための5つのステップを見てみましょう。

1.適切なナビゲーションオプションを選択します

Kontentは用途が広いため、ナビゲーションを構築する方法は常に複数あります。記事に記載されているように、ナビゲーションには3つのタイプがあります。

  1. ハードコードされたナビゲーション–サイトマップ全体がコード内にあり、特定のコンテンツアイテムに接続されています
  2. 暗黙的に生成されたナビゲーション–サイトマップ全体がコード内にあり、リストを通じて特定のコンテンツタイプに接続されています
  3. 明示的にモデル化されたナビゲーション–サイトマップ全体がコンテンツモデルで定義されます。ビジネスユーザーは、このタイプのみでナビゲーションを手に入れることができます

過去に選択したタイプに応じて、移行パスは異なります。 Web Spotlightを機能させるには、 3)明示的にモデル化されたナビゲーションが必要です。つまり、コンテンツモデルを介してページツリーをモデル化し、コンテンツ作成者は権限に基づいてページツリーを編集できます。

この時点で1)または2)を使用している場合は、新しいプロジェクトの場合と同じように、ナビゲーションロジック全体を作成します。そのためには、 コンテンツモデリングガイドを読み、このチュートリアルをさらに進めることをお勧めします。

明示的にモデル化されたナビゲーションには、2つのサブオプションがあります。 3a)コンテンツとナビゲーションを1つのコンテンツアイテムにまとめて緊密にバインドするか、3b)コンテンツをナビゲーションから個別のコンテンツアイテムに分割します。 3a)は、より単純なプロジェクトに最も適したより単純なオプションですが、3b)は、マルチチャネルまたはオムニチャネルのプレゼンスを持つ企業とそのコンテンツコレクションを選択する方法です。または、少なくともそのうちの1つに対する野心は、モバイルアプリをいつ起動するかはわかりません。

この分離により、互いに影響を与えることなく、プロジェクトの個々の部分に集中できます。開発者とWeb編集者はWebコンテンツに集中でき、他のチームは最終的な場所や使用されているチャネルを気にせずにコンテンツを作成できます。

個別のナビゲーション:ページツリーのページは実際のコンテンツにリンクしています
個別のナビゲーション:ページツリーのページは実際のコンテンツにリンクしています

ただし、どちらのサブオプションもWeb Spotlightで機能するため、どちらに進むかはあなた次第です。

2.ホームページを設定します

Webサイトのページツリーは、そのホームページから始まり、ページを追加するたびに大きくなります。 WebSpotlightのコンテンツでも同じです。 Web Spotlightをアクティブにすると、プロジェクト内にHomepageという名前の新しいアイテムが表示されます。コンテンツサブページの2つの要素があり、入力する必要があります。

Subpages要素で、ページを追加してWebサイトのトップレベルナビゲーションを定義します。 Content要素はリンクされたitem要素であり、ホームページに表示されるコンテンツを指定します。緊密にバインドされたナビゲーション(3a)を使用する場合は、要素を実際のコンテンツの要素に置き換えて、それらに入力します。

ホームページのコンテンツタイプとコンテンツアイテムが既にある場合は、新しく作成したものを調整して、古いものを反映させることができます。

3.ページツリーにページを追加します

Web Spotlightは、ページのページタイプを作成します。コンテンツから分離されたナビゲーション用に準備されています(3b)。新しいページタイプを使用して既存のコンテンツをそれに接続するか、元のナビゲーションを使用してWebSpotlightのナビゲーションにやり直すことができます。

新しいページタイプの使用

この場合、関連する要素を元のナビゲーションから新しいページタイプに移動します。コンテンツで緊密にバインドされたナビゲーションを使用した場合は、サブページやSEOプロパティ(キーワード、説明など)などのサイトマップ固有の要素を移動する必要があります。

個別のナビゲーションがある場合は、すべての要素を新しいページタイプに移動することを意味します。ただし、これが当てはまる場合は、元のナビゲーションを使用することをお勧めします。これは、非常に簡単になるためです。

元のナビゲーションを使用する

ナビゲーションがコンテンツと同じコンテンツタイプであるかどうかに関係なく、リンクされたアイテム要素の代わりにサブページ要素を使用するようにナビゲーションを変更する必要があります。

、それは理にかなっているすべてのコンテンツタイプのために手動でサブページ要素を作成し、元のリンクされたアイテムの要素と同じページにリンクし、あなたがすべて動作することを確認し、元のリンクされたアイテムの要素を削除します。コンテンツが多い場合は、プログラムで2番目と3番目のことを実行して、時間を節約できます。たとえば KontentCLIを使用してこれを支援できます。

ヒント:ローカリゼーションはどうですか?

多言語のWebサイトをお持ちの場合は、最初に1つの言語でページツリーを作成してから、プログラムでサブページを他の言語に移行することをお勧めします。上記と同様に、このタスクにはKontentCLIを使用します。このようにして、多言語プロジェクト全体で共通のページツリーを確立し、各言語のページタイトルを調整します。

4.プレビューを設定します

プレビューを設定しない場合、Web Spotlight(およびKontentも)の利点を最小限に抑えることができます。あなたは逃している。プレビューを使用すると、コンテンツが適合するかどうかを確認するためだけにコンテンツを公開する必要はありません。また、プレビューとWeb Spotlightを使用すると、Kontentでコンテンツを直接ライブ編集できます。

ウェブサイトに独自のURLを持つすべてのコンテンツタイプのプレビューURLを提供して、ページがどこにあるかをKontentに知らせます。たとえば、ランディングページのようなコンテンツタイプにはURLがありますが、画像行動を促すフレーズにはありません。それがその要点です。詳細に飛び込むためのプレビューの設定に関するこのチュートリアルを確認してください。

5.コンテンツのライブ編集を有効にします

これにより、コンテンツ作成者はプレビューから直接コンテンツをライブ編集できます。この機能を有効にするには、新しいKontent Smart Link SDKを使用して、編集可能な要素と呼ばれるクリック可能な領域でWebサイトを拡張します。 SDKは、特定のデータ属性を探すためにWebサイトのHTML出力を調べます。

これらのデータ属性は、プロジェクトIDと言語、ページに表示されるコンテンツアイテムのID、表示されるコンテンツの取得元となる個々のコンテンツ要素などを指定します。

データ属性をSDKと組み合わせると、ページに鉛筆アイコン付きの編集可能な要素が表示されます。

ウェブサイトの管理が楽しいとき

それでおしまい。新しいナビゲーションで動作するようにアプリを切り替えると、すべてが動作を開始します。廃止されたデータでコンテンツが肥大化しないように、後でプロジェクトをクリーンアップすることを忘れないでください。

この変更により、残りの部分について心配する必要はありません。 Web Spotlightは、これまでと同じアクセス許可モデルに従います。そのため、ユーザーはそれ以前と同じようにページツリー内のコンテンツアイテムにアクセスできます。誰かがページツリーにページを作成することを制限したい場合は、作成権限を持たないようにユーザーロールを制限してください。

また、環境で自動的に機能します。したがって、怖がらずに新機能をテストできます。

詳細については、 WebSpotlightのチュートリアルをご覧ください。また、Web Spotlightへの移行に関して他に質問がある場合は、右下のチャットボタンを使用してサポートに連絡してください。

Headless CMSの導入をお考えでしょうか?

クラウドとマルチデバイスに最適化されたKentico Kontentをお試しください