【WelcartBasic】子テーマの作り方

WordPress
2021.03.29

Welcart Basicは無料で使えるので、サイトにカゴをつけたいときによく使われます。

しかし子テーマが無いために、カスタマイズがし難い欠点があります。

どうすれば子テーマを作ることができるのでしょうか？

今回の記事は、上記のような悩みを解決する手順で書き進めていきます。

 

こんにちは、chasmblogの管理人モトです。

ブロガーとして本格的に活動を始め、12ヶ月目になりました。

4月29日からは毎日更新中です。

ブログで広告収入を得るために疑問に思ったことや問題点を記事にしています。

【Welcart Basic】子テーマの作り方【手順】

Welcartの親テーマは無料でダウンロードできますが、子テーマの配信はしていないようです。

僕はMacBookを使っているので、Macでの作成しやり方で書いていきます。

✔︎本記事の概要

  • 子テーマ作成に用意するもの
  • 子テーマ作成の手順
  • まとめ

今回はこのような流れから考えていきます。

1.子テーマ作成に用意するもの

まずは公式サイトから親テーマをダウンロードします。

Welcart Basic
Welcart 専用親テーマ　Welcart Basic
www.welcart.com

中から使用するファイルを取り出すために解凍しておきましょう。

2.子テーマ作成の手順

始めに新規フォルダをデスクトップに作成し、welcart_childと名前を付けておきます。

welcart_childのフォルダを開いて、中にfuncと言うフォルダを作成します。

welcart_childの中に先ほどダウンロードした親テーマから3つのファイルをコピペします。

コピーする3つのファイル

  • functions.php
  • screenshot.png
  • style.css

functions.phpをテキストエディターなどで開いて、内容を全選択して下記のコードと置き換えます。

<?php
/*****************************************************************************
ファンクションロード
/******************************************************************************/
/* jquery&cssロード */
get_template_part('func/setting/theme_setting');

style.cssをテキストエディターなどで開いて、下記の説明部分を下記の説明コードに置き換えます。

/*
Template:welcart_basic
Theme Name:welcart_child
*/

コピペや置き換え作業が完了すると下記の画像のようになります。

funcを開きsettingと言うフォルダを作成します。

settingの中にfunctions.phpをコピーし、名前をtheme_setting.phpに変更します。

functions.phpを開き全選択して下記のコードと置き換えます。

<?php
/*****************************************************************************
CSSやスクリプトファイルの読み込み
*******************************************************************************/
function theme_setting() {
/* スクリプトファイルの読み込み */

/* CSSファイルの読み込み */
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'parent-cart' , get_template_directory_uri() . '/usces_cart.css', array('parent-style', 'usces_default_css') );
}
add_action('wp_enqueue_scripts', 'theme_setting');
?>

これを圧縮してzipファイルにします。

完成したzipファイルをWordPressのテーマにインストールして有効化してください。

3.まとめ

子テーマ作成に失敗するとWordPressが動かなくなりますが、すぐに登録メールの方に通知が来るので焦らずにメールを待ちましょう！

送られてきたURLからログインし直して、失敗した子テーマを削除すれば問題は解決します。

ダメな場合はもう一度最初からチャレンジしてください。

今回もご閲覧ありがとうございました。

おすすめの書籍

【初級者向け】これでわかる！WordPressの親テーマ・子テーマのこと (わかるWeb)
created by Rinker

コメント

  1. 平松 より:
    2022年3月5日 12:08 PM

    間違っていたらすみません

    『funcの中に先ほどダウンロードした親テーマから3つのファイルをコピペします。』

    と書かれてますが、『welcart_childのフォルダの中に』の間違いではないですか？
    コピペや置き換え作業が完了すると下記の画像のようになります。の画像では
    そのように見えますが?

    『functions.phpを開き全選択して下記のコードと置き換えます。』

    なにも分からない初心者にとっては、
    このfunctions.phpは今名前を変更したfunctions.phpなのか
    welcart_childのフォルダの中のfunctions.phpなのか迷います

    しかし、本家の説明より丁寧且つ詳細で分かりやすかったです

    ありがとうございました。

    返信
    • moto takigawa moto takigawa より:
      2022年3月5日 8:59 PM

      平松さん
      ご指摘ありがとうございます。
      welcart_childの中ですね、funcフォルダと同列にコピペするように書き直しておきます。

      返信
タイトルとURLをコピーしました