WordPress

【使える!】WordPress(ワード プレス) のおすすめの装飾方法8選

悩む人
ワードプレスでブログを導入したのはいいけど、装飾方法を知りたいです!装飾方法を理解できるように一覧にして教えてほしい!

 

こんな悩みに答えます。

 

本記事の執筆者

WordPress(ワードプレス)を使って1年以上ブログ運営をしており、現在Web業界で7年ほど働いています。

 

WordPressを導入したのはいいけど、基本的な装飾方法について悩むのではないでしょうか?

 

また、ワードプレスで簡単に自分好みのデザインにカスタマイズできると聞いたけど、機能がたくさんありすぎで逆に迷ってしまった経験があるのではないでしょうか。

 

WordPressで装飾する方法は1回覚えてしまえばいいのですが、慣れるまでに時間がかかります。
KEI

 

本記事では、そんなWordPress(ワードプレス)の装飾方法について一覧にまとめて紹介します。

 

見出し」「太字」といった基本的な装飾方法から、アイコンの設定方法といった応用の設定方法を紹介していきます!

 

WordPressの装飾に悩みましたら、本記事をいつでも読み返せられるようにブックマークしておくことをオススメします。

 

なお本記事で紹介するのは、クラシックエディタでのカスタマイズになります。

 

ブロックエディタでの装飾の方法は以下でも紹介していますので参考にしてみてください!

 

関連
【WordPress】Gutenbergの使い方とアフィリエイトリンクの貼り方を紹介

続きを見る

 

基本的な投稿方法【WordPressの装飾前に!】

基本的な投稿方法【WordPressの装飾前に!】

 

装飾をする前にまずは、記事の投稿方法を紹介します。

記事の投稿のやり方をすでに知っていてWordPressの装飾のやり方一覧を知りたい方は「WordPressでできる装飾一覧」から飛べます。

 

記事の投稿をするには、WordPressを開きまして、サイドバーメニュー「投稿新規追加」をクリックします。

 

 

すると以下の投稿画面が開きますので、こちらに記事を書きます。

 

 

この画面で文字を「太文字」にしたり、「見出し」をつけたりして装飾をしていきます。
KEI

 

ちなみに、今回は以下のツールバーを使って装飾をしていきます!

 

 

それでは具体的なWordPressの装飾方法について紹介します。

 

WordPressでできる装飾一覧8選

WordPressでできる装飾一覧8選

 

WordPressの具体的な装飾方法を紹介します。

 

図解を使って解説していますので、そのまま真似していただいてOKです!
KEI

 

・見出しのつけ方

 

見出しは以下赤枠で囲った「段落」をクリックすると、「見出し2」「見出し3」と表示されるので好きな見出しを選択します。

 

 

ちなみに、H2,h3をしっかり設定しておくことで、Googleに記事の内容を伝えることができSEO効果があります。

 

SEOをちゃんとやっておくことで、Googleの検索結果で上位を獲得できユーザーが流入してくれる機会が増えます。

 

以下記事で見出しをつけるポイントについて詳しく紹介していますので気になる方はご覧ください。
KEI

 

関連記事
【悩まない!】ブログ見出しの作り方とSEOで検索上位を狙う方法

続きを見る

 

・フォントサイズの変更

 

文字を大きくしたい場合や小さくしたい場合に、フォントサイズを変えられます。

 

フォントサイズ(文字の大きさ)を変更するには、以下のボタンをクリックして大きさを変えられます。
KEI

 

 

文字のサイズを変えたい箇所をドラックして、フォントサイズのボタンを押して好きな文字サイズを選択すれば大きさを変更できます。

 

 

文字を大きくして一文を強調したい時なんかには便利です。

 

・文字の装飾

 

太字を太文字にしたり下線を入れて装飾したい場合には、以下の赤ワクで囲った箇所をクリックして太字下線に変えられます。

 

 

太くしたい文字を選択して、ツールバーの「B」ボタンをクリックしますと太字に変えられます。

 

また、お使いのWordPressテーマによって異なりますが、当ブログで使用しているAFFINGERですと以下のようにマーカーを使って装飾ができます。

 

参考

これは黄マーカーです。

これは黄マーカー(細)です。

これは赤マーカーです。

これは赤マーカー(細)です。

これは青マーカーです。

これは青マーカー(細)です。

これは鼠マーカーです。

これは鼠マーカー(細)です。

 

太字はユーザーに文字を目出せるといったメリットがあり、SEOにも効果があります。

 

WordPressブログやサイトで太文字を使うメリットについて、以下記事で詳しく紹介しているので参考にしてみてください。

 

関連記事
Strongストロングタグ(太字)はSEOで重要?【使いすぎには注意】

続きを見る

 

