楽天の商品ページ編集、完成イメージは保存してからになっていませんか|ラクリプウォーク|ラクリプ
Chrome Web Store
書いて、保存して、
開いて、戻る
商品説明のHTMLをtextareaに書いて保存し、公開ページを開いて確かめ、また編集画面に戻って直す。この往復が「いつもの編集」になっている店舗は少なくありません。ページデザインのプレビューだけでは実際の見た目まで分からず、結局は保存と確認の繰り返しに戻りがちです。
楽天市場の「商品ページ編集」とは
RMSの商品ページ管理には、PC用・スマホ用の商品説明のほかに、HTMLで見た目を組み立てる「ページデザイン」の編集欄があります。ここに書いたHTMLが、そのまま公開後の商品ページの見た目になります。画面名や仕様は更新で変わることがあるため、最新は店舗運営Navi等でご確認ください。
先にお伝えします。Live Editor・EASYブロックは会員限定のβ機能です。無料で使えるのは、RMSと商品ページを行き来する「この商品を編集」「商品ページを表示」の導線のみです。以下、正直に整理します。
ページデザインタブの位置づけ
PC商品説明・スマホ用商品説明とは別に、ページデザインタブでは自由なHTMLを書けます。装飾やレイアウトを整えられる分、タグの書き方次第で崩れやすい欄でもあります。何をどこに書いているかを把握しておくことが、編集を安定させる前提になります。
PC・SP・販売の別
ページデザインの中でも、PC商品用/SP商品用/PC販売用(セット販売ページ等)で入力欄が分かれることがあります。どの欄を直しているかを取り違えると、「直したのに反映されない」という事故につながります。
手書きHTMLの限界
textareaにHTMLを直接書く方法は自由度が高い一方、書いている最中は見た目が分かりません。色やレイアウトを変えるたびに保存して公開ページを開き直す必要があり、タグの閉じ忘れといった小さなミスも、保存するまで気づきにくいという弱さがあります。
| 手段 | 向く場面 | 注意 | ラクリプウォーク |
|---|---|---|---|
| 手書きHTMLをtextareaに直接入力 | 細かい調整に慣れている場合 | 保存して開くまで見た目が分からない | Live Editorで見ながら直せる(会員) |
| EASYブロックのテンプレを使う | よくある構成を早く組みたいとき | 会員限定のβ機能 | 11種から選んでコピー or 挿入 |
| 「この商品を編集」「商品ページを表示」の往復 | 公開後の最終確認 | 毎回の往復は手間 | 無料でワンクリック往復 |
How-to:Live Editor(切替・同期・ズーム)
ページデザインタブを開く
商品編集URL(item編集画面)から、ページデザインタブを表示します。
PC商品/SP商品/PC販売を切替える
Live Editorはページデザインの隣に開き、編集対象の欄を切替えながら見た目を表示します(会員限定のβ機能)。
textareaと双方向に同期させる
見た目側を直せばコードに反映、コードを直せば見た目に反映。どちらから編集しても崩れを追いやすくなります。
ズームで確認し、気になる箇所だけ直す
拡大縮小で細部を見ながら調整。保存前に何度でも見た目を確かめられます。
EASYブロック11種
よく使う構成をテンプレ化した11種のブロックです。選ぶとHTMLが生成され、そのままコピーして貼り付けるか、Live Editorへ直接挿入できます(会員限定のβ機能)。ゼロからHTMLを書けなくても、型を選ぶところから編集を始められます。
無料でできること
Live Editor・EASYブロックは会員限定ですが、「この商品を編集」「商品ページを表示」でRMSと公開ページを行き来する導線は無料でお使いいただけます。まずはこの往復だけでも、確認の手間を減らせます。
前提・バックアップ・β
商品編集URL(item編集画面)を開いていること、ページデザインタブを使っていること、Chrome/Chromium系ブラウザであることが前提です。β機能のため表示や同期の挙動が変わる可能性があり、編集前に既存のHTMLをコピーしておくバックアップをおすすめします。
費用の前提
Live Editor・EASYブロックは会員限定のβ機能です。価格の具体値は本ページでは扱いません。無料で使えるのは「この商品を編集」「商品ページを表示」の往復のみです。詳しくは製品ページをご覧ください。
書いてから確かめるのではなく、
見ながら直す
ツボは、編集の途中でも、見た目がその場で分かる状態を作ること。Live Editorはページデザインの隣でリアルタイムに見た目を表示し、PC商品/SP商品/PC販売を切替えながらテキストエリアと同期します(会員限定のβ機能)。仕上げにEASYブロックの型を使えば、ゼロから書かずに構成を組めます。
比較:手書きHTML × 外部ページビルダー × ラクリプウォーク
| 観点 | 手書きHTML | 外部ページビルダー | ラクリプウォーク |
|---|---|---|---|
| 見た目の確認 | 保存後に公開ページで確認 | 専用ツール内で確認してから移す | ページデザインの隣にその場で表示 |
| 反映の手間 | textareaにそのまま貼るだけ | 生成後にコピー&貼り付けが必要 | Live Editorで直接、EASYはコピーor挿入 |
| 学習コスト | HTML/CSSの知識が必要 | 別サービスの操作を覚える | ページデザイン画面の延長で操作 |
| 費用 | 無料(知識コストのみ) | 外部サービスの契約が必要な場合あり | Live Editor/EASYは会員限定(β) |
メリット・デメリット
向く店舗
ページデザインのHTMLを自分たちで頻繁に直している店舗。EASYブロックでまず型から始めたい店舗にも向きます。
向かない/注意
会員登録なしで使いたい場合や、完成品をそのまま欲しい場合には向きません。β機能のため表示崩れの可能性があり、バックアップが前提です。
効果の見方
「見た目の編集」の効き目は売上一本では測りにくいです。修正1回あたりの確認時間、公開後の見た目の手戻り件数、ページデザイン編集にかかる時間を定点で見るのが実態に近いです。
よくある質問
保存する前に、
見た目で直してみませんか
Live Editor・EASYブロックは会員限定のβ機能です。まずは製品ページで詳細をご確認ください。無料の往復導線は、Chrome追加後すぐにお試しいただけます。
