Help us understand the problem. What is going on with this article?

Wordpressテーマ(Xeory Extension)のテーマカラーをカスタマイズする

More than 3 years have passed since last update.

WordpressテーマXeory Extension(https://xeory.jp/template/xeory-extension/)
のテーマカラーで望んだ色がなかったため、追加してみた。

編集するファイルは以下のとおりです。
1.lib/admin/init.php
2.style.css
3.sass/style.scss

全てXeoryExtension内のファイルです。

init.phpの編集

230行目辺りからカラーの設定
配列に以下のようにセット

init.php
<?php
        $colors = array(
          0 => 'default',
          1 => 'color01',
          2 => 'color02',
          3 => 'color03',
          4 => 'color04',
          5 => 'color05',
        );

        $color_scheme = trim(get_option('color_scheme'));
        if(isset($color_scheme) && $color_scheme !== ''){
          $color_scheme = trim(get_option('color_scheme'));
        }else{
          $color_scheme = 'default';
        }

      $active_template_name = basename(get_stylesheet_directory());


    ?>

そして、256行目辺りの「カラー設定」に以下のように追記

<h4>カラー設定</h4>
    <p class="setting_description"><small>ベースとなる配色を選択して下さい。</small></p>
    <ul class="color-radio cmb_id_bzb_color_scheme">
    <li id="color-1" style="display:inline-block;padding-right:18px;">
    <input type="radio" name="color_scheme" id="color_scheme1" value="default" <?php checked($color_scheme, 'default');?> /> 
    <label for="color_scheme1">デフォルト</label>
    </li>
    <li id="color-2" style="display:inline-block;padding-right:18px;">
    <input type="radio" name="color_scheme" id="color_scheme2" value="color01" <?php checked($color_scheme, $colors[1]);?> /> 
    <label for="color_scheme2">水色</label>
    </li>
    <li id="color-3" style="display:inline-block;padding-right:18px;">
    <input type="radio" name="color_scheme" id="color_scheme3" value="color02" <?php checked($color_scheme, $colors[2]);?> /> 
    <label for="color_scheme3"></label>
    </li>
    <li id="color-4" style="display:inline-block;padding-right:18px;">
    <input type="radio" name="color_scheme" id="color_scheme4" value="color03" <?php checked($color_scheme, $colors[3]);?> /> 
    <label for="color_scheme4"></label>
    </li>
    <li id="color-5" style="display:inline-block;padding-right:18px;">
    <input type="radio" name="color_scheme" id="color_scheme5" value="color04" <?php echo ($color_scheme == $colors[4]);?> /> 
    <label for="color_scheme5"></label>
    </li>
<!-- ここから↓追加 -->
    <li id="color-6" style="display:inline-block;padding-right:18px;">
    <input type="radio" name="color_scheme" id="color_scheme5" value="color05" <?php echo ($color_scheme == $colors[5]) ? 'checked' : '';?> /> 
    <label for="color_scheme6">ピンク(#ffd1e8)</label>
    </li>
<!-- ここまで↑ -->
    </ul>

そうすると、こんな感じで追加されます。
スクリーンショット 2016-09-10 17.35.57.png

style.css, scssの編集

4128行目あたりから始まるカラースキームのcolor04のスタイルをパクってcolor05を新しく作成します。

スクリーンショット 2016-09-10 17.25.46.png

あとは、一応.scssにも追加しておきます。
スクリーンショット 2016-09-10 17.43.01.png

後は変更保存すればこのように表示されます。
スクリーンショット 2016-09-10 17.43.46.png

yumayamada1029
多分日本で一番Spotify APIを触ってる人。 音楽共有プラットフォームDIGLEとか開発してます。 https://digle.tokyo https://mag.digle.tokyo
https://digle.tokyo
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした