【ブログアップデート】CSSコードをコピペするだけでサイドバーを吹き出し風にする方法

こんにちは、ひでまるです。

現在、ブログデザインを美しくし、アクセスアップを図るという目標に取り組んでいます。

ブログデザインを変えていく上で必要となってくるのが、CSSコードの編集作業です。

私自身も今まで、ネットで調べたコードをペタペタ張り付けてブログを作ってきたので、内容を把握しておりませんでした。この機会にデザイン変更した内容を記録していくことで、勉強になればと思い、この記事を書いております。

ペタペタ張り付けるだけで、同じようなデザイン変更ができるよう、コード・コードの内容についての説明をしていこうと思います。

張り付けてみたけど、上手くいかないよって人はコメントいただけたらと思います。

今回は、サイドバーのメニューを吹き出し風にする変更を行っていこうと思います。

CSS変更前後の比較

これが変更前で、

こちらが、変更後になっています。

CSSコード

コードは、

gistea81c41ac4f0a2c92d6e9341e053fe11

となっております。

１～14行目のみを張り付けた場合は、下の三角部分は表示されずに四角で囲まれます。

CSSコードの貼り付け方

上記のコードを、「デザイン」→「カスタマイズ」→「デザインCSS」の部分に張り付ければ、OKです。

うまくいかない場合もありますので、もとに戻せるようにもともと書いてあったコードのバックアップも取るようにしてください。

hidemaru-1988-sub.hatenablog.com