gukkinボタン1つでOK!WordPressブログで文章を枠線で囲う方法ツイートシェアはてブGoogle+Pocketこんにちは、ぐっきんです。WordPressでブログを運営していると、文字に枠をつけたくなることってありますよね。文字を囲んでみたよ枠がつくだけでかなり見やすくなりますよね。箇条書きなんかも枠で囲んでみましょう。箇条書きを囲んでみたよ箇条書きを囲んでみたよ箇条書きを囲んでみたよこうすると要点をまとめる時などに見やすくて非常に便利ですね。いうわけで、今回はこのような便利な枠をボタンひとつで簡単に使えるようにする方法をお伝えしたいと思います。動画で解説CSSをスタイルシートにコピペHTMLコードをボタン1つで呼び出せるようにする実際に使ってみよう枠線はレシピさえ分かれば誰でも簡単に使えるまとめ事前に入れておくべきプラグイン文章を枠線で囲う際には以下のプラグインが必要になるので、必ず導入しておいてください。AddQuicktagJetpackそれぞれのリンクをクリックすると解説ページに飛びます。枠線を表示させる方法まず基礎知識として知っておいてほしいのが、枠線を表示させるためには、CSSとHTMLの2つのコードが必要になるということです。それぞれの役割を簡単に説明すると、CSS=枠のデザインをワードプレス内に保存しておく為のコードHTML=保存してあるデザインを呼び出すためのコードとなります。CSSに自分の気に入った枠のデザインを入れておき、HTMLコードでそのデザインを呼び出すという感じですね。練習として以下の枠を使えるようにしてみましょう。頑張って僕を呼び出せるようにしてみてね。この枠を使うためのCSSとHTMLは以下になります。class="box17"><p>ここに文章</p></div>以下でこれらのコードをどのように使っていくのかを解説ていきたいと思います。動画の方が分かりやすいと思いますので、まずはこちらの動画を見ながらやってみてください。CSSをスタイルシートにコピペ動画を見れない状況の人のために文章でも解説をしていきたいと思います。1.まずはブログのダッシュボードに入り、「外観」→「CSS編集」と移動します。(「CSS編集」という項目は、Jetpackを導入していない場合は出てきませんので注意してください)2.先ほどコピペしたCSSコードをスタイルシートエディタに貼り付けて保存します。CSSの設定はこれで完了です。HTMLコードをボタン1つで呼び出せるようにするCSSを設定したら、次はHTMLコードをボタン1つで呼び出せるように設定していきましょう。class=”box17′′><p>ここに文章</p></div>HTMLコードの中で必要なのは、赤い部分だけなので、上の部分を開始タグ、下の部分を終了タグのところに入力してください。ボタン名のところは自分で覚えやすい名前にしてもらってOKです。最後に一番右にチェックを入れるのも忘れないようにしてください。実際に使ってみよう1.投稿画面で囲みたい文字をドラッグし、Quicktagsの下矢印をクリック2.先ほど「AddQuicktag」で作ったボタン名をクリック3.プレビューでチェックし、文字が枠で囲まれていたら大成功です!枠線はレシピさえ分かれば誰でも簡単に使えるここまで実践してもらえれば分かると思いますが、枠線というのはCSSというレシピさえ分かってしまえば、誰でも簡単に使うことができます。ありがたいことにそのレシピを公開してくださっているサイトは世の中に沢山あります。ボックス」と検索すればそういったサイトが沢山出てきますので、ぜひ検索して自分の気に入った枠を使ってみてください。僕がよく参考にしているサイトもいくつか載せておきますね。CSSのみでデザインする囲み枠(ボックスデザイン)まとめ枠線は分かりやすく情報を伝える上で非常に重要な役割を担っています。派手過ぎるものを選んでしまうと、逆に見づらくなってしまうので、枠線を選ぶ際には「見やすさ」というの重視して選ぶことをオススメします。コメントをキャンセルメールアドレスが公開されることはありません。【超保存版】ワードプレスの記事投稿画面の使い方完全マニュアル!RECOMMENDこちらの記事も人気です。月収10万円をゲームのように楽みながら目指せる冒険型コンテンツ【業界初】初心者だった頃の僕が妄想していた、ゲームのように学べる冒険型コンテンツを形にしました!特に初心者を挫折させないことを重視したコンテンツになっていて、月収10万円〜100万円の知識を、楽しみながら学んでいけます。FANTASY』を無料で手に入れる管理人:ぐっきん初めまして、ぐっきんです。サイトに訪問していただきありがとうございます。このサイトでは、ネットビジネスを通して人生を良くしていく為の方法を沢山載せています。「無理なく自分らしく幸せを掴みたい」そんな人にとっての道標になればいいなと思っています。これも何かの縁なので、ゆっくりと見ていってください。質問や相談などはこちらにどうぞ↓↓YouTube公式チャンネルいつもご視聴ありがとうございます。チャンネル登録をして頂くと僕の最新情報が爆速で届きます。