画像

背景

技術と経験で、価値のあるホームページ制作を。ホームページ制作を通じて、お客様に利益をもたらすことを追求します。

技術と経験で、価値のあるホームページ制作を。ホームページ制作を通じて、お客様に利益をもたらすことを追求します。

ブログ

  1. 名古屋のホームページ制作会社 花のや
  2. 花のやブログ
  3. Shopifyを触ってみました
2021/12/17ECホームページ制作

Shopifyを触ってみました

こんにちは。ECサイトのaspサービスShopifyというのをご存知でしょうか。
今回はShopifyについて触ってみたため、何が良くて何が大変だったかを軽く説明してみます。
※一度しか触っていないいわばファーストインプレッションのようなものですので
今後より触っていくことによって使いづらかった点でも評価がひっくり返ることもあります

カスタマイズするのに良かった点

  • かなり自由度が高い
  • テンプレートエンジン(liquid)がわかりやすい

ちょっと使いづらかった点

  • スケルトンテーマがあると嬉しい
  • assetsファイルが階層化できない
  • テンプレート(テーマ)の管理・カスタマイズ

自由度が高い

ある意味本当に自由です。
決済画面移行は他のASPと同じくさわれませんが、
それ以外の画面であればいわばwordpressEC-CUBE等よく使われているCMSテンプレートを触るのと同様にかなり好きなように触れます。
また、Shopifyのテンプレートエンジンliquidに設定をjsonで記述することによって、カスタムフィールドのように管理画面のカスタマイズ画面からの設定を色々と作ることが可能となっています。
https://shopify.dev/themes/architecture/settings#dynamic-sources
この部分だけでもかなり評価が高いです。

テンプレートエンジン(liquid)がわかりやすい

聞いたことがなかったものですが、twigとほぼ同等な記述でわかりやすかったです。
コメントアウトタグがちょっと冗長な気もしますが、フィルターやループ、各種判定、別のテンプレートファイルへの引数の受け渡しなども簡単でjsがわかる人ならすんなり受け入れられるかと思います。

スケルトンテーマがあると嬉しい

無料テンプレートが今現在9種類ありますが、どれも既に出来上がっているもののため、管理画面の設定画面からカスタマイズできるように書かれており、ホームページ制作会社が作るという点ではデザインベースで作ろうと思うと非常に時間がかかりがちです。
ある程度これができる、これはできないという部分をディレクター、デザイナー、コーダーが把握してからでないとむしろ完成させるまでに時間を取ってしまう羽目にもなりがちな為、ほとんど作り込まれていないベースのテーマがあると嬉しいかも。
この点はminimalテーマである程度軽減されるかとは思います。
翻ってファーストビューでの通信量などを考慮した作りになっているテンプレートもありますので、費用をかけずにさっと導入したい人のニーズで予め用意されているカスタマイズ(色味や画像の差し替え)だけであればいたれりつくせりで助かるかと思います。

assetsファイルが階層化できない

デザインマターで作ろうとすると、アイコンフォントなどだけでなく画像を切り出したものを部品として多く使いますが、とにかく階層下できないためcssやjsと合わせてすべてを一つのディレクトリに入れるしか無いのでかなりはかどりません。

テンプレート(テーマ)の管理・カスタマイズ

Shopifyのコードエディターはかなり使いやすいですが、やはりコーディングはローカルでやったほうが効率がいいのは確かです。
もちろんShopifyではそのようなことも考慮して、zip圧縮したテーマのアップロードという機能もありますが転送するための最大容量が50MB以内ということを考えると少々力不足な感じはします。
また、ローカルでの作業方法についてはtheme kitというものがちゃんと用意されているようです(先に調べておけばよかった)

感想

他のEC系ASPと比べて全体的に自由度が高く扱いやすい印象。
間口としては広く、ロゴの変更や、カラーなどの変更は作られているテーマによって管理画面から簡単に変更が可能となっていました。

自由度の高さでいえば、ホームページ制作会社も触りやすいですが、例えばヘッダーのロゴ、フッター等は一度作ったら変更することはないため静的に作ったほうが工数は減りますし、デザインベースでつくるので返って変更されないほうがいい為結局1から作り込んだほうが全体的にはスッキリと収まりそうです。
この場合は、どの部分を管理画面から簡単に変更できるようにするかを予めディレクションし、それに合わせたコーディング、及び組み込みをしていく必要がありそうです。オープンソースの組み込みとはまた別に少し違ったアプローチの仕方が必要になるのではないかなと思います。

また、組み込みに関してカスタマイズしやすいと言ってもsectionからsectionをインクルードするのにトリッキーなひと手間が必要だったり何でもできると言うほどでもないため注意が必要です。

しかし、これら上記の部分を踏まえた上でも充分に自由度が高く好印象でした。

 

参考

Shopify

この記事を書いた人:wada

エンジニア担当の和田です。 漆を塗ったりしていましたが最終的にプログラマーへと転職してしまいました。

LINEで送る
Pocket

人気記事ランキング

株式会社 花のや
〒460-0008
愛知県名古屋市中区栄2-14-5 山本屋本店栄ビル7階

花のやについて

お仕事のご依頼やご相談は、下記の電話番号
または、メールフォームよりお問い合わせください。
TEL.052-211-9898 / FAX.052-211-9899

お問い合わせ