welcart対応のwordpressレスポンシブテーマを作りました

相変わらず集中すると他の事に手がつけられなくなる性分で、久々の更新となりました。
何をやっていたかは本題で。

welcart対応　無料レスポンシブテーマの製作

タイトルの通りですが、wordpressのショッピングカートプラグイン【welcart】に対応したレスポンシブテーマを作ってみました。
サンプルサイトはコチラ＞＞ riffles

今回作ったきっかけは、やはりwelcartの素晴らしさ。
この素晴らしいプログラム無料で配布しているコルネ様。本当に心から尊敬で御座います。

そんな、welcartと出会うきっかけになったBlancの作者様のmamekko様(Welcart カスタマイズ ブログ)に影響を受けて作ってみたワケです。

レスポンシブデザイン

当然ながらレスポンシブデザインを採用しておりますので、表示解像度に合わせた可変型のテンプレートです。
自分で作ってみて思いましたが、素晴らしく大変です(汗)
ＣＳＳフレームワークを利用しても、ここまで苦労するとは思いませんでした。

モバイル分岐

見ている端末のユーザーエージェントでモバイル分岐させ、画像の最適化を行っています。
PC用のデカイ画像を読み込ませては重くなりますので、モバイル端末でも読み込みしやすい設定です。

スキーマーマークアップ

コレはさほど難しくありませんが、グーグル推奨のスキーマーでマークアップしています。
instokとoutstokをphpで切り替えているので、在庫が無いときは検索の段階で在庫無しと表記されます。

自作モーダルウィンドウ

個人的には面白いモーダルウィンドウを作ったと思います。モーダルウィンドウと言っても、中身はフレックススライダーなので超軽量なのですww

高画質ボタン

モバイル分岐させ、モバイル用の画像を最適化すると高画質ディスプレイで画質が落ちてしまいます。その際、SCRSETで回避も出来ますが、3G環境では重くなってしまいますのでユーザーの判断で選べるようにボタンを設定しました。
配布テーマでは、ウィジット化して使わない場合は非表示に出来るのと、リロードでキャッシュ判別で画像を取得させる仕様にしたので汎用性を高めました。

SKUのシンプル化

SKUはテーブルにまとめて、出来る限りシンプルに作りましたので、一般的なショッピングサイトのデザインに近くなっていると思います。

まとめ

主に、気を使ったのはそんなトコロですが本当に苦労しました。
無料で配布しますので、友人や親しいお客様からは【何の意味があるの？】と聞かれますが、意味はありません。主にスキルアップです。
ですが、ささやかとは言えwelcartの普及に貢献出来るかも知れません。
少し前の時代では、良いものを知ったり覚えたら、隠して自分だけのモノや知識にするのかも知れません。ですが、今は時代が違うと思います。
本当に良いものは普及すべきだと思います。良いものでも淘汰されてしまう時代です。お世話になった、感謝した、何かしらあるなら行動しても良いと思います。

それに、僕は小さな小売店さんに頑張ってもらいたいです。大手ネットモールはマージンも高いし、月額も高くて、苦しみますよね？　僕もそうでした。昔はお店で商売が出来たのに時代と共に少しずつやり方が変わりました。
どうか、そこで苦しんでる小売店さんがいたらwelcartを使ってみてもらいたいです。集客こそ自力ですが、サーバー代程度の超ローコストショップが出来ます。
ネットモールは確かに便利ですが、その流れの中で小さな小さな小売店が淘汰されるのはとても悲しい事です。何かの機会で、ウチのサイトを訪れる事があったら少しサンプルサイトを覗いてやってみて下さい。

最後に、welcartの設定や、諸所プログラム部分で困った事があればMamekko様のWelcart カスタマイズ ブログがカナリ参考になります。welcartやってみよう!!と思ったら必読ですよ。

ではでは、機会があれば書いたプログラムの事とかも更新しますが、もし宜しければ作ったテーマ使ってみてやって下さい。
サンプルサイトはコチラ＞＞ riffles
(プロでは無いので、不具合があっても責任は持てませんのでご了承下さいmUUm)

2016/1/18追記　現在は上の説明とテーマの仕様が異なっています。また別のテーマも公開していますので　RiffleHatch Themes　をご覧ください。ちなみに忙しい時は更新出来ません。

---

---