CREAMサポートブログ | はじめてのメディアサイト運用に

広告にもデザインにも活用!「ウィジェット」の使い方

広告にもデザインにも活用!「ウィジェット」の使い方

バナー画像や広告タグを配置するための機能のひとつ、『ウィジェット』を紹介します。トップページやカテゴリー記事一覧トップなどに表示されるエリアを管理できます。コンバージョン促進など、自由なアイデアで活用していただきたい機能です。


コンバージョン促進に活用する機能のひとつ

Webメディア(オウンドメディア、ブログメディア、記事メディア、バーティカルメディアなどの総称です)では、ビジネス上のゴール(=コンバージョン)として主に3パターンが考えられます。

①自社のブランディングや会員囲い込み
②自社サービスサイトへの送客、メルマガ登録への誘導
③広告収益(アドネットワーク、アフィリエイト、純広告)

このうち、メディア構築CMS「CREAM」の導入例が多いのは②と③です。
②の場合には送客誘導用のバナーを、③の場合には広告タグを、メディアサイトの各ページ内に配置できることがメディア構築CMSに必須の機能です。

CREAMではバナーや広告タグを配置するための機能を3種類、標準で用意しています。
『ウィジェット』トップページなどに表示されるウィジェットの管理
『記事専用ウィジェット』記事ページに表示されるウィジェットの管理
『コンテンツウィジェット』記事ページ内の各見出し部分に表示されるウィジェットの管理

今回のこの中で、一番基本的な『ウィジェット』の使い方を紹介します。

「ウィジェット」の使い方 - 誘導バナーを設置する場合

例えば、PC表示トップページの右カラムに誘導バナー画像を設置する場合を例にして説明します。

右カラムのランキング下にある赤枠で囲ったバナーです。

管理者権限でログインして、CREAMの管理画面トップから、「ウィジェット」アイコンを開きます。

「HOME,その他 ウィジェット枠」ページで、左上のタブ「PC」が選択されていることを確認します。

トップページのイラストから、右カラムのランキング下は「4」番の枠であることを確認します。

右側の4番の「編集」ボタンを押します。

開いた画面の入力フォームに、画像を表示するHTMLタグとリンクのHTMLタグを記載します。

「変更」ボタンを忘れずに押します。

バナー画像のアップロードからURLの取得、必要なHTMLの説明については、以下の記事を参考にしてください。

【初心者向け】メディアCMSで送客誘導バナーを設置する方法 | CREAMサポートブログ

https://media.cream-cms.com/blog/articles/20

企業ブログなど、会社やサービスの認知拡大を目的とするWebメディアサイトでは、誘導のバナー画像を貼ることがよく行われます。バナー画像のリンクはアフィリエイト広告でも使います。初心者向けにメディア構築CMSで設定する方法を優しく紹介します。

同様に、Google広告(AdSense)などアドネットワーク広告の広告タグを登録することで、指定の場所に広告を表示することも簡単にできます。

「ウィジェット」の使い方 - 1stビューのデザインを変更する場合

通常のモバイル表示のトップページは、このように「特集」にセットした記事のサムネイル画像がページ上部に表示されています。

はじめに目に入ってくる重要な場所で「1stビュー」と呼ばれます。「最初に見て感じる印象的な画面」を意味します。

1stビューを意識して、独自画像を設置することでデザイン変更を行う方法を説明します。

管理画面トップの「画像管理」から。

対象の画像をアップロードして、「画像URL」をコピーしておきます。

管理画面トップの「ウィジェット」から。
「HOME,その他 ウィジェット枠」ページで、左上のタブ「モバイル」を選択します。

トップページのイラストから、ヘッダー下エリアは「1」番の枠であることを確認します。

右側の1番の「編集」ボタンを押します。

開いた入力フォームに、「画像URL」でコピーしておいたURLを貼り付けます。

imgタグが適切な表示になるよう、HTMLタグを整えます。

「変更」ボタンで保存します。

管理画面トップの「特集」から。

特集一覧の画面から「設定」ボタンを押します。

特集編集ページから「公開」のチェックを外します。

「特集」の表示をOFFにすることで、ヘッダー下には対象画像のみが表示されます。

※「特集」の非公開はPC/モバイル共通に作用します。ウィジェットへの画像配置も同様にPC/モバイルとも対応することをおすすめします。

「ウィジェット」の高度な使い方

「ウィジェット」は、HTML、CSS、JavaScriptを記述することができます。そのため、自由度高く、Webコンテンツを配置することが可能になっています。

例えば、1stビューのエリアに「横スクロールのスライダー」を用意することも可能ですし、外部サービスのブログパーツなどを配置することもできます。

