カテゴリーページ画像

Question

以下のショップの様にカテゴリーページの画像を大きく見せられるよう調整していますが、
商品画像の画質が変更できません。
こちらのサイトさんはどのようにして画像のサイズを上げているのでしょうか？
https://item.rakuten.co.jp/SHOP-URL/ITEM-URL/ITEM-URL/

Answer

ECマスターズの田中です。今回のご質問は、PC用ページに関するご質問ということでよろしいでしょうか。＞こちらのサイトさんはどのようにして画像のサイズを上げているのでしょうか？いただいたページに含まれる画像を例にご説明しますと、https://thumbnail.image.rakuten.co.jp/@0_mall/e-zakkamania/cabinet/17024/32675-1702488e.jpg?_ex=128x128上記、URLの末尾に記載されている「128x128」の数字で画像の縮小後サイズを指定することができるのですが、これを「250x250」つまり表示サイズに変更することで、サイズを上げております。これはRMSの設定でも、スタイルシートでも変更できない部分ですが、カテゴリ説明文の先頭にこのscriptタグを記載して、外部JavaScriptファイルを読み込み実行することで実現しております。上記「category.js」の１〜９行目および１８行目を外部JavaScriptファイルとして記載して自ショップのGOLDに設置して読み込ませることで、画像サイズを上げることができますが、RMSの、禁止タグを入力できるバグを利用する方法ですので、今後、RMSの改修により、使用できなくなる可能性がありますことを予めお含みおきください。スマートフォン用ページの場合も、PCとは若干手法が異なりますが、バグを利用してJavaScriptを読み込み、画像URLの末尾の数字を変更することで実現しております（90:90→414:414）。

Answer

こちら、スマホに入れたい場合はバグを使って「カテゴリー共通説明文」にjsのソースを入れたら良いのでしょうか？

Answer

ECマスターズの清水です。スマートフォンの場合は、Javascriptの記述方法が異なりますので、あらためて月曜日にご案内させていただきます。今しばらくお待ちくださいませ。

Answer

ECマスターズの田辺です。スマホのカテゴリ画像を大きくする場合には値が変わりますので、別途、下記の内容を外部JavaScriptファイル（末尾を.js）として保存し、GOLDにアップロードしてください。＝この下から＝＝＝＝＝＝＝jQuery(document).ready( function() {//画像変更jQuery('#sCSLContainer').each(function(){var txt = jQuery(this).html();jQuery(this).html(txt.replace(/fitin=90:90/g,"fitin=160:160"));});})＝この上まで＝＝＝＝＝＝＝カテゴリページ共通パーツ設定にを記載して、外部JavaScriptファイルを読み込み実行することでスマホのカテゴリ画像が大きくなります。しかしながら、スマホの場合、そのままのデザインで画像だけ大きくしてしまいますと文字と画像が重なってしまいますので、例えば下記のような記述を加え、画像に合わせてデザインを変更していただくことも必要です。＝この下から＝＝＝＝＝＝＝＝この上まで＝＝＝＝＝＝＝

カテゴリーページ画像

カテゴリーから探す