【2024年最新】wixサイトにお知らせ欄を設置する方法を徹底解説!

当ページのリンクには広告が含まれています。
2,023年最新Wixサイトにお知らせ欄を設置する方法を徹底解説

企業サイトでよくある「NEWS]とか「お知らせ」をWixサイトに導入したいんだけどできないの?

こういった疑問にこたえます。

こんにちはろにぃです。Wix歴10年、現在は、

・自分でサイトを運営
・クライアントのサイトの作成、編集、管理
・SEO相談

などクライアントワークの経験を活かして、サイト制作やSEOについて情報発信をしております。

お知らせ欄とは最新情報が一目でわかるコレ↓

wix お知らせ欄

どのサイトを見ても当たり前に設置されている機能だけど、Wixで導入するとつまづくんですよね。ぼくも始めはわからず、試行錯誤して色んな方法を試しました。

実際にサイトに導入してみたところ、このお知らせ欄を自分のWixサイトにも導入したいという反響があまりにも大きかったため解説記事を用意しました。ぜひ最後まで読んで、あなたのサイトにも導入してみてください!

本記事をご覧頂き、不明点がありましたら質問対応いたしますので、ぜひお問い合わせください。

目次

wixサイトにもお知らせ欄は設置でき

wixサイトにもお知らせ欄は設置できる

サイトを見た時、お知らせ欄があるとサイトの更新頻度がすぐにわかりますよね。実はこれってすごく重要。最終更新が数年前だと、

このサイトの情報、古そうだけど大丈夫?

と思いますよね?

大事なのは更新の手軽さ

面倒で時間のかかる作業だと、つい放置したくなりますよね?

あっ、この情報リリースしなきゃ!

と思った時に2・3分でサクッと更新できるくらいであって欲しい。

有料アプリは使用しない

Wixにはたくさんのプラグインアプリがあるのが魅力。でも不具合があったり、アプリひとつでサイト維持費を超えてしまうような金額のものまである。

無料のものだと機能が限られ、使い物にならなかったりもするので、アプリは使わないようにしています。

wixサイトにお知らせ欄を設置する3つの方法

wixサイトにお知らせ欄を設置する3つの方法

Wixサイトにお知らせ欄を導入するため、ぼくが実際にやってみたのは以下の3パターン

  1. Twitterを使う
  2. ブログ機能を使う
  3. コンテンツマネージャーを使う

順に解説していきます。

①お知らせ機能としてTwitterを使う

WixサイトにTwitterタイムラインを埋め込み、お知らせ機能として使用する方法です。

メリット:更新が10秒でできる

Twitterを更新すればサイトに連動しているのでとても簡単にできます。

デメリット:集客としてTwitterが使えなくなる

ツイートが全てサイトに反映されてしまうため、お知らせに関係ないことは発信できなくなります。SNS集客で根強い人気を誇るTwitterを使えなくなるのは痛いので却下。

②ブログ機能を使う

②ブログ機能を使う

Wixブログで「お知らせ」カテゴリーを作り、その1カテゴリーだけを表示する方法。

メリット
①デザインがいい
②スマホで更新できるのでラク

デメリット:レイアウト調整範囲が限られ、1つ1つが大きすぎる

特にスマホで見た時、いくつもお知らせがあると延々とスクロールしなければならなくなります。3つくらいでもまだあるの?と感じてしまうかも。

③コンテンツマネージャーを使う

wix お知らせ 完成

企業サイトでよく見る形をそのまま再現できます。

メリット
①始めにデザインをすれば、更新はexcel入力と変わらない
②更新時に重いWixエディターを開く必要がない
③自由にカスタマイズできる

デメリット:導入がややこしい!

安心してください!この記事で解決できます!!

「Twitterは集客で利用したいし、ブログはカスタマイズが限られるので使いにくいなぁ」

という方はコンテンツマネージャー利用一択です。

更新が簡単なお知らせ欄を作れるコンテンツマネージャーの設置方法

更新が簡単なお知らせ欄を作れるコンテンツマネージャーの設置方法

少し複雑な作業が必要なコンテンツマネージャー。画像を見ながら真似して進めてもらえれば迷わないよう解説していきます。

手順は以下の6ステップ

  1. コンテンツマネージャーのニュースを追加する
  2. コンテンツマネージャーデータを編集する
  3. お知らせ欄のデザインを整える
  4. リピーターとコンテンツマネージャーをリンクさせる
  5. お知らせの表示数を設定する
  6. お知らせ一覧のページの設定をする

①コンテンツマネージャーのニュースを追加する

Wixエディターを開き、コンテンツマネージャーのニュースを追加します。

①メニューのコンテンツマネージャーアイコンをクリックし②プリセットを追加をクリックする
最新ニュースをクリックする

