アフィリエイト用の商品枠テンプレート-4列タイプ

この商品枠テンプレートは、HTMLソースを右クリックでコピー・ペーストしてご使用ください。このページの商品枠は4列のベースとそのバリエーションになります。当サイトのテンプレートにはどれでも使用できるようになっています。 背景や、枠線(border)の色は参考なので、お好きな色を使って作成できます。


構造としては大きなテーブルのなかに、商品一つ一つを入れる小さなテーブルが4つ並んでいます。小テーブルは上下二段になっていて画像と説明を分けて入れる構造です。


小テーブルの幅が均一になるようstyle="table-layout:fixed;"が入っています。幅を変えたい場合には削除をお願いします。


※注 すべて選択のボタンはJavaScriptが有効になっていないと働きません。

4列タイプ−何段でも重ねられます

ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
★背景も枠線もなしのプレーンなタイプ★
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる

4列タイプのバリエーション

ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
★背景に好きな色を指定できます
★bgcolorで指定
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる

ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
★商品枠に破線を適用
★borderの線種、太さ、色等は自由です
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる

ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
★商品枠に破線を適用
★borderの線種、太さ、色等は自由です
★背景色も適用した作例
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる

ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
★tableとtdを色分け
★色は自由に設定可能
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる

ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
★tableとtdに破線を適用
★borderの線種、太さ、色等は自由です
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる

ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
★tableとtdに破線を適用
★borderの線種、太さ、色等は自由です
★背景色も自由
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる

ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
★tableとtdに破線を適用
★borderの線種、太さ、色等は自由です
★背景色も自由
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる
ここに画像のリンクソースを入れる
ここに画像のリンクソースを入れる
!ここに商品説明のリンクソースを入れる
枠の幅130pxまで可
!ここに紹介、解説などの文を入れる