・文字の色を変更する

 

文字に色をつけたい場合は、以下の「テキスト色」ボタンをクリックします。

 

 

テキスト色ボタン横にある「▼」をクリックすると色の選択ができます!

 

 

文字の色を変えたい範囲をドラックして、色を選択すれば色が変わります!
KEI

 

 

・改行

 

改行コードは<br>を入れてあげます。

 

改行したい位置に<br>タグを入れることで改行ができますよ!
KEI

 

 

ただ、こちらは「テキスト」モードで必要になりますので、ビジュアル」モードでは改行コードは入れる必要はなく、Enterキーを押せば改行になります。

 

・引用タグの装飾

 

参照するサイトを掲載したいときに、引用タグは使えます。

 

引用タグを表示させるには、以下のボタンをクリックします。

 

 

このボックス内にテキストを入力すれば引用タグ内に文字を入れることができます。

 

 

なお、引用タグをおしゃれに装飾したい場合は、サルワカさんが紹介してくれているCSSを使うことで簡単におしゃれなデザインを作れます。

 

参照元:CSSで作る!魅力的な引用デザインのサンプル30blockquote

 

上記のデザインを用意されているCSSをコピペするだけでおしゃれなデザインが作れます!
KEI

 

多種多様な引用のボックスデザインがあるので、自分のサイト・ブログのデザインに合わせてカスタマイズしてみてください。

 

・箇条書きリスト/番号リスト

 

ブログで文字を羅列して紹介するのではなく、何かをリストにして紹介したい場合に箇条書きや番号リストが使えます。

 

こちらもワンクリックでリスト変更できるので、簡単に作れちゃいます。

 

箇条書き

 

以下のように箇条書きにしたいテキストにカーソルを当てて、ボタンをクリックします。

 

 

すると選択していた文章が箇条書きとして表示されます。

 

番号リスト

 

番号リストも同じやり方でOKです。

 

 

これで番号付きのリストの完成です。

 

ちなみに、「▼」をクリックすると「ラテン文字小文字」「ギリシャ文字小文字」を選べます。

 

・アイコン作成

 

ブログをみているとオシャレなアイコンをよくみかけると思います。

 

Fontawesome」というWebアイコンフォントを使うことで、アイコンをつけることができます。
KEI

 

矢印やSNSといったアイコンがあり、ブログにちょっとおしゃれなアイコンを表示させたい時に簡単につけられます。

 

例えば、以下のようなアイコンを入れてみたい方にはオススメです。

 

 

ブログでよくみるのが、メニューのテキストの横に置いていたりしますね。

 

ブログ初心者でアイコンを設置してみたい方にはオススメです。

 

WordPressブログでFontAwesomeを使用する方法は、以下記事で紹介していますので参考にしてみてください。

 

 

WordPreessの有料テーマでさらにおしゃれにできる!

WordPreessの有料テーマでさらにおしゃれにできる!

 

実は、有料のWordPressテーマを使うことで簡単に装飾できます。

 

WordPressの有料テーマは、無料のテーマと比べますと機能面がしっかりしており、おしゃれなデザインを作ることができます。

 

有料のWordPressデザインテーマ例4つ

 

上記のようにデザインによって、「スタイリッシュ」「かわいめのデザイン」をカスタマイズできます。

 

また、上記以外にも最近ではおしゃれな有料テーマが沢山あります。

 

 

以下記事でオススメのWordPressテーマについて詳しく紹介していますので、気になる方はご覧ください!

 

おすすめ
WordPressのおすすめ有料テーマ7選・無料テーマ1選【失敗しない選び方も解説!】

続きを見る

 

ただ、有料テーマは沢山あるので、どのテーマにするか悩むと思いますが、悩みましたらAFFINGER6をオススメします。

 

当ブログでもAFFINGERを使っており、カスタマイズのしやすさや初心者にも使いやすいテーマといえます。
KEI

 

有料テーマを導入してWordPressをより自由に装飾してみてください!

 

ワードプレスを装飾してオリジナルのデザインを作成しよう!:まとめ

 

今回はWordPress(ワードプレス)の装飾方法を紹介しました。

 

ブログを綺麗にすることでモチベーションも上がりますし、読みやすい記事になります。

 

今回紹介したWordPressの装飾を使ってオリジナルのデザインを作ってみてください!

 

  • この記事を書いた人

keiblog

当ブログは、『シンプルで見やすい記事を発信!』をモットーに「ブログ・WordPress」などWebに関する役立つ情報を発信していきます。【経歴】アメリカ留学▶︎ 2015年ヨーロッパバックパック▶︎Webディレクター就職(歴6年)(コーディング・SEOが好きです!)▶︎ブログ開設

-WordPress