1. はじめに
  2. Welcartの準備
  3. テーマのインストール
  4. カテゴリー設定
  5. 固定ページ作成
  6. ナビゲーション設定
  7. カラースキーム設定
  8. メインイメージ設定
  9. フォント、レイアウト設定
  10. ウィジェット設定
  11. トラブルシューティング

Welthemes

SIMPLY 設定マニュアル


テーマのご利用ありがとうございます。

ここでは、当テーマを利用する場合に必要な設定方法のみを解説しています。Wordpressのインストール、Welcartそのものの動作や機能についてはそれぞれのサイトのドキュメントが便利です。

Wordpressは準備できているという前提で、Welcartのインストールから初期設定、テーマカスタマイズまで解説します。想定所要時間は15分〜30分です。

このマニュアルは、WordPressやWelcartのアップデートに合わせ随時内容を更新していきます。

Welcartの準備


Welcartのインストールに従ってWelcartプラグインをインストールします。


ショッピングサイトとしての基本的な準備

どんなテーマを利用するかに関わらず、まずはショップとしての基本設定を行なってください。

Welcart公式マニュアル「準備 最初にすべきこと」

基本設定には店舗情報、支払い方法、クレジット決済設定、配送設定、メール設定などがあります。少なくとも基本設定と配送設定だけ設定があれば、ショッピング機能が動作するようになります。その他まだ確定していない情報についても、設定欄だけ確認しておくと便利です。デフォルトテーマでショッピングサイトの動作が確認できたら、テーマを変更しましょう!

テーマのインストール


親テーマ「Welcart Basic」インストール

「Welcart Basic」はWelcart公式サイトよりダウンロードできます。価格は0円となっていますが、Welcartへの会員登録が必要です。Welcartを利用する上ではWelcart公式サポートは不可欠となり、常にレベルの高いサポートを提供されていますのでどのテーマを利用する場合も会員登録をお勧めします。

https://www.welcart.com/archives/4286.html

「Welcart Basic」をインストールできたら、管理パネルの「外観」から”Welcart Basic”を有効化します。

サイトデザインが「Welcart Basic」のものになれば、インストールは完了です。


テーマファイルをアップロード

Welthemesからダウンロードしたテーマフォルダを /wp-content/themes/ ディレクトリに解凍したテーマフォルダをアップロードします。あるいは、zipファイルのまま管理画面の「テーマのアップロード」からインストールします。

アップロードしたテーマが管理画面に現れたら「有効化」をクリックします。


デザインの確認

サイトを表示させてデザインが変更されていれば完了です。

カテゴリー設定(商品管理用とブログ用を作成する)


商品カテゴリーの作成

Wordpress管理画面 > 投稿 > カテゴリー へ移動します。

Welcartのカテゴリー構成にあるように、Welcart では商品データを「商品(item)」というカテゴリーで括っています。商品の配下には「お勧め商品(itemreco)」、「新着商品(itemnew)」、「商品ジャンル(itemgenre)」というカテゴリーがあります。
商品をさらに細かいカテゴリーに分けたい場合は「商品ジャンル」の配下にジャンルカテゴリーを作っていくことになります。

例えば「インテリア」「キッチンツール」「ステーショナリー」という商品カテゴリーがある場合、それぞれを新規に作成し「親」として「商品ジャンル」を指定します。

商品登録の際、設定した子カテゴリーだけでなく、親となる「商品」にもチェックを入れてください。


ブログ用のカテゴリー作成

ブログを書く場合はブログ用のカテゴリーを作成します

初期設定カテゴリーでは商品に関するものしか作成されていないので、ここで「ブログ」というカテゴリーを作成しておきます。スラッグは「blog」としてください。「親」は無しとして独立したカテゴリーとして管理します。

ここまでの設定で、ひとまずWelcartの基本設定、配送設定、商品情報の登録や商品画像のアップロードを始めても大丈夫です。1つ2つの商品をアップして確認してみてください。

