Day4:二番目の設定【「デザイン」(スタイル/レイアウト/テーマ/スキン)の決定】
皆さん、今日ワン!>凹U^ェ^U…垂れ耳犬です!!
さあ今日は中日の四日目…今日は、自分のブログの「管理画面」【DashBoard】へ入って、ブログの”デザイン“とかをイジってみましょう!!【今日は、殆どがマウスでの作業となります】
では、早速、「自分のブログ」【ここでは、”Bloggerdesu’s Blog“】へアクセスし、(昨日やったように)「管理画面【DashBoard】へ行ってみましょう!!
[注]ココから先は、WEBブラウザー【IE:InternetExplororやFF:FireFoxなど】でリンクを”右”クリックし、新しい”タブ”で開いてみて下さい。そうすれば、いちいち新しくブラウザーを立ち上げることなく、”タブ”の切り替えだけで「解説」と「サイト」を見比べながら読み進めることができます。
[↓※ちゃんと、「管理画面」(DashBoard)が表示されましたか!?※↓】
※さて、左側にずらーっと並んでいるメニューの中ほど【上の画像では薄いピンク色で塗っている所】に[外観]というのがありますね!?そこが今日専らイジる所です。
~[外観]の所にマウスポインターを持っていくと薄~い”▼印”が浮かび上がると思いますので、それを(左)クリックして下さい!!
⇒下図のように、「プルダウン・メニュー」が表示される筈です。
[↓※こんなメニューが見えてくることでしょう!?※↓]
1.テーマ(Theme):ブログのでデザイン(外観)についての設定をします
2.ウィジェット(Widgets):サイドバーなどでのウィジェット(ブログパーツ)についての設定をします
3.Extras(その他):ここは当面は何も触れないでよいでしょう
4.Custom Header(カスタムヘッダー):ヘッダーをイジる場合ですが、ここもそのままで
5.ヘッダーの色:CSS等にあまり詳しくない場合は、イジらないほうがよいでしょう
6.CSSを編集:これは、超難関の作業ですので、触らないで下さい
※それでは、個別に解説していくことにしますね。【各メニューを(左)クリックして開いてみて下さい】
《ミニ解説》
・WPの構造:基本的に、「テンプレート」と言うのですが、”PHP“というコアファイルと”CSSというレイアウトファイルを組み合わせてページを表示しています
・基本テンプレート:”index.php“+”style.css”
・ブログの”レイアウトパーツ“:”index.php“は順々に次の”レイアウトパーツを呼び出します
~”index.php“→”header.php“【ヘッダー】→”sidebar.php“【サイドバー】→”footer.php“【フッター】
・CSSの役割:詳細な”レイアウト“規定や”文字装飾“などについてコントロールします
…という”豆知識”を念頭に置いて、「管理画面」【DashBoard】の[外観]ボタンまたは[テーマ]ボタンを押して下さい!!
[↓※こんなページが見えてくることでしょう!?※↓]
~ココは、”テーマ“【PHPファイルとCSSファイルのセット】のギャラリーサイトみたいなものです。【全部で50個近くのテーマ・セットが並んでいます。1ページに15個ずつ表示しています】四番目(二段目の先頭)に薄いピンク色に塗っているテーマがありますね!?この”Andreas04“というのが、私がこのブログで使っているテーマです。
※では、この”Andreas04“というテーマのサムネイル(縮小)画像を(左)クリックして見て下さい!!
⇒何と!このテーマを利用した場合の”プレビュー”画面が浮かび上がってきますよね!?
[↓※こんな画面が浮かび上がってくるでしょう!?※↓]
~一通り見終わったら、左上の[×]ボタンを押して元の画面に戻って下さいね
※同じ調子で、他の”テーマ“も”プレビュー画面”で見てみて下さい。
~デザインはココで[ボタン]一発で切り替えられるのです。簡単だし楽チンでしょ!?【これが、WPをオススメする大きな理由の一つでもあります】
※じゃあ、次に進みましょう!!
~今度は、左のメニューの[テーマ]のスグ下の[ウィジェット]ボタンを押してみて下さい!!
[↓※こんな画面が浮かび上がってくるでしょう!?※↓]
※この「ウィジェット」【Widgets】というのも、WPの魅力の一つで、サイドバーなどによく使われる”ブログパーツ“をマトメたもの。
~代表的なものは -
・アーカイブ:(過去の)投稿履歴をマトメたもの【年月別/最新版/カテゴリー別など、いろいろなバリエーションがあります】
・カテゴリー:投稿のテーマやジャンルをまとめやたもの
・カレンダー:アーカイブと連動させたものです
・タグ・クラウド:いわゆるトピックスとなるキーワードを集めマトメたものです
・テキスト:(X)HTMLやCSSの知識があれば、ココへ自由に”PR文”などを表示させることができます
・ブログ統計:内蔵の”WP-Stats“を利用して、”アクセス数“や”人気の記事“などを表示させることができます
・ページ:(ブログとは独立した)”ページ“を自由に表示させることができます【「静的なページ」または「固定ページ」とも言います】
・メタ:いわゆる「サイト情報」や「管理者のためのページ」へのリンクです
・リンク:”相互リンク“や”お気に入り“のリスト集です
・検索:このブログ内を”検索“するためのリンクです
…等々、様々な便利なツールが揃っています。
※今回、私たちのブログはまだ出来たてのホヤホヤですから、コンテンツもウィジェットも何もありません。なので、練習として、「カレンダー」を表示させてみましょう!!
~この[ウィジェット]画面で、左側には使用可能な”ウィジェット・バー“がズラーっと並んでいますね!?
その上から三番目に[カレンダー]バーがあるでしょう!?
それを、右側にある(まだ何もない空っぽの)”[サイドバー(1)]“の所へ”ドラッグ&ドロップ“してみて下さい!!
⇒”[サイドバー(1)]“のプルダウンメニューが開いて、タイトル:が書き込めるようになります。そこへ「カレンダー」と書き込んでみて下さい!!
⇒書き込んだら、右下の[保存]ボタンを押して下さいね
~これで、あなたのブログに「カレンダー」が追加されました!!
※さて、またまた[テーマ]メニューに戻りましょう!!【(左)クリックして下さい!!】
~先ほどの”[テーマ・ギャラリー]に戻ると思いますので、再度”Andreas04“のテーマをプレビューします
⇒今度は、プレビュー画面で右上の“Andreas04を有効にする”のリンクを(左)クリックします【つまり、”Andreas04“のテーマを使うということです】
⇒三度、[テーマ・ギャラリー]に戻りますが、左上に「現在のテーマ:Andreas04」と表示されているでしょう!?
⇒Blogのタイトルである”Bloggerdesu’s Blog“のスグ右隣に[サイトを表示]というボタンがあるので、これを押して下さい!!
[↓※こんな画面が見えてくることでしょう!?※↓]
※どうですか!?少しは、ブログらしくなってきましたね…先ほど設定した「カレンダー」が右側のサイトバーにちゃんと反映されていますね!?
~尚、この”Andreas04“のテーマには次のような特徴があります。
・左側に「コンテンツ(投稿記事)」を、右側に”二列”の「サイドバー」を表示するタイプ
・「サイドバー」のトップは「アバウト(ページ)」であり、ココは[ウィジェット]からではなく、[ページ]の所で編集しないと反映されないこと
・「サイドバー」の内、外側は”デフォルト設定“済のものであり、[ウィジェット]から設定できるのは”内側”のサイドバーだけであること
※WPの”とっつきやすさ“については理解していただけたのではないでしょうか!?
★本日はココまで!! 少しはなじんできたので楽しかったでしょ!?
⇒明日〔第五日目〕は、いよいよ「三番目の設定」【投稿(エントリー)の準備】です!!
~あなた自身の”コンテンツ”を作る準備に取り掛かりますよ!
♪fitted BGM〔Richard Burmer〕:Across the View performed by Richard Burmer, 1987!?
【↑ ※リンクをクリックすると、WMP:WindowsMediaPlayerが立ち上がり曲が聴けます※↑】
※このコーナーでは、邪魔にならない”癒し系”【NewAge】の音楽のほうがイイでしょう!?【BGMは要らないよ…という人はクリックしないで下さいね】