ページ一覧13

Shiori · Docs

はじめに / Getting started

日本語

Shiori について

Shiori(栞)は、日本のお店のために作った Shopify テーマです。見た目は和の組版(明朝体・縦書きの見出し・罫線・余白)、ページの作りは国内のネットショップで見慣れた形(お知らせ・のし・税込の表示・送料の案内・お問い合わせの確認画面)に合わせています。

プリセット

プリセット 向いているお店 見た目
Shiori 食品・ギフト 生成りと朱、明朝体、縦書きの見出し
Sumi アパレル 白と墨、ゴシック体、写真を大きく
Shizuku 化粧品・健康 淡い桜色、明朝体とゴシック体、角の丸み

プリセットは配色・書体・トップページの構成の初期値です。どれを選んでも、すべての機能を使えます。あとから「テーマ設定」で変えられます。

テーマを追加する

  1. テーマストアの Shiori のページでプリセットを選び、テーマを試すか購入する
  2. 管理画面の「オンラインストア > テーマ」に Shiori が追加される
  3. 「カスタマイズ」で中身を整え、確かめてから「公開」する

公開するまでは、今のテーマのままお店が表示されます。

最初に整えるもの

  • ロゴと配色(テーマ設定)
  • メニュー(管理画面のメニューで作り、ヘッダーとフッターで選ぶ)
  • お知らせバー(ヘッダーの上の帯)
  • トップのメインビジュアル(画像・見出し・ボタン)
  • お知らせ用のブログ(「お知らせ」などの名前でブログを作り、トップの「お知らせ」セクションで選ぶ)
  • お問い合わせのページ(ページを作り、テンプレートに「contact」を選ぶ)
  • カートの「送料無料の基準額」(配送の設定と同じ額にする)
  • 商品ページの「のし」(使わない場合はブロックを非表示にする)

English

About Shiori

Shiori is a Shopify theme made for stores in Japan. Its look follows Japanese typesetting (mincho type, vertical headings, fine rules, and generous margins), and its pages follow the patterns that Japanese shoppers expect: store news, noshi gift wrapping, tax-included prices, shipping notes, and a contact form with a review step.

Presets

Preset Made for Look
Shiori Food and gifts Off-white and vermilion, mincho type, vertical headings
Sumi Clothing White and ink black, gothic type, large photos
Shizuku Beauty and wellness Soft cherry pink, mincho and gothic type, rounded corners

A preset sets the starting colors, typefaces, and home page layout. Every preset includes all of the theme's features, and you can change any of these later in theme settings.

Add the theme

  1. On the Shiori page in the Shopify Theme Store, choose a preset, then try or buy the theme.
  2. Shiori is added to Online Store > Themes in your Shopify admin.
  3. Click Customize to set up your content, check it, and then publish.

Your store keeps showing your current theme until you publish Shiori.

What to set up first

  • Logo and colors (theme settings)
  • Menus (create them in your admin's menu settings, then select them in the header and footer)
  • Announcement bar (the strip above the header)
  • Hero on the home page (image, heading, and button)
  • A blog for store news (for example, a blog named News, selected in the News section on the home page)
  • A contact page (create a page and assign the contact template)
  • Free shipping threshold in the cart (match your shipping settings)
  • Noshi gift wrapping on product pages (hide the block if you don't offer it)