こんばんみ!
初めましての方は始めまして。
初めましてじゃない方は、こんばんは。
恋人のいない引きこもりのお兄さんは、同志やで!
ということで。
ライオンです、こんばんみ。
前回に引き続き、この画像に特に意味はありません。
━─━─━─━─━─
ということで、SWK(猿でも分かるカスタマイズ)
第2回目です。
今回は、前回説明したCSSについて具体的に説明していこうと思います。
サルでも分かる感じでゆっくりまったり進めていきます。
誰も取り残されないようにね!
さてさて前回、カスタマイズとはCSSで指示を出すんだよ、と説明しました。
では、実際カスタマイズのための下準備をしていきましょう。
━─━─━─━─━─
まずカスタマイズのことについて
根本的に勘違いしてらっしゃる人がたまにいます。
おそらくですがパソコンからだと
今、アメブロの既存のデザインを使用してらっしゃる方がほとんどだと思います。
こういった感じだったり。
こんなのだったり。
いろんなデザインを選ぶことが出来ますよね。
実際僕もカスタマイズする前は、こういったデザインを使ってました。
間違った解釈をされているのが、
『カスタマイズって、このデザインに付け加えるんでしょ?』
ということです。
例えば、今使ってるデザインのヘッダー画像(一番上の画像)だけオリジナルにしたい。
だったりとか。
背景画像だけ、もうちょっと可愛らしいのに変更したい!とか。
そういうことではありません。
カスタマイズとはそもそも、付け加えていく形ではなく
イチからブログを作っていく。
というイメージです。
ですので、カスタマイズするとなると、今使ってらっしゃるデザインは消去しなくてはいけません。
ここを勘違いなさってる方がたくさんいらっしゃるようなので注意してください。
また、これから実際にカスタマイズを解説していきますが
注意点があります
まず、オリジナルにカスタマイズするからと言って
必ずしも、既存のデザイン以上のクオリティになるとは限りません。
プロの方がやるならまだしも
我々、初心者がおっかなびっくり手を出すわけですから
出来栄えやクオリティは、期待出来ません。
むしろ、既存デザインよりもクオリティは下がると考えたほうがよいかもしれません。
実際僕のブログも、既存のデザイン以上のクオリティかと問われれば
必ずしもそういうわけでもないと思います。
画像なんかも荒かったり、既存のデザインよりページが重かったり。
劣ってると取れる部分は多々あります。
ですが、それでもオリジナルのデザインを構築するって
結構楽しいことでもあります(`・ω・´)
そのことをご理解した上で、カスタマイズに挑戦なさってください。
また、カスタマイズしていく上で問題が発生することもあります。
代表的なのが、文字化けでしょうか。
コードなどを間違えてしまうと
ブログ本文などが文字化けを起こすことがあります。
文字化けとは
『縺ゥ縺・@縺ヲ譁・ュ怜喧縺代′襍キ縺阪k縺ョ・溘ヰ繧ォ縺ェ縺ョ』
なんかこんな感じの
「な、なんじゃこりゃ!」
みたいな文字のことです。
正しく文字が表示されないことですね。
もちろん仮に文字化けしてしまってもちゃんと元に戻す方法はあります。
しかしながら
「ライオンさんの解説通りにやってみたら、文字化けした!」
「変な文字ばっかりになったけど、どうしてくれるの!?」
「なんかブログがおかしなことになったんだけど、どういうこと?」
みたいなことを言われても責任は一切取れません。
カスタマイズにおいては全て“自己責任”でお願いします。
僕の解説で、何かブログに支障をきたしても、ライオンは一切の責任を負いません。
そこのところもご理解お願いします。
ではでは、カスタマイズにチャレンジしていきましょう(`・ω・´)
━─━─━─━─━─
カスタマイズするためにはまず。
今、適用されてるデザインを変更して。
『CSS編集用デザイン』というものに変更する必要があります。
このデザインは、CSSを使ってカスタマイズしていく専用のデザインです。
カスタマイズを始めるにあたって、一番最初の行程になります。
では、その変更の仕方を画像付きでゆっくりと説明していきます。
まずはマイページ。
画像を見て頂いて
『デザインの変更』と書かれた場所がありますよね。
そこをクリックして頂きます。
ちなみに全く関係ない話ですが
この参考画像は僕のサブアカウントを使用しております。
クリックして頂いたら、いろいろなデザインを選ぶ画面になりましたね。
デザイン変更画面です。
その画面を少し下にスクロールして頂くと、画像の矢印の場所に
『カスタム可能』と書かれたボタンがあるのが確認出来るでしょうか?
そのボタンをクリック(`・ω・´)
クリックして頂いたら、画像のような画面に切り替わると思います。
そしてカスタム可能のデザインの中から
『CSS編集用デザイン』をいうものを探してください。
画像の矢印の場所にあると思います。
そして、CSS編集用デザインをクリック。
するとこういった画面になります。
ここで好きなレイアウトを選択できます。
2カラムメニュー左、3カラム右ワイドメニューとか、計5種類ありますね。
どれでもご自分のお好きなレイアウトを選択してもらって大丈夫です。
ただし、実際カスタマイズを開始してからレイアウトは変更出来ないので注意です。
※厳密にはカスタム後にレイアウトを変更するとカスタマイズが適応されません。
5つの内、好きなレイアウトを選択して『適応する』をクリックして頂ければ
見事『CSS編集用デザイン』に変更が出来ました。
ちなみに3カラム左ワイドメニューで適応してみると
こんな感じになりました。
まだ、一切手をつけてないので、真っ白ですね。
ここから、いろいろな部分をカスタマイズしていくわけです。
先ほども言ったように、イチから作っていくのです。
そしてこの画面がスタート地点です。
さてさて、今回はここまで。
次回はCSSを駆使して、背景画像を変更してみようと思います。
ライオンでした。
thank you bye