「最新ニュース」をサイトに追加すると、自動的にページが作成されます。

自動でページが既成されます

ページが追加されるとコンテンツマネージャーの編集画面が開く。

②コンテンツマネージャーのデータを編集する

wix お知らせ コンテンツマネージャー編集

ニュースとして必要な項目が自動で作成されているので、不要なものは削除します。

コンテンツマネージャーの不要な情報を削除する

今回はReporter NameとSubtitleは削除します。

次に必要な情報の、

  • Title(お知らせの題名)
  • image(お知らせのアイキャッチ画像)
  • Date(お知らせの発信日)
  • Article Text(お知らせの詳細)

を編集します。

編集する項目をクリックして入力する

これでお知らせ欄に載せたい情報が完成。初期設定では6つのお知らせが作成されるので、不要な分は削除しましょう。

いらない情報にチェックを入れて削除をクリック

次にこのデータをサイトに表示するレイアウトを決めます。

③お知らせ欄のデザインを整える

サイトのトップページ編集画面に移動し、お知らせを設置したい場所へストリップを追加します。

wix お知らせ トップページ

Wixエディターメニューの「追加」から「リスト&グリッド」の「リピーター}を選択。適当にリピーターを選んで追加

メニューからリピーターを選んで追加

追加したリピーターを編集します。

追加したリピーターを編集
wix お知らせ リピーター 編集後

画像で編集したのは、

  1. リピーター、コンテナの幅、高さを調整しストリップ内に収める
  2. 表示されているテキストを1つだけ残し「日付」と編集
  3. 文字だけのボタンを残し、タイトルと編集。リンク先を「News Title」のページに設定
  4. ライン(区切り)の幅を調整

※2 便宜上「日付」としてますが、何でも構いません。コンテンツマネージャーとリンクさせると日付が表示される場所という意味です
※3 タイトルも※2と同様何でも構いません

上記の編集内容はお好みでデザインしてください。疑問に思いそうな点を一旦まとめます。

なんでリピーターを使うの?

リピーターは1番上のコンテナ内を編集すると、連動してしたのコンテナ内も編集されます。一度リピーターで設定してしまえば今後お知らせを追加する際にエディターを開いて編集する必要がなくなります。

追加する要素の「テキスト」と「ボタン」の違いはなに?

ボタンを使うとクリックした際に別のページ移動する設定ができます。

例えば、「タイトルをクリックすると詳細ページに移行する」設定をしたい場合、タイトルをボタンで作ればクリック時の動作設定ができるんです。

ボタンリンクを設置する

ボタンは枠や背景が消せるので、見た目はテキストと変わらないように配置できるんです。リピーターではテキストにリンクを設定できないので、このボタンリンクで対応します。

④リピーターとコンテンツマネージャーをリンクさせる

リピーターに配置したテキスト、ボタンをそれぞれ②コンテンツマネージャーのデータを編集するで作ったコンテンツマネージャーのNewsとリンクさせます。

データに接続アイコンを選択
接続先を設定する

各項目を割り当て、プレビューを確認すると、

wix お知らせ 完成

設定した通り表示され完成です。

⑤お知らせの表示数を設定する

古い情報が延々と並んだら見栄えが悪いですよね?新しい情報だけを表示するよう、表示数を設定します。

リピーター内にあるデータセットのアイコンをクリック、設定から「表示するアイテム数」をお好きな数にセットします。

お知らせ欄17

画像では3つに設定したので、新しいお知らせから3つ目までしか表示されなくなりました。古い情報はわざわざ消さなくてもサイトには表示されません。

⑥お知らせ一覧ページの設定

トップページのお知らせ欄には3つだけ表示されればいいんだけど、過去のお知らせを全て確認できるようにしたい場合どうしたらいい?

ボタンリンクを設置して、お知らせ一覧ページ(News All)に飛ばすのがおすすめです。

ボタンリンクを設置して、お知らせ一覧ページ(News All)に飛ばす

ボタンはリピート内に設置すると複数表示されてしまいます。リピート外に設置してください。

ボタンをクリックすると一覧のページに移行します。

wix お知らせ 一覧完成

あとは③お知らせ欄のデザインを整えると同様、News(All)とNews(Title)のページデザインを整えます。

News(Title)ページにはテキストとリッチコンテンツをリンク接続しておけば、

  • 見出しの設定
  • 画像や動画の挿入

など、ブログのような編集がエディターを開かなくてもできます。

wix お知らせ テキストとリッチコンテンツ
テキストにAricle Text(リッチコンテンツ)を接続
wix お知らせ リッチコンテンツ編集
エディターを開かずダッシュボードのコンテンツマネージャーから装飾も可能なお知らせ本文の入力が可能

