MENU

シュゼット様 BackOffice(管理画面)

目次

stgとwwwについて

概要

シュゼット様はECサイトに本番環境(ドメイン始まりwww)とテスト環境が存在する(ドメイン始まりstg)。
基本的にはキノスラテストサーバーで構築→stg反映→www反映となる。

注意点

wwwとstgのソースはなるべくイコールになるように調整。
wwwは先方調整が入っている可能性が高いので、操作する場合は必ずバックアップをとること。

管理画面

概要

テスト環境と本番環境でメインカラーが異なるの覚えておくこと!
管理画面 ピンク→テスト環境
管理画面  青 →本番環境

基本操作

■よく使用するページ
画面上部のアイコンの表示タブの設定(▽マーク)より、【商品】、【CMS】と【データ管理】にチェックを入れておく。
  1. 【商品】
    ・カテゴリ設定
    ・イベント設定
    ・商品検索(レフトナビ部分)
  2. 【CMS】
    ・テンプレート管理(PC&SP)
    ・フリーページ管理
  3. 【データ管理】
    ・商品エクスポート
    ・商品インポート

カテゴリ、イベント、フリーページの使い分け

特徴

カテゴリページ

・店舗トップ、商品カテゴリや、特集ページに使用されている。
・公開するとレフトナビに動的に表示される。
・1商品につき1つのカテゴリにしか紐づけできない。
・PCとSPで記入欄を分けることもできるが、基本的にはレスポンシブで作成。
・新規で作成の場合はカテゴリコード(のちのURL)、カテゴリ階層(どのカテゴリ配下に属するか)、カテゴリ名などを決めなければならない(要先方相談もしくは先方に登録してもらう)
・カテゴリコードによってレフトナビに表示される順序がかわってくる
・リダイレクト設定が可能
・その他、カテゴリ表示モード、サブカテゴリ表示モード、商品詳細表示モード、状態、一覧表示、詳細表示等は他ページを参照しながら登録。
・基本的には状態を「通常」にしないとページ確認ができない。
・状態を「通常」にし、一覧表示を「いいえ」にすることで、レフトナビに表示することなく(導線を出さずに)ページ確認することが可能となる。
・SEO設定の【タイトル】【メタディスクリプション】【H1タス表示内容】は必ず記入をする。
・商品のカテゴリページはページ下部にあるカテゴリ画像1,2,3を登録する。カテゴリ階層によっては登録しなくて良い画像もある。また、SPの画像は別途FTPで指定の場所へ「カテゴリコード.jpg」の状態でアップする必要がある。(例:https://www.suzette-shop.jp/img/usr/sb/category/H3020.jpg

イベントページ

・特集ページや、キャンペーンのお知らせ等に使用される
・【イベント商品一覧】より商品の紐づけの自由度がある。
・公開してもレフトナビには表示されない。
・イベント開始日~イベント終了日の設定が可能
・PCとSPで記入欄を分けることもできるが、基本的にはレスポンシブで作成。
・SEO設定の【タイトル】【メタディスクリプション】【H1タス表示内容】は必ず記入をする。
・URLの指定が8字以内

フリーページ

・ヘッダーフッターが3社共通のものになる。
・レフトナビが無いページ。
・キノスラでは主にLPを作成。
・新規作成時に「サイト識別子 」を選択できる。PC&スマートフォンを選択すると、ページ内(下部)でPCとSPの表示切替が可能。PCとスマートフォンを別々に作成した場合、ページ内に切り替え用ボタンは表示されない。
・通常とログイン時で表示切替が可能。キノスラでは3社合同のLPを作る際「スマートフォン」の方のみ、ヘッダーを変更するため通常とログイン時それぞれにSP用のヘッダーの記述をコンテンツの上部に記述している。(父の日特集や、ケーキストック特集参照)

ナビ周り

メインバナー

商品>商品管理>カテゴリ設定 カテゴリでアンリ・シャルパンティエを選択→検索ボタン
10アンリ・シャルパンティエを選択
【PC】
■フリースペース (カテゴリ名と切替):PCのメインバナー
■フリースペース2(カテゴリページ下部):PCのメインバナー直下の3カラムバナー~For Corporate 大口・企業向けまでのhtml
人気ランキング以下はEc-being様の方で開発している箇所なので基本的には編集不可。
お知らせとFacebookは先方での更新

【SP】
■フリースペース(スマートフォン) (カテゴリ名と切替):SPのメインバナー
■フリースペース2(スマートフォン)(カテゴリページ下部):おすすめ特集~スイーツノベルティのバナーまでのhtml

【PC&SP共通】
商品カテゴリ部分はdata_valを使って表示させている。
www用とstg用のシートが分かれているので、www反映の際には反映箇所のみstgシートからwwwシートへコピぺする。
スプレッドシート
PC用
SP用

FTPでのdata_valアップのディレクトリ
/contents/product_list/common/js/data_val.js
/contents/product_list/common/js/data_val_sp.js

ヘッダー周り

CMS>テンプレート管理
下記をそれぞれ編集。ソースは酷似しているが、ログイン時とログアウト時で表示&リンクが変わる場所があるので注意。

【PCサイト】
■カテゴリHENRIヘッダー / (ログイン中)
文字バナー、アコーディオン内のバナーの差し替え

【SPサイト】
■カテゴリHENRIヘッダー / (ログイン中)
イベントバナー差し替え

商品ページ

概要

基本的には先方がwwwにて商品の登録を行ってくれる。そのデータをcsvでstgへ移行し、構築する。
キノスラテストサーバーで構築したcomment3,comment4,comment7を登録する。
商品コメント3と4はPC用とSP用の記入欄があるが、基本的にはレスポンシブ作成なので同じソースを入れる。
※冷凍ケーキのような例外もあり(タブ切り替えのjsの書き方がPSとSPで異なるためソースが異なる)

サムネイルも2021/10頃より先方のほうで登録してくださるとのことだが、臨機応変にキノスラで対応することもあるかもしれない。
対応時は、本番サーバーの所定の場所に画像を格納し、csvもしくは管理画面よりサムネイル画像を指定して登録する。
管理画面から設定する場合「画像設定」ボタンより設定に入る。
アクセスを分散させるため画像URLには「https://ddyf877fi2kbt.cloudfront.net」を使用する。

SEO・検索キーワード設定

先方設定の箇所になるが、検索キーワード部分にいろいろなバリエーションのキーワードをいれておかないと、EC-beingの検索にヒットしないので、気にかけるようにして欲しい箇所。

csv

概要

キノスラでTTRを登録する際に使用します。
商品数が多い場合、csvで登録する方が作業効率が良い。
リリース日の商品公開は基本的には先方対応。臨機応変にキノスラで対応することもある。

手順

  1. wwwの管理画面の商品エクスポートページより、出力先で「商品(全項目)」にチェックを入れ、商品IDもしくは商品名等で商品を絞って「実行」(エクスポートする)
    ※先方が編集しているかもしれないことを考慮し、wwwとstgそれぞれのバックアップを取っておく(stg新商品の場合はwwwのバックアップのみでOK)
  2. エクスポートしたcsvを開き、今回の対象商品のみになっているか確認。他の商品が入っている場合は行ごと削除。
  3. その後、stgの管理画面の商品インポートページより、インポート先で「商品(全項目」にチェックを入れ、wwwのデータをstgへ入れる。
  4. wwwの商品インポートページの右下部分にある商品レイアウト設定:キノスラ様用を選択
  5. 商品レイアウト設定の項目名がキノスラで編集する箇所のみになっているか確認。
    足らない場合は「項目編集」より項目を追加する。
    TTR登録時は下記の項目があればOK。

    No項目名
    1 商品コード
    2 商品コメント3
    3 商品コメント3(スマートフォン)
    4 商品コメント4
    5 商品コメント4(スマートフォン)
    6 商品コメント7

  6. 商品エクスポートより、出力先で「キノスラ様用」にチェックを入れ、商品IDもしくは商品名等で商品を絞って「実行」(エクスポートする)
  7. stgも商品レイアウト設定の項目名と並び順をwwwとあわせておく
  8. エクスポートしたcsvにキノステストサーバで構築したhtmlを記述
  9. stgの商品インポートより、インポート先で「キノスラ様用」にチェックを入れ、インポート元ファイルで編集したファイルを選択し、「取込」。
    ※この時、うまく読み込めない場合はデータ入力をした行の下の行(1行まるごと)削除してからアップすると取込ができるようになることがある。(csv上に目には見えない何かしらのゴミが残っていると思われます。)
  10. stgで取込んだ商品を確認。このとき状態(掲載フラグ)が下書き、非表示、終息の設定になっていると確認ができないため、通常にしておく。
  11. 修正がある場合、キノスラテストサーバーのhtmlを編集し、csvへコピペ。csvを直接編集すると、タグ掛けに気づかなかったりするため、要注意。
  12. 先方確認後修正等なければ、リリース前日までに作成したcsvをwwwへ反映。

この記事を書いた人

目次