少人数で初心者の方向けのホームページ制作教室、ワードプレスセミナーを開いています。 制作会社のノウハウを生かた個別レッスンです。東京・世田谷教室

simpler トップページ編集

ここではトップページの編集について説明します。

ヘッダーの編集

ロゴの変更

①ロゴ画像をダウンロードしてパソコンのフォルダーに保存
②管理画面の「外観」「ウィジェット」を開きます。
③「header01ロゴ」「Aite Origin Image」「Image file」に進む。
④「Coose Media」を押すとメディアライブラリーで画像一覧が表示される。
⑤パソコンのフォルダーからロゴ画像を選択し、画像一覧中にドラッグ&ドロップする。
⑥必要に応じ画像編集をした後「Set Media」で「ウィジェット」に戻るので「保存」を押して終了。

タイトルの変更

①タイトル画像をダウンロードしてパソコンのフォルダーに保存
②管理画面の「外観」「ウィジェット」を開きます。
③「header02タイトル」「Aite Origin Image」「Image file」に進む。
④「Coose Media」を押すとメディアライブラリーで画像一覧が表示される。
⑤パソコンのフォルダーからタイトル画像を選択し、画像一覧中にドラッグ&ドロップする。
⑥必要に応じ画像編集をした後「Set Media」で「ウィジェット」に戻るので「保存」を押して終了。

キャッチフレーズの変更

①管理画面の「設定」「一般」を開きます。
②「キャッチフレーズ」の内容を書き換えます。
③編集が終了したら「保存」を押して終了です。

サイドバーの編集

メニューの変更

①管理画面の「外観」「ウィジェット」を開きます。
②一番上の「sidebar01サイドバー」にある「ビジュアルエディター」に各メニュー項目があります。
③変更したい「ビジュアルエディター」を押す編集画面になります。
④ここで項目名とリンク先を変更します。
⑤編集が済んだら「保存」を押して終了です。

新しいウィジェット追加(画像、テキストなど)

①管理画面の「外観」「ウィジェット」を開きます。
②一番上の「sidebar01サイドバー」にある「ビジュアルエディター」に各メニュー項目があります。
③左の「利用できるウィジェット」の使いたい項目を「sidebar01サイドバー」にドラッグ&ドロップします。
④ウィジェットを編集します。
⑤編集が済んだら「保存」を押して終了です。

フッターの編集

メニューの変更

①管理画面の「外観」「ウィジェット」を開きます。
②「Layout Buileder」「Open Builder」に進みます。
③「カスタムメニュー」の行でカーソルを右端に置くと表示が表れるので「Edit」を押し編集します。
④メニューが不要の場合は「Delite」を押して消去します。
⑤現在メニューを選択には「menu04」が使われています。
⑥メニュー項目を変更するには「外観」「メニュー」から項目を変更します。

コピーライトの変更

①管理画面の「外観」「ウィジェット」を開きます。
②「Layout Buileder」「Open Builder」に進みます。
③「ビジュアルエディター」の行でカーソルを右端に置くと表示が表れるので「Edit」を押し編集します。
④編集が終わったら「done」を押して保存します。
⑤さらにもう一度「done」を押して保存します。
⑥「ウィジェット」に戻ったら「保存」を押して終了です。

サイト配色の編集

基本カラー

全体の色調を変更したい場合、例えばデフォルトの基本からの青をより濃くしたいときはサイトのCSSファイルを変更します。
この場合、基本色「steelblue」を「darkblue」に変更してみましょう。
「外観」「テーマの編集」からCSSファイルを編集します。
エディタを使ってカラー名を「steelblue」から「darkblue」にすべて置換して保存します。

メニュー項目のカラー

メニュー部分等は、下記の項目をCSSプログラムの修正で変えることができますが、修正を間違えると、サイトがアクセス不能になったりすることがありますので注意して行ってください。
(下記に項目から、どの部分の色を変えたいか選択します)

配色を変更するには、以下の各項目のカラーネームまたはカラーコードを希望色に書き換えます。
( )内は現在の配色です。
※の記述では★★★★★で表示してある行です。
0.各ページ見出しh3ボーダー左5px(steelbule)★基本色★
1.ヘッダー、キャッチフレーズ背景色(steelbule)★基本色★
2.グローバルナビ、背景色(#eee)
3.グローバルナビ、文字色(dimgray)
4.グローバルナビ、ホバーの文字色(steelbule)★基本色★
5.グローバルナビ、ホバーの背景色(#fff, #ddd)グラデーション
6.グローバルナビ、現在ページの文字色(black)
7.グローバルナビ、現在ページの背景色(#ddd, #fff)グラデーション
8.サイドバー、タイトル文字色(#fff)
9.サイドバー、タイトル背景色、背景マーク画像付(steelbule)★基本色★
10.サイドバー、メニュー文字色(#333)
11.サイドバー、メニュー背景色(#fff, #ddd)グラデーション
12.サイドバー、ホバーメニュー文字色(steelbule)★基本色★
13.サイドバー、ホバー時メニュー背景色(#ddd, #fff)グラデーション
14.サイドバー、現在ページメニュー文字色(#555)
15.フッター、背景色(steelbule)★基本色★

※参考・・・HTML色見本:カラーネームで指定できるWebカラーの見本
http://www.hi-ho.ne.jp/douton/htmlcolor.html

 

お気軽にお問い合わせください

  • Facebook
  • Hatena
  • twitter
  • Google+

講習予約について

現在、講師の都合により臨時休講しています。ご迷惑をおかけしますがよろしくお願いします。
新規受講は現在受付けてません。

講習を始めるに当たり「事前アンケート」の記入をお願いします。
ご記入は、こちらから どうぞ。

ホームページ作成はこちらまで

独自ドメイン取得のご案内


自分専用のホームページアドレスを使う場合は独自ドメインを事前に取得しておくと効率的です。
※ムームードメインがお勧め!

レンタルサーバーのご案内


事前にご自分でレンタルサーバーの契約をしておくと、サイト制作がスムーズです。
※ロリポップがおすすめです。

お勧めパソコンは MOUSE

私も十数年使っています。日本製で安いし使いやすい。乃木坂46のテレビCMを最近よく見ますね!

高性能レンタルサーバー

PAGETOP
Copyright © ビジネスサイト制作教室 All Rights Reserved.
Powered by WordPress & BizVektor Theme by Vektor,Inc. technology.