今後の更新はWixダッシュボードにあるコンテンツマネージャーで情報発信をするだけ。とてもかんたんに更新できるようになりました。

まとめ

最後にまとめます。

wixサイトにもお知らせ欄は設置できる
  • 手軽さが重要
  • 有料アプリは不要
wixサイトにお知らせ欄を設置する③つの方法
  • Twitterを使う
  • ブログ機能を使う
  • コンテンツマネージャーを使う
更新が簡単なお知らせ欄を作れるコンテンツマネージャーの設置方法
  1. コンテンツマネージャーのニュースを追加する
  2. コンテンツマネージャーデータを編集する
  3. お知らせ欄のデザインを整える
  4. リピーターとコンテンツマネージャーをリンクさせる
  5. お知らせの表示数を設定する
  6. お知らせ一覧のページの設定をする

以上について解説してきました。更新が面倒でつい放置しがちになるWixサイト。これでラクに更新できるようになりwebサイトからの情報発信も気軽にできます。ぜひ活用ください!

本記事を読んだけど、

  • 自分でできる気がしない
  • 自分でやる時間がない

という方向けにWixサイトの修正代行を承っています。希望される方はぜひご相談ください!

今回紹介した方法以外のWixサイトを充実させる方法はコチラ↓

▶ 【必見】Wixサイトに使いたくなる編集テクニック10選

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

コメント

コメント一覧 (13件)

  • 初めまして、こちらのサイトで
    お知らせ一覧の作成方法通りやったのですが
    リピーターにリンクを繋げても表示されませんでした。
    これはwixサイトのバグなのか、それとも
    何か間違えたのかよく分かりません。

    教えて頂けたら幸いです。

    • 中山様
      はじめまして、お問合せありがとうございます。
      リピーターのテキスト、ボタン(記事内の日付、タイトル)はそれぞれ対応するデータに接続されていますでしょうか?
      エディター上で更新されなくてもプレビューで見ると更新されているということは時々あります。

  • 初めまして、とても分かりやすい解説で大変助かります。
    ありがとうございます。
    私もリピーターにリンクを繋げても表示されないのですが、これは「公開前」だからでしょうか?
    公開したら表示されるのでしょうか?

    • 久保田 様

      はじめまして、コメント有難うございます。
      製作中、以下のメッセージが表示されるかと思います。

      コンテンツマネージャーメッセージ

      一度公開をしてお試しください。
      公開するのが都合が悪い場合、再度非公開にすることも可能です。

  • 記事の更新ありがとうございました!
    こちらの更新して頂いたおかげでずっとつまずいていたお知らせ欄を作ることができ、
    HPが一段グレードアップできました!!
    大変参考になりました。
    今後よろしければwix内機能でできるSEO対策も記事化して頂けたら大変ありがたいです!

    • めぐる 様

      コメント有難うございます!
      wixでできるSEO対策、よくご相談頂きます。
      記事化、検討してみます!

  • 初めまして。わからない部分があったので、詳しく教えてください。

    リピーターを追加してから、「編集した内容は以下の通り」の部分の、編集した内容を教えてもらえるとありがたいです。あまり使い慣れていないので、わかりやすく教えてもらいたいです。

    よろしくお願いします。

    • 編集した内容は以下の通りの下に記載の
      ・リピーター、コンテナの幅、高さを調整しストリップ内に収める
      ・表示されているテキストを1つだけ残し『日付』と編集
      ・文字だけのボタンを追加し、タイトルと編集。リンク先を『News Title』のページに設定
      ・ラインの幅を調整
      が編集した内容になります。
      不明な点はどこになりますでしょうか?

      • 具体的にには「表示されているテキストを1つだけ残し『日付』と編集」からしたの部分になります。
        よろしくおねがいします

        • その文章の上の画像と全く同じように、
          コンテナにテキスト(画像の日付)とボタン(画像のタイトル=こちらはテキストではなくボタンを配置し、背景、枠線を透明にして文字だけを残す)を配置します。
          リンクの設定については2つ下の画像の通りとなります。

  • 初めまして。リッチコンテンツをリンクする方法が分かりません。詳しく教えて頂けないでしょうか?よろしくお願い致します。

    • SAMU様
      はじめまして、コメントありがとうございます。
      リッチコンテンツはお知らせの個別ページの編集画面で『メニューの追加』⇒『コンテンツマネージャー』⇒『リッチコンテンツを追加』を選択すると追加されます。
      追加されたリッチコンテンツを『データに接続』⇒『データセットを選択』⇒『リッチコンテンツを選択』
      これでリンク設定の完了となります。

SAMU へ返信する コメントをキャンセル

CAPTCHA


日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

目次