ブログ初心者の役に立つ!【ワードプレスにタイトル付きの枠を追加!】

時間の節約術
ブログ初心者の役に立つ!【ワードプレスにタイトル付きの枠を追加!】

副業でブログを初めて見たという方がたくさんいると思いますが、なかなか思った通りに記事が書けなかったり、せっかく頑張って記事を書いたのに、思った通りの装飾ができなかったりしてめんどくさくなってしまう方が多いと思います

そこで、今回はどなたでも簡単に使えるようにコピペするだけで使えるワードプレスの枠の追加をできるHTMLタグを紹介します!

淡いピンク色の枠

下記をコピペしてください!
タイトル
★ここに文字を入力

青色の枠

下記をコピペしてください!
タイトル
★ここに文字を入力
<div style=”border: 1px solid #0000ff; padding: 5px; border-radius: 0px; background: #0000ff;”>タイトル</div>
<div style=”border: 1px solid #0000ff; padding: 10px; border-radius: 0px; background: #ffffff;”>★ここに文字を入力</div>

緑色の枠

タイトル
★ここに文字を入力
下記をコピペしてください!
<div style=”border: 1px solid #008000; padding: 5px; border-radius: 0px; background: #008000;”>タイトル</div>
<div style=”border: 1px solid #008000; padding: 10px; border-radius: 0px; background: #ffffff;”>★ここに文字を入力</div>

黄色の枠

タイトル
★ここに文字を入力
下記をコピペしてください!
<div style=”border: 1px solid #ffff00; padding: 5px; border-radius: 0px; background: #ffff00;”>タイトル</div>
<div style=”border: 1px solid #ffff00; padding: 10px; border-radius: 0px; background: #ffffff;”>★ここに文字を入力</div>

赤色の枠

タイトル
★ここに文字を入力
下記をコピペしてください!
<div style=”border: 1px solid #ff0000; padding: 5px; border-radius: 0px; background: #ff0000;”>タイトル</div>
<div style=”border: 1px solid #ff0000; padding: 10px; border-radius: 0px; background: #ffffff;”>★ここに文字を入力</div>

応用編

実は枠の色を変えるのはとても簡単なんです!
今回ご紹介した色以外のものも使いたいと言う方は、実はコピペしたタグの下記の赤文字の三箇所を変更するだけで色を変更することができます!

この3箇所を変更することによって氷の色変更が可能です
どの色にするときはどのように変更したら良いのかと言う事はこちらのページがわかりやすいかと思います。
HTMLカラーコード一覧
#000000というところをそのまま変更すれば完成です!
あなたにとって理想的なホームページを作れるといいですね!

まとめ

このような使える知識を貯めておく事はブログ作成時の時間短縮につながります
ブログを作成するための時間を短くすることができれば新しいことを勉強したり趣味の時間を増やしたり自分の人生を豊かにすることができますね!
これからも皆さんで一緒に頑張っていきましょう!

コメント

タイトルとURLをコピーしました