2019/02/27
1 ブログのトップページを作ろう！
こんにちは。今日は、WordPress(ワードプレス)で、あなたのブログの見た目をつくりましょう。
とくに、トップページのところ。このブログで言えば、ここの部分。作業としては15分ほどです。
こんな感じで今の画面はシンプルだから。ここに、色をつけて写真をはってもらいます。
あと、緑のちょっとしたメニューのところ。
WordPress(ワードプレス)でブログをつくるときに、はじめてやるカスタマイズになるけど。コピペ・クリック・ドラッグができればOKです。簡単につくってしまいましょう。
ちなみに、この次の記事で、ワードプレスに便利機能の追加と設定をしてもらうんだけど。この2つが終わると、いつでもブログが書ける状態になります。
で、デザインは、必要ミニマムで大丈夫です。もちろん、こだわってもいいけど。ブログ記事をたくさん書いていかないといけないし、長くやっている人は、意外とシンプルだよってことも頭の隅に入れて、作業を完了させてしまいましょう。
それでは行きましょうか！
2 カスタマイズ、最高峰のスキルを持つものたちの宴にようこそ！ん？
大きな流れです。
①ブログの背景の色を決めて、写真をはってもらう
②トップページにプロフィールとかのメニューをつくってもらう
それだけです。
一応確認だけど。あなたのブログのテーマと画像は用意できていますよね。先に、ブログのデザインテンプレート(テーマ)と、写真は用意ができていないといけません。
カスタマイズって、ブログのデザインテンプレート(テーマ)のメニューから入っていくので、もし、入っていないときは、さきに、ブログ背景になるデザインパーツが必要になります。よければ、こちらの記事を見て下さい。
あと、写真がないときのために、こちらの記事もあげておきますね。
1 テーマを選んでカスタマイズ
カスタマイズするテーマ(デザインテンプレート)を選びましょう。どのデザインテンプレートの見た目をアレンジするのってところなので。
ちなみに、このブログでは「マテリアル」を使っているので、こういった付箋のようなデザインをベースにして、見た目をアレンジすることになります。
一般的なSTINGER(スティンガー)の方で説明しますね。でも、いいたいことはテーマを選んでからカスタマイズだよってことです。
2 子テーマをカスタマイズして
ワードプレスメニューから「外観→テーマ」を見てください。
テーマのところに、子どものChild(チャイルド)って文字が見えますよね。STINGER(スティンガー)にも、親テーマと子テーマがあります。
ここで知るべきは、子テーマをカスタマイズするってことです。Child(チャイルド)と書かかれた子テーマを「有効」にしてあげてカスタマイズしてください。
上級者向けだから正確な意味はスルーしてほしいけど。ニュアンスはね。親テーマはテーマを開発している人が新しいものを上書きすることがあります。
テーマもプログラムだから、開発者が欠点を改良してアップデートしてくることがあって、せっかくカスタマイズしても、親テーマは上書きされて消されちゃうことがあるので、デザインをさわるときは子テーマを選んであげるんだよってとこです。
なので、ワードプレスメニューから「外観→テーマ」を選んで、Child(チャイルド)と書かかれた子テーマを「有効」にしてください。
3 カスタマイズスタート
ワードプレスメニューから「外観→カスタマイズ」を選択します。
デフォルトの画面とはちょっと違うだろうけど、大体こういう画面のはずです。
設定するところは、赤と緑のところ。ブログの名前を入れて(赤)。ブログのトップ画像をつくる(緑)。すぐ終わります。行きましょう！赤いところ「サイト基本情報」をクリックしてください。
あなたのブログのタイトルを入れていきます。
1 ブログ名とトレードマークを入れよう！
こういう感じ。ちなみに、下のキャッチフレーズは入れなくても大丈夫です。
いつでも変更できるので、色々試して大丈夫です。
次にサイトアイコンを設定しましょう。サイトアイコンってあなたのブログのトレードマークです。
赤いところを見てください。Yahoo! Japanの 「Y!」のところありますよね。左側のデフォルトは白い紙ですが、ここにアイコンを設定できます。
もちろん、いらない場合は設定しなくても大丈夫です。でも、設定する場合は、「画像を選択」をクリックしてください。
画像をアップするので、あなたのPCにある画像を選択してください。「ファイルを選択」をクリックします。
今回は、犬のアイコンを！イラストはイラストACから持ってきています。画像下にある「選択」をクリックします。
イラストAC：https://www.ac-illust.com/
画像が大きいので、ジャストサイズに切り抜いてあげる必要があります。四角の枠をドラッグして小さくしてください。
「画像切り抜き」ボタンを押します。
ワンちゃんが反映されているはずです。オレンジのところをクリックして、基本画面に戻りましょう。
2 色は記事以外の背景の色
スタートアップは白でいいはずです。
ちなみに、緑を選ぶと、頭と右のところが緑になります。
3 背景画像を入れよう
背景を入れていきましょう。これも画像を選択してアップします。
ちなみにこのブログではこういった背景画像を入れています。画像の位置は調整してください。感覚的に操作できるはずです。
4 ブログの頭のところにくる画像を入れよう
ヘッダー画像も入れましょう。画像を選択します。
実は、頭のところにくる画像って幅が小さいんです。どこの場所を使うか。上下で指定して「画像切り抜き」ボタンをクリックしてください。
5 公開ボタンをおせば終了
上にある公開をクリックすると、ブログの見た目としては完了です。
3 トップページにプロフィールとかのメニューも作りましょう。
このブログで言うと、ここにあたるものです。これはワードプレスメニューの「固定ページ」というところで作ります。ホントは、プラグインって便利機能を先に入れないといけないので、今日は形だけつくってあげます。
1 固定ページで新規に追加
プレスのメニューから「固定ページ→新規追加」をクリックしてください。下のメニューごとにページを4つ作ります。
①ホーム
②お問い合わせ
③目次
④プライバシーポリシー
ちなみに、順番があります。トップページの左から並べたい順で、順番にならぶよう、1から4とかの数字を入れてあげてください。
あとは、オレンジのところのように、①「ホーム」と文字を入れていって、公開ボタンをおすとページができます。
もちろん、それを②お問合せ+公開。③目次+公開。④プライバシーポリシー+公開と4つのページを作ります。
作業としては、トップページの4つのページを公開して終わりです。
4 まとめ
お疲れ様でした。これで、ブログのトップページが出来上がりました。形がだいぶできてきたのでないでしょうか。
次は、ワードプレスにちょっとした便利な機能を入れてもらいます。セキュリティとか、人気のページが表示されるように、ちょっとした操作をしてもらうのですが、それをプラグインって読んでいます。
このプラグインって、最初、何を入れていいのかまったくわからないです。色々な選択ができるから。なので、スタートアップのときのおすすめとして、おすすめを書いてしまいます。
ちなみに、ブログをやっているうちに、必要なものが判断できるようになってきます。この辺は、一通りさわってみないとイメージができないところだし、こんなのがいいかなって探し出すのは、ちょっと大変なので、ヒントになりそうなことを書いてみたいと思います。
でも、最初としては、ワードプレスにはじめから入っているプラグインが3つあるので、それをどうするかについて説明してしまいます。
ブログの立ち上がりとしては、だいぶ間近になっているので、もうすぐですよ。頑張ってください。
