みなさんこんにちは。
ShopifyのECサイト構築や運営サポートを行なっているささいちです。
今回は無料テーマであるDawnはどんなものなのかを徹底的にご説明したいと思います。
かなり長くなっていますので、目次からあなたが知りたい場所に飛んで見ていただければと思います!
今後アップデートもあるかと思いますが、ざっくり全体をご覧ください!
ShopifyテーマDawnとは
無料テーマであるDawnは、Shopifyの最新機能であるOS2.0に対応した最初のテーマであり、Shopifyに登録するとデフォルトで設定されているテーマになります。
![](https://ichisetup.com/wp-content/uploads/2022/03/Dawn-1024x451.jpg)
作りはとてもシンプルですが、デザインも整っていて使いやすいです。
公式ページで、「Try theme」と「View demo store」で実際の画面を確認することができるのでご自身でも覗いてみてください。
今回はそのDawnではどんなことができるのかをまとめていきます。
OS2.0とは
上記でもOS2.0という言葉が登場してよくわからない方もいたと思います。
OS2.0は簡単に言えばShopifyテーマの最新バージョンと思っておいてくれたら良いです。
厳密に言えば、各テーマにもバージョンは存在しますが、OS2.0というのはShopifyのテーマ全体のバージョンになります。
OS2.0は2021年の6月ごろに発表され、2021年8月に実装されたものです。
今まではTOPページのみセクションを追加したりすることができたのですが、それだとTOPページ以外の下層ページは作り込むことが難しく、専用のアプリに頼ることで解決していました。
しかしOS2.0の登場でTOPページ以外のページも細かく編集することが可能になりました。
OS2.0ではこの様に「テキスト」「ボタン」などの細かいパーツも操ることができるので、デザインや訴求に合わせて表示非表示、位置の入れ替えなどが可能になりました。
![](https://ichisetup.com/wp-content/uploads/2022/03/os10.png)
こちらは以前まで使っていたOS1.0のテーマの編集画面です。
画像付きテキスト列というセクションの中に1種類しかパーツを追加できません。
セクション内の細かいパーツである「文章」や「ボタン」などの位置は変更することができなかったのです。
![](https://ichisetup.com/wp-content/uploads/2022/03/os20.png)
こちらが現在使われているOS2.0の編集画面です。画像バナーというセクションの中に「タイトル」「文章」「ボタン」のブロックと呼ばれるパーツがパーツが分かれていることが分かります。
Dawnではどんなことができるのか
さて、実際にDawnというテーマはどんなことができるのかについて詳しくご紹介していこうと思います。
追加できるセクションの種類
ShopifyのOS2.0ではお好きなセクションを選んで配置することが可能です。
Dawnもそれに対応をしていて、以下のセクションを自由に追加して上下の位置を変えることができます。
・スライドショー
・コレクションリスト
・テキスト付き画像
・ブログ記事
・ページ
・マルチカラム
・メール登録
・リッチテキスト
・動画
・折りたたみ可能なコンテンツ
・特集コレクション
・特集商品
・コラージュ
・画像バナー
・お問い合わせフォーム
・カスタムLiquid
スライドショー
![](https://ichisetup.com/wp-content/uploads/2022/03/slideshow-1024x493.jpg)
ショップの印象を大きく与えることができるのがスライドショーです。
また、特集などをスライドショーに入れることで、きて欲しい場所に誘導することも可能なので、スライドショーはよく使うセクションになります。
スライドショーの特徴をまとめます。
・最大5枚まで追加可能
・画像の表示を「全幅」と「左右に余白有り」を選択可能
・ページネーションを「ドット」「数字」「1/5など」を選べる
・スライドの自動切り替えと時間を設定可能
・スマホにて「文字を画像の上に重ねる」「画像下に表示」を選べる
・「見出し」「小見出し」「ボタン」の表示が可能
・上記の3つのコンテンツを表示する位置を変更可能
・コンテンツの背景の表示非表示可能
・コンテンツの色配色変更可能
・画像のオーバーレイの不透明率調整可能(黒色のみ)
・スマホにてコンテンツの揃えを変更可能(左/中央/右)
![](https://ichisetup.com/wp-content/uploads/2022/03/slideshow-sp.png)
この様にスマホでの見え方で「画像の上に文字を表示」「画像の下に文字を表示」を選ぶことができます。
コレクションリスト
![](https://ichisetup.com/wp-content/uploads/2022/03/Collection03-1024x448.png)
商品をコレクションで分ければコレクション別での表示をすることが可能です。
例えばアパレルだったら、「mens」「womans」「kids」などでカテゴリ分けをしたい時にそれぞれ対象の商品を含むコレクションを作成してこのセクションを使えば、目的別で商品を探すことができます。
・最大15枚まで追加可能
・スマホでの表示をスワイプ表示にすることができる
・画像に余白を追加可能
・全てを表示のボタンを表示可能
・配色の変更が可能(テーマ設定で指定しているもの)
こちらは、各コレクション自体に画像を登録すればこの様に画像を表示することが可能です。(例では全てのコレクションに犬の画像を設定しているのでこの様な表示になっています)
![](https://ichisetup.com/wp-content/uploads/2022/03/Collection.png)
この様にスマホではスワイプ表示にすることや、画像の周りに余白を追加してショップの雰囲気を出すことが可能です。
ちなみに画像の周りの色は、テーマ設定のベースとなる色で決まってきます。
テキスト付き画像
![](https://ichisetup.com/wp-content/uploads/2022/03/text-image-1024x410.png)
これもよく使うセクションです。
画像とテキストを横並びに表示できます。(スマホでは上下)
Dawnではテキストの順番も変更できますし、タイトルはいらないのであれば非表示にすることも自由です。
・画像の表示を「右か左」を選べる
・「タイトル」「文章」「ボタン」の表示と位置を変更できる
・背景色の変更が可能(色はテーマ設定のもの)
ブログ記事
・表示するブログ記事の数を2〜4で変更できる
・サムネイル、日付、執筆者の表示非表示変更
・サブ背景の表示ができる
・「全てを表示」ボタンを表示できる
ページ
ページ機能にて書いたことを表示することができる。
それ以外の機能は特にない。
過去の構築経験ではこの機能を使って画像バナーの表示をしたことはあります。
マルチカラム
マルチカラムはショップの特徴などを並べたりする時に使ったりします。
使い方次第では便利なセクションなので有効活用しましょう
・複数のカラムを並べることができる
・各カラムには以下の内容を設定できる
「画像」「タイトル」「テキスト」「リンク」
・文字の並びを左か中央揃えかを選べる
・背景色を変更できる(テーマ設定で決めた色)
・ボタンを追加できる
メール登録
こちらは訪れたユーザーさんにメールの登録を促すためのセクションになります。
・「タイトル」「テキスト」「メールフォーム」を追加することが可能
リッチテキスト
テキストだけのセクションになります。
自分達はどういったものを扱っているのかを端的に表示したりします。
・「タイトル」「テキスト」「メールフォーム」を追加することが可能
動画
![](https://ichisetup.com/wp-content/uploads/2022/04/スクリーンショット-2022-04-06-16.32.39-1024x579.jpg)
YouTubeなどに載せている動画のURLを設定することで動画を配置できる。
サムネイルのように画像を設定できるのも良い。
折りたたみ可能なコンテンツ
![](https://ichisetup.com/wp-content/uploads/2022/04/スクリーンショット-2022-04-06-16.33.42-1024x567.png)
こちらはクリックすると開いて表示するようなセクションです。
よくある質問などでよく使います。
アイコンも何種類か用意されていて各タブで変更が可能となっています。
特集コレクション
![](https://ichisetup.com/wp-content/uploads/2022/04/スクリーンショット-2022-04-06-16.36.50-1024x376.jpg)
商品登録の際にコレクションでまとめておけばセクションとして一覧を表示することが可能です。最大カラム数は2〜12の間で変更が可能となっています。
これを利用すれば、人気ランキングなども作れたりします!
特集商品
![](https://ichisetup.com/wp-content/uploads/2022/04/スクリーンショット-2022-04-06-16.39.07-1024x543.jpg)
イチオシの商品をセクションとして呼び出すことが可能。
写真右の文字などは順番を入れ替えることや表示したい内容を変更することが可能となっています。
コラージュ
![](https://ichisetup.com/wp-content/uploads/2022/04/スクリーンショット-2022-04-06-16.42.00-1024x523.jpg)
左側は大きい画像、右側は二段にして表示などのコラージュ表示が可能。
一つのセクション内にいくつもの情報をまとめることができるし、視覚的にも訴求できるので写真にこだわりがあるストアで使用したい。
画像バナー
![](https://ichisetup.com/wp-content/uploads/2022/04/スクリーンショット-2022-04-06-16.49.15-1024x407.jpg)
画像を使った訴求ができるセクションです。
上記の写真では画像を2枚使った設定をしていますが1枚でも設定は可能です。
ストアのTOPページ一番上でも利用できるし汎用性が高いセクションとなっています。
お問い合わせフォーム
お問い合わせのフォームを表示することができる
カスタムLiquid
Shopify独自の言語であるLiquidを自由に記述できるセクション。
最後に
こうしてみると無料テーマかつデフォルト設定されたテーマですが、できることは豊富です。汎用性も高くいろんなジャンルのストアで使用されているテーマなので悩んだらDawnを使ってみてください。
ちなみに僕はDawn(ドーン)のことをずっとDown(ダウン)と読んでいましたので、僕みたいに間違いのないように!笑