に投稿 コメントを残す

【RMS版】ショップからのおしらせ欄を拡大する

ここでは「ショップからのおしらせ」の右にあるバナーを削除する方法を説明します。
特に表示したいバナーがない時にご利用ください。

まずは、テンプレートセット中のヘッダーコンテンツ.txtコンテンツボックス内にある
.news_box { width:660px; }から.shop_news dd { margin:0 0 5px 0; ~ }までを、以下のタグをコピーして書き換えてください。


.news_box { width:660px; }
.news_box img { float:right; }
.top_news { width:660px; }
.top_news a:link { color:#29ABE2; text-decoration:none; }
.top_news a:visited { color:#29ABE2; text-decoration:none; }
.top_news a:hover { color:#29ABE2; text-decoration:underline; }
.top_news a:active { color:#29ABE2;text-decoration: underline; }
.shop_news { padding:5px; width:635px; height:80px; overflow:scroll; overflow-x:hidden; }
.shop_news dt { margin:0 0 5px 0; float:left; width:90px; border-bottom:dashed 1px #808080; }
.shop_news dd { margin:0 0 5px 0; float:left; width:520px; border-bottom:dashed 1px #808080; }

次に、トップ説明文上.txt<!– ショップからのお知らせ-ここから –>< !– ~ここまで –>を、以下のタグをコピーして書き換えてください。


<!-- ショップからのお知らせ-ここから -->
<div class="news_box">
<div class="top_news">
<div class="column">
<p class="title_banner">ショップからのおしらせ</p>
<dl class="shop_news">
<dt><a href="リンク先URL" target="_top">○月○日</a></dt><dd>お知らせ内容</dd>
<dt><a href="リンク先URL" target="_top">○月○日</a></dt><dd>お知らせ内容</dd>
<dt><a href="リンク先URL" target="_top">○月○日</a></dt><dd>お知らせ内容</dd>
<dt><a href="リンク先URL" target="_top">○月○日</a></dt><dd>お知らせ内容</dd>
<dt><a href="リンク先URL" target="_top">○月○日</a></dt><dd>お知らせ内容</dd>
<dt><a href="リンク先URL" target="_top">○月○日</a></dt><dd>お知らせ内容</dd>
<br class="clear" />
</dl>
</div>
</div>
</div>
<!-- ショップからのお知らせ-ここまで -->

以上の操作で、ショップからのお知らせコンテンツを拡大できます。

に投稿 コメントを残す

【RMS版】サイドバーにバナーを追加

ここでは、サイドバーの一番下にバナーを追加する方法を説明します。

バナーの画像(幅:215px/高さ:任意)を作成し、R-Cabinetにアップロードしてください。
テンプレートセット中のレフトナビゲーション.txt<!– レフトナビバナー-ここから –>< !– ~ここまで –>内の</ul>の直前に改行を入れてください。

改行した部分に以下のタグをコピーして貼り付け、「リンク先URL」「画像URL」を変更してください。


<li><a href="リンク先URL" target="_blank"><img src="画像URL" width="215" /></a></li>

以上の操作で、バナーが1点追加されます。

に投稿 コメントを残す

【RMS版】トップページに大バナーを追加

ここでは、イベントニュースの下にバナーを追加する方法を説明します。
別の場所へ貼り付ける際の応用も可能です。

バナーの画像(幅:660px/高さ:任意)を作成し、R-Cabinetにアップロードしてください。
テンプレートセット中のトップ説明文上.txt<!– ショップからのお知らせ-ここまで –>< !– 売れ筋ランキング-ここから –>の間に改行を入れてください。

改行した部分に以下のタグをコピーして貼り付け、「リンク先URL」「画像URL」を変更してください。


<div class="image_cell"><a href="リンク先URL" target="_top"><img src="画像URL" width="660" /></a></div>

以上の操作で、バナーが1点追加されます。

に投稿 コメントを残す

【RMS版】トップページに小バナーを追加

ここでは、イベントニュースの下に小さなバナーを複数追加する方法を説明します。
別の場所へ貼り付ける際の応用も可能です。

バナーの画像(幅:325px/高さ:任意)を2個以上作成し、R-Cabinetにアップロードしてください。
テンプレートセット中のトップ説明文上.txt<!– ショップからのお知らせ-ここまで –>< !– 売れ筋ランキング-ここから –>の間に改行を入れてください。

改行した部分に以下のタグをコピーして貼り付け、「リンク先URL」「画像URL」を変更してください。
<dt></dt>で囲まれたタグは左のバナー、<dd></dd>で囲まれたタグは右のバナーです。
増やす際は<dt></dt>と<dd></dd>をコピーして貼り付けて使用してください。


<dl class="special_banner">
<dt><a href="リンク先URL" target="_top"><img src="画像URL" width="325" /></a></dt>
<dd><a href="リンク先URL" target="_top"><img src="画像URL" width="325" /></a></dd>
<br class="clear" />
</dl>

以上の操作で、バナーが1点追加されます。

に投稿 コメントを残す

【RMS版】レビューページのスクロールをトップに追加

ここでは、トップページにショップレビューを表示する方法を説明します。
レビューページを表示することで、お店の評価がお客様にダイレクトに伝わり、集客力アップが見込めます。

テンプレートセット中のトップ説明文上.txt<!– 下バナー-ここまで –></div>の間に改行を入れてください。

改行した部分に以下のタグをコピーして貼り付け、「ショップレビューページのURL」を変更してください。


<iframe class="review_frame" src="ショップレビューページのURL" scrolling="yes" frameborder="0"></iframe>

ショップレビューページのURLは以下になります。店舗IDを書き換えてご使用ください。
店舗IDとは、受注番号の最初の6桁の数字です。


http://review.rakuten.co.jp/rd/0_店舗ID_店舗ID_0/

以上の操作で、トップページにショップレビューが表示されます。

に投稿 コメントを残す

【RMS版】ヘッダーバナーに背景画像を入れる

ここでは、「楽天ショップテンプレート【配色自在】」のヘッダーの背景に画像を表示させる方法を説明します。
画像を使用することでオリジナリティを演出し、お客様により強くショップを印象付けることができます。

ヘッダーに表示させたい画像(幅:900px/高さ:150px程度)を用意し、R-Cabinetにアップロードしてください。
テンプレートセット中のヘッダーコンテンツ.txtbackground-color:#ffecbd;を以下のタグに書き換えてください。

以下のコードをコピーして書き換え、「画像URL」を変更してください。


background:url(画像URL) no-repeat top left;

以上の操作で、ヘッダーに画像が表示されます。

に投稿 コメントを残す

【RMS版】ヘッダーバナーにロゴを入れる

ここでは、ヘッダーのショップタイトルを企業ロゴなどの画像に変更する方法を説明します。
画像を使用することでオリジナリティを演出し、お客様により強くショップを印象付けることができます。

まず、ショップタイトルとして使用する画像を作成します。
望ましいのは、以下のような透過gif形式の画像です。(透過gif画像の作り方はこちら)
ロゴの周りに背景色と同じ色を置くと違和感なくヘッダーに馴染みます。

画像の準備ができましたら、R-Cabinetにアップロードしてください。
テンプレートセット中のヘッダーコンテンツ.txtショップタイトルの文字を以下のタグに書き換えてください。

以下のコードをコピーして書き換え、「画像URL」「ショップタイトル」を変更してください。


<img src="画像URL" alt="ショップタイトル" />

以上の操作で、ショップタイトルを画像に変更できます。

に投稿 コメントを残す

【RMS版】カテゴリをカスタマイズ

ここでは、サイドバーのカテゴリーの簡単なカスタマイズについて説明します。

サイドバーのカテゴリーは、テンプレートセット中のレフトナビゲーション.txt<!– カテゴリー-ここから –><!– ~ここまで –>内の<!– ひとかたまり-ここから –><!– ~ここまで –>で設定されています。
その中の「大カテゴリー」は楽天RMSで作成したカテゴリページ、
中カテゴリー」は大カテゴリーの中に作成した下位カテゴリページ、
小カテゴリー」はその更に下位のカテゴリページ、もしくは商品ページに該当しています。

大カテゴリー」のみ表示させたい場合は、以下の赤文字の部分を削除してください。


<dt class="big"><a href="リンク先URL" target="_top">大カテゴリー</a></dt>
<dt class="small"><a href="リンク先URL" target="_top">中カテゴリー</a></dt>
<dd><a href="リンク先URL" target="_top">小カテゴリー</a></dd>



中カテゴリー」が不必要場合は、以下の赤文字の部分を削除してください。


<dt class="big"><a href="リンク先URL" target="_top">大カテゴリー</a></dt>
<dt class="small"><a href="リンク先URL" target="_top">中カテゴリー</a></dt>
<dd><a href="リンク先URL" target="_top">小カテゴリー</a></dd>
・
・
・

小カテゴリー」のみ表示させたい場合は、以下の赤文字の部分を削除してください。


<dt class="big"><a href="リンク先URL" target="_top">大カテゴリー</a></dt>
<dt class="small"><a href="リンク先URL" target="_top">中カテゴリー</a></dt>
<dd><a href="リンク先URL" target="_top">小カテゴリー</a></dd>
・
・
・

その他、タグの増減で様々な様式に変更することが可能です。

に投稿 コメントを残す

【RMS版】いらないパーツを抜く

ここでは、使わないバナーなどの余計なパーツを抜く方法を説明します。

テンプレートセット中のトップ説明文上.txt<!– イベントニュース-ここから –><!– ~ここまで –>で囲まれたタグを削除してください。

以上の操作で、イベントニュースを抜くことができます。
また、別の不要な部分を削除する際も、開始タグ・終了タグを意識して、必要なタグまで削除しないよう注意して行ってください。

に投稿 コメントを残す

【RMS版】ショップの背景に売出しバナーを表示する

ここでは、ショップの背景(左側)に縦型売り出しバナーを表示させる方法を説明します。
すべてのページから見ることができるので、宣伝効果抜群です。

バナーの画像を用意し、R-Cabinetにアップロードしてください。
テンプレートセット中のヘッダーコンテンツ.txtの「sans-serif;」の直後にスペースを入れてください。

スペースを入れた部分に以下のコードをコピーして貼り付け、「画像URL」を変更してください。
バナーを右側に表示したいときは、以下のコードの「left」を「right」に書き換えてください。


background:url(画像URL) repeat-y top left;

以上の操作で、ショップの背景に縦型売り出しバナーが表示されます。

に投稿 コメントを残す

【RMS版】全体のテキストの色を変える

ここでは、テンプレートに使用されている文字の色を変更する方法を説明します。

テンプレートセット中のヘッダーコンテンツ.txtの「color:#808080;」を任意のものに変更します。
色を指定するためのコードの作成には、以下のサイトなどのサービスがご利用いただけます。作成したコードをコピーしてご使用ください。
カラーコード作成サイト(無料)

通常の文字の色を変更する場合は、以下のタグのカラーコード(数字の部分)を書き換えてください。

リンク部分の文字の色を変更する場合は、以下のタグのカラーコード(数字の部分)を書き換えてください。

以上の操作で、テンプレートの文字の色を変更することができます。
なお、商品ページの文字色などの楽天RMS由来のカラー設定は
楽天RMS→デザイン設定→固定文言・フォントカスタマイズから行ってください。

に投稿 コメントを残す

【RMS版】サイドバーに店長紹介を入れてみる

ここでは、サイドバーに店長紹介を追加する方法を説明します。
店長紹介を設置すると、店長の顔が見えることでお客様からの信頼感・親近感がアップし、売り上げに繋がりやすくなります。

店長の画像(幅:180px/高さ:任意)を作成し、R-Cabinetにアップロードしてください。
テンプレートセット中のレフトナビゲーション.txt<!– カテゴリー-ここまで –><!– レフトナビバナー-ここから –>の間に改行を入れてください。

改行した部分に以下のタグをコピーして貼り付け、「店長画像URL」「店長紹介テキスト」を変更してください。


<!-- 店長紹介-ここから -->
<div class="column">
<p class="title_banner">店長紹介</p>
<div class="pict_center">
<img src="店長画像URL" width="180" alt="photo" />
<p>店長紹介テキスト</p>
</div>
</div>
<!-- 店長紹介-ここまで -->

以上の操作で、店長紹介が追加されます。