Shopay(WordPressテーマ)のカスタマイズ

Shopayをカスタマイズするには、大きく分けて機能面とデザイン性をカスタマイズすることになります。最初に取り組むべきは、テーマカスタマイザーを使う、cssの追加をすることでしょう。どちらも手段が複数ありますので、事前に理解して取り組まれるとよいでしょう。プラグインを利用すれば高度なカスタマイズが可能になります。プログラムスキルをお持ちの場合は、直接テンプレート(PHP)ファイルを書き換えるカスタマイズになります。コードを直接編集する方法はリスクも高いので、よく理解されている方以外にはおすすめできません。
Shopay
テーマカスタマイザー
Shopay には、ルートから独自のWebサイトを構築するのに役立つ包括的なドキュメントガイドが付属しています。ライブプレビューで構成できるカスタマイザが組み込まれています。これらに加えて、完全に応答性が高く、モバイルフレンドリーで、あらゆる種類のデバイスに適合します。ワンクリックのデモインポートプラグインのサポートにより、あなたのウェブサイトを驚くべきオンラインストアに変えます。
Shopayは高度にカスタマイズ可能で美しくデザインされたネットショップ向けWordPressテーマで、WooCommerceを完全にサポートしています。あらゆる種類のeコマースストアと完全に統合されており、すべての広範な機能が搭載されています。 WooCommerceおよびYITH WooCommerceプラグインと完全に互換性があり、究極のeコマースの価値を提供します。さらに、カラーオプション、7以上のホームページウィジェット、サイドバーのレイアウト、ヘッダーとフッターのカスタマイズなどが含まれます。
WordPressは無料で利用できるCMS(Contents Management System)であることから、多くの企業やブロガー、アフェリエイターによって運用されています。利用数が多いといことは、同じようなサイトが存在するといううことになります。そこで、サイトをカスタマイズして他のサイトと差別化しビジネスに役立てませんか。
Shopay のカスタマイズは多岐にわたって設定できるようになっています。
Theme Options
Gerneral (一般) |
|
---|---|
Header |
|
Homepage |
|
Design | Sidebar Layout |
Footer |
|
Shopay のメニューは以下のような設定になっています。
- Footer Navigation
- Footer Site map
- Header Navigation
- kind
- Post-navi
- Production
- s-menu-etc
- s-menu-tapm
- size
- tpd-size
ウイジェット
Shopay のウイジェットは以下のように、サイドバーとフッターに配置されています。
- Sidebar
- Footer Sidebar1
- Footer Sidebar2
- Footer Sidebar3
- Footer Sidebar4
- Footer Sidebar5
css(スタイルシート)でカスタマイズ
部分的に色を変更したり、背景や囲みを装飾、文字の大きさを変更したりしたいのであればcss(スタイルシート)を追加することになります。「スタイルシート・css」記述するには、「テンプレートファイルに直接記述」する、「テーマカスタマイザーで記述」する。「プラグインを使って記述」などの方法があります。
ブロックエディタ対応のテーマではブロックごとにタイポグラフィ(「文字や文章を読みやすく、または美しく見せるための技術」)を指定できるので、文字の大きさや色を指定したい場合は、こちらを利用されたほうが良いでしょう。
注意点)スタイルシート・cssが大きくなりすぎると表示速度に影響を及ぼすこともあるので注意が必要です。
テーマカスタマイザーの「css追加」は複雑なコード編集は、編集エリアが狭く操作しづらいですが、テーマの更新よって上書きされることはありません。逆にテンプレートファイルの「style.css」は上書きされるので、子テーマで対応するか、バックアップをとり対応するかになります。推奨は「css追加」となっています。
css(スタイルシート)を追加するには、ダッシュボードの 外観 → カスタマイズ → 追加css と進みコードを追加します。スタイルシートを適用させるには編集ブロックに 高度な設定で 「追加 css クラス」にクラス名を記述します。スタイルはブロック対して適用されるようになっています。複数のブロックに適応させたいならブロックをグループ化しておきます。
ページごとに css を記述したい場合はプラグインを利用すると良いでしょう。「VK All in one Expansion Unit」の cssカスタマイズ を有効にしておくと、ページごとに スタイルシートを追加することができます。
テーマによってはあらかじめ、ページごとに css を記述できるようにしたものもあります。複雑なデザインを施したいサイトの場合はこちらを選ぶとよいかもしれません。
テンプレートファイル(PHP)でカスタマイズ
テンプレートファイル(テーマファイル)のカスタマイズは、外観 → テーマファイルエディタで編集することになります。テンプレートファイルの構成は各テーマによって異なっていますが概ね以下のようなファイルで構成されています。
- スタイル(style.css)
- テーマの関数
- 404テンプレート
- コメント
- テーマフッター
- テーマヘッダー
- 検索フォーム
- 単一テンプレート
テンプレートファイルを直接編集してカスタマイズすることもできます。ただ、この方法は高度な知識を必要とされますので、十分な知識をお持ちの方におすすめなります。記述ミスによって画面が表示されなくなったり、管理画面にログインすらできなくなったりすることもあります。
集客・収益の向上に貢献するWordPress

