【THE THOR ザ・トール】超初心者のオリジナルボックスの作り方

アナログ母Limoの挑戦。ワードプレスでブログを作る!

超初心者向けにワードプレスでのブログを作るために必要な情報をまとめています。

アナログ母Limoの環境

サーバー ConoHa wing
テーマ THE THOR ザ・トール
パソコン MacBook Air

【THE THOR ザ・トール】には10種類のボックスがあらかじめ用意されていましたが、その中に、どうしても好みのボックスがなかったアナログ母のLimo。

本日は

こちらのボックスの作り方をまとめました。

アナログ母でも、クリックとペーストだけで作ることができましたよ。

 

 

【THE THOR ザ・トール】超初心者のオリジナルボックスの作り方は3ステップ
①デザインを選ぶ
②色を選ぶ
③『外観』>『カスタマイズ』>『パーツスタイル設定』>『ボックス設定』を変更。

 

基本的なボックスの使い方が分からない方は、まずはこちらの記事をおすすめ。

【THE THOR ザ・トール】超初心者の基本的なボックスの使い方はこちら。

おすすめ記事

アナログ母Limoの挑戦。ワードプレスでブログを作る! 超初心者向けにワードプレスでのブログを作るために必要な情報をまとめています。 アナログ母Limoの環境 サーバー ConoHa wing テーマ THE THOR ザ・[…]

 

【THE THOR ザ・トール】オリジナルボックス設定の場所

まずはボックスの設定の場所を覚えましょう。

ワードプレスのコントローパネルの『外観』>カスタマイズ

テーマ『THE THOR』のコントロールパネルをスクロールして下の方。
『パーツスタイル設定』

『ボックス設定』を選ぶと、スタイルの中のボックスを変更ができます。

【THE THOR ザ・トール】では、10種類の好きなボックスを登録できるようになっています。

タイトルとスタイルを変えることによって、自分好みのボックスを作ることができます。

 

【THE THOR ザ・トール】 ボックス 一覧

【THE THOR ザ・トール】では、最初からボックスが10種類用意されています。
それが、こちら。。。。

サブタイトルボーダーボックス
BIG括弧ボックス
方眼ペーパーボックス
はてなボックス
ビックリボックス
Qボックス
Aボックス
シンプルアイコンボックス
背景アイコンボックス
帯アイコンボック
この中から自分が使わなさそうなボックスを選んで、それを変えることで、オリジナルのボックスをつくることができます。
Limoは6番目のQボックスを自分好みのボックスにすることにしました。

【THE THOR ザ・トール】デザインの設定

今日はこちらのボックスの作り方をご紹介します。
オリジナルボックスのサンプルはこちらのサイトから見つけました。
【THE THOR ザ・トール】ボックスのデザインサンプル
カスログ for THE THOR

THE THOR のエディタから挿入できるボックスデザインのサンプルと、デフォルトのデザインからの変更方法をまとめてみま…

本当にいろんなボックスのデザインサンプルがあるので、きっと好きなデザインが見つかるんじゃないかしら。

①サイトから好きなデザインを選ぶ。

Limoはこちらのボックスサンプル10を選びました。
赤丸のところをコピー。

②カスタマイズのボックス設定を変更

自分のワードプレス、
ワードプレスのコントローパネルの『外観』>『カスタマイズ』>『パーツスタイル設定』>『ボックス設定』にて、
ボックス6の設定を
■タイトル:オリジナルBox点線 オレンジに変更
■スタイル:先ほど選んだデザインのコード(赤丸)を貼り付けました。

③忘れずに公開ボタンを押す。

④確認

投稿ベージ<スタイル<ボックスをみると、
上から6番目のQボックスが、先ほど設定したオリジナルBox点線オレンジに変わっています。
でも、このまま選んでも、当たり前ですが、サンプルの水色のままです。
どうやったら、オレンジのボックスにできるんだろう?

【THE THOR ザ・トール】色の設定

水色の点線から、オレンジ色の点線に変更するには、
コピーした赤丸のコードの一部をオレンジ色の名前に変更する必要があります。

①好みの色とその名前を見つける

自分の好きな色はこちらのサイトから見つけました。
【THE THOR ザ・トール】色見本
ネイネイの喜怒哀楽

こんにちは! また一つ変更ができるようになったネイネイ(@NEYNEYx2)です。 この記事では、WordPressテー…

このBorangeという色をコピー。

②ボックスのスタイルの色を変更する

青線の場所 Lsky (水色)→Borange(オレンジ)に変更。

③忘れずに右上にある公開を押す。

④確認

投稿ベージ<スタイル<ボックス<オリジナルBox点線オレンジを選ぶと、
無事に、希望のオレンジの色に変わりました。

まとめ

【THE THOR ザ・トール】超初心者のオリジナルボックスの作り方は3ステップ
①デザインを選ぶ
②色を選ぶ
③『外観』>『カスタマイズ』>『パーツスタイル設定』>『ボックス設定』を変更。
アナログ母Limoにもなんとかできました。
この方法でいろんな種類のBoxをデザインと色の組み合わせで、作ることができるので、嬉しいですよね。

本日の必要なリンクまとめ

【THE THOR ザ・トール】超初心者の基本的なボックスの使い方

おすすめ記事

アナログ母Limoの挑戦。ワードプレスでブログを作る! 超初心者向けにワードプレスでのブログを作るために必要な情報をまとめています。 アナログ母Limoの環境 サーバー ConoHa wing テーマ THE THOR ザ・[…]

【THE THOR ザ・トール】ボックスのデザインサンプル
カスログ for THE THOR

THE THOR のエディタから挿入できるボックスデザインのサンプルと、デフォルトのデザインからの変更方法をまとめてみま…

【THE THOR ザ・トール】色見本
ネイネイの喜怒哀楽

こんにちは! また一つ変更ができるようになったネイネイ(@NEYNEYx2)です。 この記事では、WordPressテー…

 

 

 

 

Advertisements
最新情報をチェックしよう!