*当サイトにはプロモーションも含まれます。

このツールは、あなたのウェブサイトに日替わりバナーやランダム広告をプログラミング不要で簡単に設置するためのJavaScriptコードを自動で生成します。
 

このツールで何ができるのか？

ウェブサイトを訪れる人やページをリロードするたびに、あなたが用意した複数のバナーや広告の中から、ランダムに一つを選んで表示させることができます。
 

なぜこのツールが必要なのか？

通常、バナーをランダムに表示させるには、JavaScriptというプログラミング言語を使って複雑なコードを書く必要があります。しかし、このツールを使えば、画像とリンクのURLを入力するだけで、その複雑なコードを自動で生成できます。

ステップ1: 組み合わせリストの入力

画像リンク (URL) と サイトリンク (URL) の組み合わせを、それぞれ入力フィールドに入力します。

例:

画像リンク: https://example.com/banner-summer.jpg

サイトリンク: https://example.com/campaign/summer

「+ 組み合わせを追加」 ボタンをクリックして、表示させたいバナー・広告の数だけ組み合わせを追加します 。

追加した組み合わせが不要になった場合は、その組み合わせの右下にある 「- 削除」 ボタンで削除できます。
 

ステップ2: クラス名の設定

画像置き換え対象のクラス名 の入力フィールドに、ランダムに画像を表示させたい<img>タグに設定するクラス名を入力します。

デフォルト値: target-image-class

サイトリンク置き換え対象のクラス名 の入力フィールドに、ランダムにリンク先を変更したい<a>タグに設定するクラス名を入力します。

デフォルト値: target-link-class

ヒント: 通常、バナー全体をリンクにする場合は、<img>タグを<a>タグで囲み、<a>タグにこのクラス名を設定します。
 

ステップ3: コードの生成と取得

すべての入力が完了したら、画面下部の 「コードを生成」 ボタンをクリックします。

入力内容に基づいたJavaScriptコードが、下部のコード表示エリアに生成されます。

生成されたコードの下にある 「コードをコピー」 ボタンをクリックして、コード全体をクリップボードにコピーします。
 

ステップ4: ウェブサイトへの実装

ウェブサイトのHTMLを開きます。

ランダム表示させたい要素（<img>タグと<a>タグ）に、ステップ2で設定したクラス名（例: target-image-class と target-link-class）を設定します。

ステップ3でコピーしたJavaScriptコードを、ウェブサイトの </body>タグの直前 に貼り付けます。

これで、ウェブサイトを訪問するたびに、入力した組み合わせの中からランダムに選ばれた画像とリンクが表示されるようになります。