ネイティブ広告の設定を定義したら、ネイティブ広告のスタイルを設定できます。この記事では、構成する必要がある必須の設定とオプションの設定について説明します。
ネイティブ広告のスタイルを設定する:
ガイド付きデザイン エディタ
ガイド付きデザイン エディタを選択してネイティブ スタイルを作成する場合は、ウェブサイトとアプリのデザインに合わせて、コントロールを使用してネイティブ広告のスタイルを設定します。スタイルを変更するとページ上の広告プレビューも自動的に更新され、さまざまなスタイルを試すことができます。
ガイド付きデザイン エディタの使用に関するヒント
プレビューのサイズ
「Fluid」サイズを使ったスタイルを作成する際は、[プレビューの幅] にさまざまな画面サイズを入力して、広告がどのように表示されるかを確認できます。プレビューの横にある青色のバーを使用して、手動で幅のサイズを変更することもできます。高さは自動的に更新されます。
要素を並べ替える
右側のパネルに表示される各カード内の要素について、表示と非表示を切り替えたり順序を変更したりするには、[要素を並べ替え] をクリックします。たとえば、行動を促すフレーズを広告主名の上に移動したり、広告主のロゴを削除したりできます。
[ネイティブ広告のスタイル] パネル
[ネイティブ広告のスタイル] パネルでは、必要に応じて設定を更新できます。たとえば、[タイトル] を展開すると、広告のタイトル（見出し）の最大文字数を半角 30 文字（短い形式）にするか、半角 90 文字（長い形式）にするかを選択できます。
- Archivo
- Arial
- Arimo
- Bitter
- Comic Sans
- EB Garamond
- Geneva
- Georgia
- Helvetica
- Lato
- Libre Baskerville
- Libre Franklin
- Lora
- Merriweather
- Montserrat
- Mukta
- Muli
- Nunito
- Open Sans
- Open Sans Condensed
- Oswald
- Playfair Display
- Poppins
- Raleway
- Roboto
- Roboto Condensed
- Roboto Slab
- Slabo 27px
- Source Sans Pro
- Times New Roman
- Trebuchet
- Ubuntu
- Verdana
- Volkhov
CSS エディタ内のスタイル
- 直接変更を加えた後、UI コントロールを使ってさらに変更を加えることはできません。
- CSS を変更した結果、そのネイティブ スタイルがポリシーに違反するものとなった場合、Ad Exchange オークションに参加することはできなくなります。ただし、プログラマティック保証型取引を通じた配信は可能です。
- ガイド付きデザイン エディタで HTML を編集することはできません。さらにカスタマイズを行う場合は、[HTML ＆ CSS エディタ] を選択してください。ただしその場合、プログラマティック広告には対応できなくなります。
CSS を直接編集するには、[CSS エディタ内のスタイル] スイッチをオンにします。
CSS を編集した場合は、[検証] をクリックして、編集後のスタイルが Ad Exchange のポリシーに準拠しているか確認してください。
HTML と CSS
[HTML ＆ CSS エディタ] を使用してネイティブ スタイルを作成する場合は、ウェブサイトとアプリのデザインに合わせて、HTML と CSS を使用してネイティブ広告のスタイルを設定します。スタイルを変更するとページ上の広告プレビューも自動的に更新され、さまざまなスタイルを試すことができます。
HTML ＆ CSS エディタを使用する際のヒント
プレビューのサイズ
「Fluid」サイズを使ったスタイルを作成する際は、[プレビューの幅] にさまざまな画面サイズを入力して、広告がどのように表示されるかを確認できます。プレビューの横にある青色のバーを使用して、手動で幅のサイズを変更することもできます。高さは自動的に更新されます。
レンダリング タイプ
Accelerated Mobile Pages（AMP）用に最適化されたネイティブ広告を作成するかどうかを選択します。広告設定で「Fluid」サイズを選択した場合、ここで [標準] のデフォルト設定を変更することはできません。
- 標準: ネイティブ広告は、PC ウェブ、モバイルウェブ、モバイルアプリで動作します。AMP コンテンツでも動作しますが、AMP を選択した場合の方が処理は高速になります。
- AMP: AMP 広告は、AMP コンテンツで標準の広告よりも高速に動作しますが、標準コンテンツにも配信されます。
- 標準版と AMP 版: ネイティブ広告のそれぞれのバージョンを生成するコードを追加します。AMP コンテンツでは AMP 版が配信され、標準コンテンツでは標準版が配信されます。クリエイティブ ラッパーを使用して広告にコードを追加する方法をご確認ください。
[ネイティブ広告のスタイル] パネル
右側のパネルで [HTML] と [CSS] を切り替えて、必要に応じて更新できます。ネイティブ広告のコードの追加の詳細をご覧ください。
iOS の「セルフ ユニバーサル リンク」を HTML に追加する
セルフ ユニバーサル リンクとは、iOS アプリでアプリ内ナビゲーションに使用されるユニバーサル リンクです。ネイティブ クリエイティブでセルフ ユニバーサル リンクを使用する場合、次の例のように、HTML に %%ONE_CLICK_HANDLER_TARGET%% マクロを追加します。
次のステップ
スタイルの設定が完了したら、次の 2 つのオプションのいずれかをクリックして変更を保存します。
- [保存して開始] を使用すると、スタイルのステータスが「有効」に変更され、広告を配信できるようになります。
- [保存] をクリックすると、ステータスが「無効」に変更され、広告はまだ配信できません。後で有効にするには、保存したネイティブ スタイルの表に移動してスタイルを選択し、[有効にする] をクリックします。
特定の広告申込情報でネイティブ スタイルを使用するには、特定の広告申込情報にネイティブ スタイルを適用します。