中小企業や個人事業でWEBサイトを運用する理由は、自社の商品やサービスの認知を広げたり、サイトがあることで信頼感の増加により新規取引への期待になることでしょう。
あるアンケートによると経営者の多くが発注する際に「取引先のサイトを参考にする」と回答しています。そこでおすすめなのがWordPressによるコーポレートサイトやビジネスサイトの運用です。なかでもおすすめなのは、有料テーマを利用した運用です。
コーポレートサイトは企業の顔とも言えるため、企業のイメージに沿ったデザインが求められます。有料テーマは多くのデザインが用意されていて、自社のイメージに沿ったデザインを選びやすくなっています。
デザイン着せ替え機能付きビジネス向けテーマ「ザ・トール」、検索エンジンからの集客マニュアルがついている「賢威」、CTAやランディング・資料請求ページなどWEB集客機能が充実したテーマ「エマノン」、多言語が可能な企業サイト用テーマ「LIQUID PRESS」がおすすめになります。
子テーマを作成する
テンプレートファイルを直接編集してサイトを運用するなら子テーマを利用しましょう。なぜならWordPressは頻繁にアップデートが繰り返されソースコードが上書きされてしまい、再びカスタマイズをしなければならなくなってしまうからです。
子テーマの作り方
「子テーマ」は、WordPressでウェブサイトやブログのデザイン・レイアウトを構築する際に、「親テーマ」と連動して機能するもうひとつのテーマです。 WordPressのデザインテンプレートは、「テーマ」を有効化させることで構築されます。
WordPressのカスタマイズ手順
WordPressをカスタマイズするには下記の手順で行うとよいでしょう。
- WEBサイトの構成を考える (※注1)
- 不要な機能を削除する
- 必要な拡張機能(プラグイン)を追加する
- グローバルナビゲーションやサイドメニューを作る
- TOPページを作る
- 企業サイトなどは、会社案内や事業内容などを作る
- お知らせや、ブログ(製品やサービスをカテゴリーに構成する)を設置する
※ 注1)固定ページ・投稿ページのコンテンツを書き出す。そしてカテゴリーやタグを振り分ける。などの設計書・制作ガイドラインを作成しておくと作業をスムースに進めることができ、修正が発生しても最小限の工程で完結できるようになります。
テーマの選び方
WordPressテーマを選ぶ際、ビジネスサイトでは、自社のイメージと近いデザインを選びましょう。中小企業や個人事業主の場合、高度なカスタマイズは負担が大きすぎ、デフォルトのデザインでサイトを作成し運用していくことが多いようです。このため、ビジネスサイトにおすすめな有料WordPressテーマを利用されるとデザインのカスタマイズが容易だったり、必要な機能がプラグインによって提供されているので、サイト運用開始時や運用中の負担を軽減できます。
テーマを選ぶ際にはにはレスポンシブデザインかどうかは着目しましょう。レスポンシブデザインとは、スマートフォンやタブレット・PC別に1つのデザインで表示できるようにしたものです。サイトの内容によってはスマホユーザーが少ないこともあるでしょうが、Googleはモバイル端末での表示を標準と考えていますので、この点からも対応すべきポイトです。
- レスポンシブデザインなのか
- デザインをカスタマイズしやすいか
- ダウンロード数(利用されている数)が多いのか
- ブロックエディタに対応しているのか
- 日本語に対応しているのか
- テーマは安全なのか
ザ・トール(有料テーマ)
ザ・トールは、圧倒的に美しくおしゃれなテーマです。ランキングサイト・口コミサイトやおしゃれで美しいデザイナーズサイトが簡単に作れます。アクセスUP、収益UPを強力に後押しする「集客・収益化支援システム」が搭載されていて、コーポレートサイトやビジネス用メディアブログ、ブロガー・アフィリエイターなどの利用に適しています。
【THE THOR(ザ・トール)】
Emanon(有料テーマ)
企業サイトやビジネスサイト、オウンドメディアに必要なWeb集客機能と自由度の高いレイアウト機能を搭載しています。見込み客を増やすためにメルマガ登録や資料請求、セミナーに誘導する仕組みがあるWebサイトをWordPressで作りたい企業におすすめです。
個人事業主・中小企業向けWordPress 有料テーマ Emanon
有料テーマ
WordPress有料テーマはおしゃれでカスタマイズしやすいのが大きなメリットです。 WEBサイト運用するための機能も標準として装備されているので、プラグインの追加をしなくても十分使用することが可能です。
無料テーマはシンプルなものが多く、他のサイトとデザインが同じようになってしまうこともあります。 しかし、有料テーマであればカスタマイズしやすくなっているため、好みのサイトを作成しやすいのが特徴です。
無料テーマ
wordpress.org からダウンロードできるテーマやWEB制作会社から提供される無料テーマもあります。無料とは思えないほど機能やデザインが充実しているテーマもあります。ただし、無料がゆえに途中で更新がストップしたり、開発が終了されることもあります。無料テーマは開発者の宣伝や有料版へのステップとして提供されていることもあると認識しておきましょう。
wordpress.org のテーマはディレクトリ登録時に事前に審査が行われるので、製作者サイトからの直ダウンロードに比較すれば安全といえるでしょう。ただし、サポートはありませんのでwordpress.orgやネットの情報で自力で解決しなければなりません。