デザインレシピのモダールウィンドウ設置について

Question

デザインレシピのモダールウィンドウを商品とカテゴリ（スマホ）に入れたいのですが、ソースがいっぱいいっぱいで入りません。何かいい方法はありませんでしょうか？………（省略）………

Answer

ECマスターズの伊藤です。

> デザインレシピのモダールウィンドウを商品とカテゴリ（スマホ）に入れたいのですが、ソースがいっぱいいっぱいで入りません。何かいい方法はありませんでしょうか？

CSSやJavaScriptを外部リンクとしていただくことで
ご対応いただくことができます。

例えば、今回のモダールウィンドウの場合は
下記の通り、保存したものをGOLDにアップロードしてください。

スマホはCloseクリック後、他ページに遷移した場合
再度表示しないものと、再度表示する方法がございます。
再度表示しない方法をご案内いたしますので
異なるようでしたら、ご返信よりご連絡くださいませ。

=== 以下をpopup.jsとして保存 ===
jQuery(function($){
var k = 'modal';
var v = 'done';
if( localStorage.getItem(k) !== v ) $('#modal').prop('checked',false);
$('#modallabel, #modallabel a').click(function(){ localStorage.setItem(k,v); });
});
=== 以上をpopup.jsとして保存 ===

=== 以下をpopup.cssとして保存 ===
p{
margin:0 auto;}
input#modal {
display: none;
}
input#modal + label {
width: 100%;
height: 120%;
position: fixed;
top: 147px;
bottom: 0;
left: 0;
right: 0;
z-index: 2147483646;
background: rgba(0, 0, 0, 0.5);
cursor: pointer;
}
input#modal + label div {
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
border: medium none;
position: fixed;
width: 300px; /*画像の横幅*/
height:330px; /*画像の縦幅*/
bottom: 0;
left: 0;
margin: 15% auto;
position: fixed;
right: 0;
top: 120px;
}
input#modal + label div::before {
content: "× Close";
position: absolute;
bottom: -25%;
right: 50%;
margin: 0 -60px 0 0;
font-size: 3em;
font-weight: bold;
color: #ffffff;
}
input#modal:checked + label {
display: none;
}
input#modal + label img{
width: 300px; /*画像の横幅*/
height:330px; /*画像の縦幅*/
}
=== 以上をpopup.cssとして保存 ===
※画像のURL、高さや幅の編集をお願いします。

=== 以下を商品共通説明文にアップロード ====

Answer

先日はご回答いただきまして誠にありがとうございました。
本日、スマホページに設置したのですが、バナー下の「× Close」の
「×」の部分がどうしても「～」になってしまうのですが、修正はできますでしょうか？###HR######IMG0cd90a4cadbd0df13faee9f23e391bd5c.jpegIMG0######BR###

Answer

すみません。直りました！