FXコピートレードやイーサリアム投資、カスタムアバターの制作・販売を楽しむ週刊マネタイズマガジン

  1. コンテンツ販売
  2. 59 view

週間SHP|サイトの外観をデザインする

ZuCcie オンラインショップ トップページデザイン

WooCommerceとStripeを使ったWordPressオンラインショップを構築するにあたり、WooCommerce用の無料テーマ「Enwoo」のデモ版をインストールして設定後に、TCD「Ankle」に切り替えて外観のデザインを整えました。

Enwooのインストール

WordPressの管理画面の左メニューから「外観 > テーマ > 新規追加」をクリックして、「enwoo」を検索窓に入力しインストール後に有効化します。

WordPressテーマ「Enwoo」のインストール

Demos」をクリックすると、無料の8種類のデモ版を試せるので、一通り試した後で、私の場合は「#1」を選びました。

WordPressテーマ「Enwoo」のインストール フリーテーマ

WordPressテーマ「Enwoo」のインストール フリーテーマ一覧

WordPressテーマ「Enwoo」のインストール #1テーマ

デモ版をインストールすると、ブログ記事や商品のサンプルがインストールされますが、これらはテーマを変更しても残るので、「Ankle」にテーマを変更後もデザインを整えるのに使えて便利です。

WooCommerceのインストールと設定

私の場合は「Enwoo」の設定からWooCommerceもインストールしてウィザード形式で設定を完了させました。

WooCommerce 初期設定

「Ankle」のオンラインマニュアルではWooCommerceの設定方法などについても、日本語でわかりやすく解説しているので参考になります。購入後にマイページからログインして参照できます。

WooCommerce 初期設定 TCDテーマ「Ankle」のWooCommerceマニュアル

WooCommerce 初期設定 完了画面「ストア設定が完了しました」

オンラインショップの外観をデザインする

「Ankle」のデモサイトを参考にして外観デザインを整えます。

「Ankle」のデモ画面デザイン

今回は、ブログ記事はWEEKlizmDAZignerの各ブログの関連記事を3つほどリライトして使いました。商品については多少時間がかかるので、現段階ではとりあえずデモ版の商品を仮にそのまま使用しています。

ZuCcieサイトの初期設定画面デザイン
ZuCcie.com 2023-01-22 現在
ZuCcieサイトの初期設定画面デザイン 商品リスト
ZuCcieサイトの初期設定画面デザイン ブログ フッター

関連記事

PAGE TOP