LikePay Academyが「スーパーサイトAcademy」に変わりました。詳しくはこちらです。

ダイナミックコンテントの概要

静的コンテンツと動的コンテンツの説明

この投稿は公式のWebflow Universityを元に作成しました。翻訳したテキストと画像は引用元のものを使用する場合があります。引用元はこちらです。

静的コンテンツと動的コンテンツは、ウェブサイトを構築する際に使用する2つのコンテンツのタイプです。静的コンテンツはCMSに接続されていないコンテンツを指し、一方で動的コンテンツはCMSに接続されているコンテンツを指します。

このレッスンで学ぶこと

静的コンテンツ

静的コンテンツは、手動で更新する必要があるコンテンツを説明します。静的コンテンツを含む要素には、一括してスタイルを適用できるクラスを使用できますが、静的コンテンツ自体は手動で管理する必要があります。静的コンテンツは、スタンドアロンのページ例:404エラーページ、サイトのホームページ、パスワードページ)で有用です。

ただし、ブログ、デザインポートフォリオ、または常に変化する類似のコンテンツを表示するウェブサイト(例:ニュースサイト)を作成しようとする場合、静的コンテンツはあまり実用的ではありません。例えば、ブログはしばしばブログ投稿に同じフォーマットを使用しますが、各ブログ投稿をサイト上で作成しデザインする必要があると非効率です。

こうした場合や他にもたくさんの場面で、静的コンテンツを使用すると大量のコンテンツを手動で複製して変更する必要があります。ここで動的コンテンツが役立つ場合があります。

動的コンテンツ

動的コンテンツは、Webflow CMSのデータに接続されている、変化するコンテンツを指します。動的コンテンツを使用すると、デザインがCMSのデータにリンクされるため、複数のコンテンツインスタンスを一度に更新できます。

たとえば、「blog posts」というコレクションに対して動的なコレクションテンプレートページを使用すると、デザイナー内の1つの場所でテンプレートページのデザインを調整できます。これにより、サイト上の各ブログ投稿のデザインも更新されます。これは、同じコンテンツが何度も繰り返されるサイト(例:ブログ、ニュースサイト、チームメンバーの伝記)に非常に効率的です。

テキスト要素は、"Portfolio items "と呼ばれるコレクション内の "Name "フィールドに動的に接続されます。text要素には、"Name "フィールドの内容が自動入力されます。

目次

あなたもNoCodeのプロに

充実したサポートであなたも、最短3ヶ月間でノーコードWeb制作のプロになれます。

  • 300以上のノーコード動画教材

  • チャットサポート

  • 個別ビデオ通話相談