固定ページ作成(必要となるページを作成する)


ブログトップページの作成(ブログがある場合は必須)

Welcartのデフォルト状態では、ブログトップページというものがありません。お知らせの文章だけが唐突に表示されるという形式になっています。ショッピングサイトとブログを分かりやすく共存させるため、ブログトップページを作成します。

Wordpress管理画面 > 固定ページ > 新規作成 で「ブログ」という名前のページを作成します(このタイトルは自由なもので構いません)。本文は空欄のまま、右側にある「テンプレート」を「BLOG TOP」に設定します。そして公開をクリックして完了です。


お問い合わせフォーム(必要であれば)

Welcartにシンプルなお問い合わせフォーム機能が搭載されています。

Wordpress管理画面 > 固定ページ > 新規作成 で「お問い合わせ」というページを作成し、右側にある「テンプレート」を「INQUIRY」に設定します。

Welcartで用意されているのは名前、メールアドレス、内容のみのシンプルなフォームとなります。もしより複雑なフォームが必要であれば「Contactform7」などの専用プラグインをご利用ください。


その他

その他、「特定商取引法のページ」「お店の紹介」「ご利用ガイド(お支払い方法、配送料)」を自分で作成したい場合などがあれば自由に作成してください。ページ属性を「なし」とすることで本文欄に入力したものが反映されます。

もし原稿が用意できていなくても、最初にタイトルだけでページ作成しておくと整理しやすくなります。

カラースキーム設定


背景色:サイト全体の背景色を指定します。

コンテンツ文字色:サイト全体の文字色を指定します。背景色の上に乗る部分の全てに反映されますので、コントラストを考慮して読みやすい色に。

テキストリンク文字色:商品説明やブログ本文などにテキストリンクを指定した場合の色となります。

テーマパーツカラー:サイト全体で背景には埋もれないパーツ(ウィジェットタイトルなど)の色となります。背景色だけではないテーマカラーとして利用します。

テーマパーツカラー上の文字色:テーマパーツカラーの上に重なる文字色

アクセントカラー:購入ボタンなど、比較的重要な部分でのアイキャッチカラーとして使用されます。

アクセントカラー上の文字色:アクセントカラーのボタンが読みづらくならないよう調整します。

ヘッダー画像上の文字色:ヘッダーにキャッチコピーなどを設定した場合の文字色

トップページヘッダー画像設定


WordPressの基本機能「ヘッダー画像」からアップロードします。1枚だけの固定画像、あるいは複数画像のスライドギャラリーが生成されます。スライドギャラリーの場合、順序の指定はできません。

写真をアップロードすると、まずファイル名が写真に重なって表示されます。つまり、画像に設定したファイル名を変更することで、キャッチコピーとして利用することができます。

写真にキャッチコピーやリンクを設定する

管理画面「メディア」から、先ほどアップロードした画像を選択し、画像の詳細設定ウィンドウで以下の項目を入力します。

タイトル:メインキャッチ

キャプション:メインキャッチ下のタグラインテキスト

説明:その画像からリンクさせたい場合、リンク先URLを入力

キャッチなどを表示させたくない場合はそれぞれ空欄にします。リンク先URLを入力すると、「VIEW MORE」というボタンが表示されます。このボタンはカラースキームの「アクセントカラー」から変更することができます。

テーマオプション


フォント設定

サイト全体のフォントを使い分けることで、ポップな雰囲気や清楚な雰囲気に合わせることができます。

ヘッダー、見出しの書体:ヘッダー部分、コンテンツ内の見出しなど、大きく目立つ部分のフォントを指定します。フォントは「ゴシック体」「明朝体」から選択します。

本文エリアの書体:本文などの小さなフォントを指定します。見出しのフォントが明兆の場合にゴシック、ゴシックの場合に明朝、などとあえて使い分けることで、雰囲気を出しすぎない、雰囲気を壊さずに読みやすくする、などの工夫ができます。




サイドバー設定


