テスト
ブログ画面左上に背景が簡単に変更できるメニューを作りました。
メニュー内の各リンクをクリックすると背景が変更されます。
その１：初期状態の模様
その２：柄をよりハッキリさせた模様
その３：背景なし（薄いパープルにしています）
背景が決定したらこのメニューは削除いたします。
宜しくお願いたします。
メニュー内の各リンクをクリックすると背景が変更されます。
その１：初期状態の模様
その２：柄をよりハッキリさせた模様
その３：背景なし（薄いパープルにしています）
背景が決定したらこのメニューは削除いたします。
宜しくお願いたします。
作業内容が多くなりましたので、メニューを作ってみました。
１．ヘッダーと記事のあいだの部分の色変更
ブログトップ、記事一覧などのアイコンが表示されているまわりの部分。
※すでに作業していただいている箇所です。
２．ヘッダー上部分の色変更
ヘッダー上のパープルの部分。
３．メニューまわりの色変更
サイドメニュー全般。３箇所変更する必要があります。
１）メニュータイトル部分の色変更
２）メニューの周囲の色変更
３）各メニューの色変更（レッスンメニューのみ）
４．全画面でブログを確認
それではよろしくお願いいたしますm(__)m
お忙しい中、いろいろ作業していただきありがとうございます。m(__)m
１．ヘッダーと記事のあいだの部分の色変更
ブログトップ、記事一覧などのアイコンが表示されているまわりの部分。
※すでに作業していただいている箇所です。
２．ヘッダー上部分の色変更
ヘッダー上のパープルの部分。
３．メニューまわりの色変更
サイドメニュー全般。３箇所変更する必要があります。
１）メニュータイトル部分の色変更
２）メニューの周囲の色変更
３）各メニューの色変更（レッスンメニューのみ）
４．全画面でブログを確認
それではよろしくお願いいたしますm(__)m
お忙しい中、いろいろ作業していただきありがとうございます。m(__)m
色を全て変更した後、ブログを全画面表示して確認したい場合は、画面右上の「ｘ」をクリックしてください。右半分の画面が消えて、ブログが全画面表示されます。
（下画面の赤い枠のところです）
再度、色を調整したいときは、また[F12]をクリックして編集画面を表示して、それぞれの色の変更をしてください。
（下画面の赤い枠のところです）
再度、色を調整したいときは、また[F12]をクリックして編集画面を表示して、それぞれの色の変更をしてください。
サイドメニューの色を変更する方法です。
サイドメニューの部分は３つに分かれております。
（１）メニュータイトルまわりの色
（２）メニュー部分のまわりの色
（３）メニュー文字のまわりの色（レッスンメニューのみ）
最後に（３）メニュー文字のまわりの色（レッスンメニューのみ）
これはレッスンメニューのみに適用されます。
この赤枠の部分の色です（分かりやすいように色を変えています）
基本的な操作方法は他の色編集作業と同じですので、
異なるところを中心にご説明いたします。
（１）Google Chromeを起動して、サンプルブログを開き、[F12]キーを押してください。右半分に文字が沢山出てくる画面が表示されます。
（２）画面中央の上部にある、虫ネガネのアイコンをクリックします。虫ネガメのアイコンです。クリックしてアイコンが青色になったらOKです。
（３）キーボードの[Ctrl]キーを押しながら[F]キーを押してください。
（[Ctrl]キーがキーボードの左下にあります）
画面右側の真ん中あたりに文字を入力するフォームが表示されると思います。
ここまでの操作方法は同じです。
（４）キーボードで「skinSNavi」と入力してください。大文字と小文字を間違えないようにご注意ください。
入力し終わると同時に画面右側の上部に黄色のマーカーがついた「skinSNavi」という文字が表示されると思います。
↓こんな風に「skinSNavi」が出ていたらOKです。その「skinSNavi」と同じ行の左にある、右を向いた三角のをクリックしてください。（下画面の赤い枠のところ）
（５）クリックした三角が下を向いて、その下に文字が表示されます。その中にある「li」と書かれた行の左にある、右を向いた三角をクリックします。（下画面の赤い枠のところ）
（６）クリックした三角が下を向いて、その下に文字が表示されます。その中にある「体験レッスン」と書かれてあるあたりをクリックします。（下画面の赤い枠のところ）
（７）画面右側の真ん中に、色を設定している箇所が出てくると思います。その中にある「background-color」と書かれた横にある、小さな■をクリックします。（下画面の赤い枠のところ）
あとは色編集の画面になるので、操作して色を調整してください。
サイドメニューの部分は３つに分かれております。
（１）メニュータイトルまわりの色
（２）メニュー部分のまわりの色
（３）メニュー文字のまわりの色（レッスンメニューのみ）
最後に（３）メニュー文字のまわりの色（レッスンメニューのみ）
これはレッスンメニューのみに適用されます。
この赤枠の部分の色です（分かりやすいように色を変えています）
基本的な操作方法は他の色編集作業と同じですので、
異なるところを中心にご説明いたします。
（１）Google Chromeを起動して、サンプルブログを開き、[F12]キーを押してください。右半分に文字が沢山出てくる画面が表示されます。
（２）画面中央の上部にある、虫ネガネのアイコンをクリックします。虫ネガメのアイコンです。クリックしてアイコンが青色になったらOKです。
（３）キーボードの[Ctrl]キーを押しながら[F]キーを押してください。
（[Ctrl]キーがキーボードの左下にあります）
画面右側の真ん中あたりに文字を入力するフォームが表示されると思います。
ここまでの操作方法は同じです。
（４）キーボードで「skinSNavi」と入力してください。大文字と小文字を間違えないようにご注意ください。
入力し終わると同時に画面右側の上部に黄色のマーカーがついた「skinSNavi」という文字が表示されると思います。
↓こんな風に「skinSNavi」が出ていたらOKです。その「skinSNavi」と同じ行の左にある、右を向いた三角のをクリックしてください。（下画面の赤い枠のところ）
（５）クリックした三角が下を向いて、その下に文字が表示されます。その中にある「li」と書かれた行の左にある、右を向いた三角をクリックします。（下画面の赤い枠のところ）
（６）クリックした三角が下を向いて、その下に文字が表示されます。その中にある「体験レッスン」と書かれてあるあたりをクリックします。（下画面の赤い枠のところ）
（７）画面右側の真ん中に、色を設定している箇所が出てくると思います。その中にある「background-color」と書かれた横にある、小さな■をクリックします。（下画面の赤い枠のところ）
あとは色編集の画面になるので、操作して色を調整してください。