MONOについているペロっと出入りするメニュー Headroom.jsを解説します

サイトのメニューは一番個性が出るところで、使い勝手にかなり影響するため、いろいろと検討されると思います。カラーミーショップでは、MONOテンプレートのヘッダーメニューはペロっと出入りして、挙動がおもしろいです。MONOテンプレートをカスタマイズ時の参考になりますので解説します。

カラーミーショップのレスポンシブサイトに必要な設定とviewportについて

カラーミーショップ制作を仕事にする場合は、ゼロからレスポンシブサイトを構築することもありますので、知識としてviewportについて知っておかなければいけません。カラーミーショップのviewportはどこで指定しているか解説します。

カラーミーショップのマイアカウント、会員登録、ログイン/ログアウトのリンクを整理する

ネット通販が広く利用される現代社会で生活していると、アカウント=会員と捉えがちですが、カラーミーショップの会員はすこし異なるようです。機能が重なっている部分もあるので、ヘッダー部分のリンク(マイアカウント、会員登録、ログイン/ログアウト)をシンプルにできないか検討しました。

カラーミーテンプレートの商品の横並び数を変更して崩れたときの直し方

カラーミーショップの有料テンプレートで、商品の横並び数を変更した際にレイアウトが崩れることがあります。その上自分で直せないことがよくあります。意外と難しくて詳しくコードを読まないと原因不明で、わりとよく聞かれますので解説しました。

カラーミーショップのオプションごとにカートボタンを付ける

オプションごとに「カートに入れる」ボタンを設置するレイアウトはときどき見かけます。これまでは、オプションを選択してからカートボタンで購入という手順でしたが、オプション選択の手間が一つ減りますので、購入しやすいかも、と思います。サンプルコードを書いてみました。

どこでもカラーミーで売切れ時にSOLD OUT表示する

「どこでもカラーミー」はブログなどの外部サービスにカートボタンをかんたんに設置する機能です。どこでもカラーミーの仕様では、売切れ時に「カートに入れる」ボタンが消えてしまい、売切れか、なんなのか、表示上わかりづらいです。これが不便で、SOLD OUT表示したいことがあります。

カラーミーショップ大賞2020からみる最近のショップデザイン

2020年で8回目となるカラーミーショップ大賞。今年も引き続きオファー制が採用されていて、ノミネートショップがガラッと入れ替わっています。ノミネートショップから流行りや気付いた点などを抜き出しました。今後のカラーミーショップ制作の参考にしてください。