サイドバーの表示レイアウトを「右サイドバー、左サイドバー、1カラム」から洗濯します。



トップページヘッダー写真の幅


PC画面でのヘッダー写真の幅を、コンテンツの最大幅までとするか、ウィンドウ幅いっぱいに広げるかを設定します。(タブレット・スマホ表示では画面幅100%となりこの設定は影響しません)



トップページのお知らせタイトル


「ブログ」を設定するとトップページに最新記事のタイトルを表示できます。ここではその見出しタイトル、そしてそのパーツを表示するかどうかを設定できます。

お知らせに表示される投稿は、カテゴリースラッグが「blog」であるもののみとなります。



商品リストカテゴリーと商品リスト件数


これはWelcart Basicと共通した設定で、トップページに表示させる商品一覧を、どのカテゴリーから選ぶか、またその商品数を設定できます。

ウィジェット設定(サイドエリアを活用する)


現在、ウィジェット設定はブロックエディタになっていますが、ブロックエディタは直感的に使いにくいと感じる方が多く、またウィジェットによっては余計なタグが入ってしまうようです。そのため、ウィジェット設定を従来のシンプルなものに戻すプラグイン「Classic Widgets」をインストールします。

プラグインの新規追加から「Classic Widgets」を検索してインストール、有効化してください。

ウィジェット設定はエリアが3つに分かれていますが、サイト全体でシンプルに1パターンのみが表示されるようになっています。

サイドバー(1カラムの場合 右)

サイドバー(1カラムの場合 中央)

サイドバー(1カラムの場合 右)

サイドバーレイアウトを「2カラム」で利用する場合、どれか1つのエリアに必要なウィジェットを全て入れても構いません。ただし、それぞれのエリアでは「何も設定されなければおすすめのウィジェットを出す」という性質があるため、もし全て自分で決めたい場合は、ウィジェットを3つのエリアに適当に分けて配置します。

サイドバーレイアウトを「1カラム」で利用する場合、ウィジェットはサイト下部に並びます。その際、ウィジェットエリアは3列に分けてレイアウトできますので、その場合に上記の3エリアを使い分けます。

サイドエリアはシンプルに

Welcartでは、ウィジェットに沢山の機能が用意されています。例えば

などなど。あったらあったで便利なような気がする機能ばかりですが、とことんシンプルにすることをオススメします。視界に余計なものがないほど商品写真や文章が浮き出てきますし、その場の雰囲気が出てくるからです。チラシやセール情報が張り巡らされたお店も売る物によっては良いかもしれませんが、上質な空間でモノ選びを楽しめるショップ作りは、オンラインでも伝わってくるものです。

トラブルシューティング

その他、トラブルの時

問題がある場合、それがWordPressの動作なのか、Welcartの動作なのか、テーマなのか、判断がつかない場合があります。原因を切り分けるためにはまずテーマを「Welcart Basic」にしてみてください。その状態で同じ問題が出る場合、Welcart自体が正常に動作していない可能性が高いため、Welcartの問題事例しゅうや公式フォーラムでのトピック検索をお試しください。

Welcart Basicでは問題が発生しない場合、利用しているテーマの問題である可能性が高いためWelcart公式サポートではなく、Welthemesに直接お問い合わせください。

更新履歴

2022.1.27 ver1.1.5 ヘッダー画像の切り抜き時にエラーが出る場合がある不具合を修正、ヘッダー画像のスライドスピードを最適化を行いました。

2022.3.20 ver1.2.0 表示に関する改善、その他軽微なレイアウト調整を行いました。

2022.7.5 ver1.2.1 トップページでの売り切れ表示「SOLD OUT」をWelcartの翻訳表示に統一しました。

2022.8.28 ver1.2.2 トップページでのPHPバージョンによるエラー表示の対応

2023.11.5 ver1.2.3 テーマアップデート(更新通知)機能のライブラリを「theme-update-checker」から「plugin-update-checker」に変更しました。