Posted on Leave a comment

Woocommerce Storefront ページ毎にスタイルシートを読み込む ブログ運用

ライター画像
By : Nobuyoshi Designer

こんにちは。最近Twitterでつぶやくのにハマってます。
woocommerce-stylesheet-jp woocommerce-stylesheet

 

ショップ用に作られたWoocommerce、情報が少ない中で
色々設定をいじるのは少し抵抗がありませんか。

カート決済があるシステムなので「どこまで改変できるか」という所が問題ですが、
工夫すれば思った以上には頑張れる感じなのと、カートがあるWoocomerceページ以外は
そのまんまワードプレスという感じです^^

実はこのブログもWoocommerce基本テーマの Storeflont のテーマを改変して作られていますのでご参考ください。

 

ポイント
このページではWoocommerce の基本テーマ Storefront で
ページ毎に違うスタイルシートの読み込みを説明します。

 

Index

 

Woocommerceでショップを運営しながらブログも執筆する

 

Woocommerce でショップを運営しながらワードプレスでブログをする方法は3種類あり、

1.ドメイン直下にフォルダを作り別のワードプレスを入れる(サブディレクトリ)
http://hag-r.com/blog

2.サブドメインを取得し別のワードプレスを入れる
http://blog.hag-r.com/

3.投稿ページだけ専用のスタイルシートを読み込む

 

このHAG-rのサイトを作る際に僕が選択したのはこの3番めの方法です。

 

個人的には過去に欲張って中規模のサブディレクトリ運用のサイトを作ろうとしてモチベーション的に失敗してしまった事があるので、
(先にサブディレクトリにおく内容を重視して作ってしまって、メインURLのコンテンツが空気になって後悔しました)

もうただのブログなんだし、Woocommerceはショップが主役だし、基本はSEOでなく広告戦略だという所で納得をして、自分のモチベーションを最優先に運用できる環境を選びました。

ショップページでは表現できない事をブログで表現できたら理想です。

 

1と2の方法のメリットはお気に入りのワードプレスのテーマなどがあればすぐに導入できデザイン的な問題は解決に近いです。
またAmebaブログなど国内にも良いブログサービスがあるため、それならデザインを気にする事なく一番気軽に、さらに高品質にブログ運用できる可能性もあります。

ぜひご自身の用途や希望にあったブログ運用方法を見つけてくださいね。

 

Woocommerce Storefront でページ毎にスタイルシートを読み込む

 

 

さて、ブログ運用の話が長くなりましたが、こちらは
ブログのためのCSSだけでなくWoocommerceショップ全般的にも使える条件分岐です。

■の間部分にCSSへのパスを入れ替えて入力します。

(Woocommerceでは必ず子テーマ「storefront-child など」を作り、さらにバックアップをとって改変しましょう)

 

ショップページの条件分岐は下記3つの複数条件のいずれかにかかる場合に発動します。
(複数条件の場合「||」で区切ります)

is_woocommerce() アーカイブ、商品ページを含めたwoocommerce全般
is_front_page() ストアトップページ
is_page() 決済ページへの導入など必要な固定ページを個別で入力します

woocommerce公式ページには条件分岐タグが一覧で確認できます。
>>Woocommerce公式ページ

 

ストアトップページだけ違うCSSに

 

is_front_page()

 
ストアトップページにだけに違うCSSスタイルを適用させます。
トップページだけに使うbxsliderなど javascript のプログラムを導入したりするのに需要がありそうですね。

<?php if (is_front_page()): ?>
 
<?php endif; ?>

・・・の間にトップページだけに表示したい内容やプログラムを記述します。

 

上記ではCSSを直接記述してしまいました。HAG-rではショッピングカートやフッターなどトップページでは表示させたくなかったので、display:noneで結構強引に消しています。

無駄なCSSは多いはずですので、これが嫌ならWoocommerceのショップページとスタイルを変えるブログ運用はやめておいた方が良いでしょう。

 

Woocommerce で商売を考えているユーザーは絶対数が少ないです。

情報も少ないのでトライ&エラーでやるしかないのはツライところですが、
言葉の壁がある日本人にとって海外販売はある意味チャンスなのかもしれません。

しっかりバックアップとって、リスクを減らしてショップ制作を頑張っていきましょう!

 

日本と海外では文化が違う。商品ページでも商品説明文を変えたり工夫が必要じゃ



 そうだねえ 



6+
   Click!  URL&Title will be copied




Articles that are read well

    Sorry. No data so far.