コンバージョンの促進という目的では、資料請求ページへ誘導するボタンを配置したり、最新ニュースをアナウンスしたリンクを配置することも効果的でしょう。

まさに、そのような活用事例がありましたので、以下をご覧ください。

manamina[マナミナ]まなべるみんなのデータマーケティング・マガジン

https://manamina.valuesccg.com/

マナミナ(まなみな)は「まなべるみんなのデータマーケティング・マガジン」。変化の激しい市場環境を把握し消費者のニーズを紐解く「リサーチ&プランニング」を切り口としたマーケティング情報メディアです。旬なテーマの市場調査や、アンケート・行動ログ分析にもとづく消費者インサイトの調査結果をわかりやすく解説。検索キーワードやアプリのランキングデータも無料で公開します。

ほかにも、「ウィジェット」に入れるHTMLやCSSを駆使することで、独自のグローバルメニューを実現したり、外部のWebコンテンツを取得表示してポータルサイト風にデザインしたり、アイデア次第でさまざまな活用ができます。

HTML、CSS、JavaScriptの記述については弊社サポート対象外ではありますが、すぐに確認できる入力フォームが用意されている点では試行錯誤しやすいかと思います。

ぜひ、自由なアイデアで活用していただけましたら幸いです。

CREAMに関するお問い合わせはこちら

お問い合わせ・資料請求は下記のフォームからお気軽にお申し付けください。

CREAMお問い合わせフォームへ
不用品回収 タスクル

関連する投稿


CREAM管理『デザイン設定』について

CREAM管理『デザイン設定』について

『デザイン設定』では主にサイトのHOME画面の見た目を調整します。


サイト内で使う画像をアップロードする「画像管理」の使い方

サイト内で使う画像をアップロードする「画像管理」の使い方

管理画面の「画像管理」メニューでは、サイト内で使う画像をアップロードすることができます。バナーやよく使う画像など、サイト全体で共有したい画像を登録しておきましょう。 また、ウィジェットやページ作成で画像を表示するときにも「画像管理」を使います。 「画像管理」での画像の登録の仕方と便利な使い方をご紹介します。


Webメディアの回遊アップに効果あり!サイト内検索&レコメンド広告のツールを導入(ISE編)

Webメディアの回遊アップに効果あり!サイト内検索&レコメンド広告のツールを導入(ISE編)

アクセスユーザーの回遊率や滞在時間を上げるには、より多く読まれるようコンテンツの質を高める必要があります。なかなか難しいことですが、実はもっと簡単にCMSに設置するだけで効果が見込めるツールがあります。広告収益の提供もあります。そんなツールの紹介とCREAMへの導入方法を解説します。


オウンドメディアに手軽なコメント機能を導入(AIコメントシステム編)

オウンドメディアに手軽なコメント機能を導入(AIコメントシステム編)

オウンドメディアやWebメディアサイトに特化したCMS「CREAM」に、よくいただくご要望のひとつにコメント・口コミの機能があります。後付けのコメント機能のサービスとしてAIに強い会社のものを使うことで、手軽にかつ運用負担も少ないコメント欄を実現できます。


「おすすめ」機能を使って、流れていかない記事の固定表示をしましょう

「おすすめ」機能を使って、流れていかない記事の固定表示をしましょう

任意の記事をまとめて固定表示させる「おすすめ」機能を説明します。ぜひ活用してください。


最新の投稿


CREAMアップデートのお知らせ

CREAMアップデートのお知らせ

CREAM標準パッケージを対象とした、2023年3月のアップデート内容の詳細についてお知らせします。


ウェブページを軽量化!WebP画像対応

ウェブページを軽量化!WebP画像対応

WebP(ウェッピー)とは、Googleが開発した次世代画像フォーマットです。ウェブ上で使われるPNGやJPGよりも軽量なため、ウェブサイトの表示速度を向上させることができます。CREAMにも導入可能です。


Googleアナリティクス(GA4)をCREAMに設定する

Googleアナリティクス(GA4)をCREAMに設定する

Googleアナリティクスは、メディアの運営上、必須ともいえるアクセス解析ツールです。CREAMの管理画面からGoogleアナリティクスのタグを設置して、アクセス解析を始めましょう。


Googleアナリティクス(GA4)に切り替える

Googleアナリティクス(GA4)に切り替える

Googleアナリティクスは、2023年7月1日に「ユニバ―サルアナリティクス(UA)」から「Googleアナリティクス4(GA4)」に変わります。UAを利用している場合は、GA4への切り替えが必要です。CREAMでUAを利用している方向けに、GA4への切り替え方法をご案内します。


CREAM管理『デザイン設定』について

CREAM管理『デザイン設定』について

『デザイン設定』では主にサイトのHOME画面の見た目を調整します。


不用品回収 タスクル

ページTOPへ