FC2ブログで文字装飾をする方法!図解でわかりやすく解説

目安時間:約 11分

 

FC2ブログで文字装飾をする方法ってちょっとわかりにくいですよね。

 

FC2ブログの文章記入欄はwordpressやLivedoorなどとは違い、HTMLを記入するページと本文を記入する欄が分かれていません。

なので、文章を装飾したり、画像を挿入したり、アフィリエイト広告のURLを張り付けるとそのままHTMLの表示が出てきます。

わからない人には混乱する一因になってしまうのは無理ないですよね。私も最初は「動画ってどうやって挿入するの?」「著作権違反になったりしないかな?」とびくびくしながら作業しながら一つ一つ調べて作業していましたから。

 

今回はそんな方のためにFC2ブログで文字装飾を行う方法を紹介します。

 

細かく説明文を書いたので、すべてをしらみつぶしに見ると大変です。目的別に自分がしたいと考えている文字装飾の箇所へ飛ぶなどして活用してください。

 

文字装飾の基本

 

文字装飾を行うときはこの欄から選びます。

文字を装飾する時は装飾したい文字を選択してからそれぞれのボタンをクリックします。

 

FC2の文字装飾のらくちんなところはHTML表記を勝手にしてくれるところです。

文字を選択してボタンをクリックすれば面倒なHTMLを記述してくれるんですね。

 

これは利用しない手はないので、じゃんじゃん使っていっちゃいましょう。

 

 

 

色を変更

色を変更する時は赤枠で囲われたマークを押します。

するとこのような色とりどりなパッドが出てくるので、自分がしたい色をひとつ選んで、選んだ色の上でクリックします。

試しに今回は”#FF0000”の赤色でやってみたいと思います。(下の画面では黄緑色ですが、、、)

すると本文の編集画面ではこのようなHTML表記となり、

リアルタイムプレビューではこのような画面になります。

 

 

このように色を変更することができます。

色は見ての通り様々な種類があるので、「こういう時はどの色を使ったほうがいいのかな?」とか「訪問者の方から見て見やすい色はどれかな?」など、選ぶ楽しみがありますね。

 

 

文字を大きく

文字を大きくするときは赤枠で囲われたマークを押します。

本文の編集画面ではこのようなHTML表記となり、

するとリアルタイムプレビューではこのように文字を大きくすることができます。

これで文字を大きくすることができました。

このサイズは結構大きめで人の目を引くので、ここぞというときに利用するのがベストですね。

 

文字を中くらいに

文字を中くらいにするときは下記の画像の赤枠で囲われたマークを押します。

すると本文の編集画面ではこのようなHTMLが挿入され

リアルタイムプレビューではこのような画面表記になります。

 

このようにボタン一つでHTMLを挿入し、文字を中くらいに変更することができました。

つくづく思いますが、この機能は文字を中くらいにしたいなど一つ一つ手作業でHTMLを記述するのが面倒なときに手間にならずに済んで良いですね。

 

文字を小さく

文字を小さくするときは赤枠で囲われたマークを押します。

文字を小さく変更することができます。

 

普通の文字よりちょっと小さくなりましたね。

 

 

文字を太字に

文字を太字にしたい時は赤枠で囲われたマークを押します。

すると本文の編集画面では装飾したい文字の周りを<strong></strong>のHTML表記を挿入でき、

 

リアルタイムプレビューではこのょうに文字を太字に変更することができます。

太字はよく使う項目ボタンなので、使い方や位置はちゃんと把握しておきたいですね。

 

文字を斜体に

文字を斜体に変えたいときは赤枠で囲われたマークを押します。

すると本文の編集画面では装飾したい文字の周りを挟む形で<i></i>のHTML表記を挿入でき、

リアルタイムプレビューでは斜体にした文字を見ることができます。

ちょっと斜めに見えますよね。

 

文字を打ち消す(文字の上から横棒を引く)

文字を打ち消したいときは赤枠で囲われたマークを押します。

すると本文の編集画面では装飾したい文字の周りを挟む形で<i></i>のHTML表記を挿入でき、

リアルタイムプレビューでは実際に文字の上から横棒を引いて文字を打ち消した状態を見ることができます。

すると文字の上から横棒を引き文字を打ち消すことができるようになります。

 

文字に下線を引く

文字に下線を引きたいときは赤枠 で囲われたマークを押します。

すると本文の編集画面では装飾したい文字の周りを挟む形で<i></i>のHTML表記を挿入でき、

 

するとこのように文字に下線を引くことができます。

 

 

文字を四角で囲う(引用)

文字を四角で囲いたいときは赤枠で囲われたマークを押します

すると本文の編集画面では装飾したい文字の周りを挟む形で<i></i>のHTML表記を挿入でき、

 

 

 

 

水平線を引く

水平線を引きたい時はこのマークを押すことで引くことができます。

すると本文の編集画面では装飾したい文字の周りを挟む形で<i></i>のHTML表記を挿入でき、

 

文字を選択したまま利用すると選択していた文字が消し飛ぶので注意してください。

 

画像を挿入する

画像を挿入するときは下の画面で赤枠で囲まれた部分のボタンを使用します。

すると本文の編集画面では装飾したい文字の周りを挟む形で<i></i>のHTML表記を挿入でき、

 

リアルタイムプレビューではこのように表示することができます。

あまりに大きすぎる画像だと画面からはみ出たりするので注意してください。画面サイズによって画像の大きさを競ってしてくれるテンプレートを使用していたら別ですが。

 

文字にURLを挿入する

すると本文の編集画面では装飾したい文字の周りを挟む形で<i></i>のHTML表記を挿入でき、

 

 

顔文字を挿入する

顔文字を挿入したい時はこのマークを押します。

すると本文の編集画面では装飾したい文字の周りを挟む形で<i></i>のHTML表記を挿入でき、

文字を選択していると選択した部分の一番最後にくっつきます。

 

i-mode絵文字(docomo)を挿入

docomoの絵文字を挿入できます。

すると本文の編集画面では装飾したい文字の周りを挟む形で<i></i>のHTML表記を挿入でき、

このマークを押すと選択できるようになるので、お好きな絵文字を押します。

すると本文に挿入することができます。

 

Ezweb絵文字(au)を挿入

auの絵文字を挿入できます。

このマークを押すと選択できるようになるので、お好きな絵文字を押します。

すると本文に挿入することができます。

 

softbank絵文字(softbank)を挿入

softbankの絵文字を挿入できます。

このマークを押すと選択できるようになるので、お好きな絵文字を押します。

すると本文に挿入することができるようになります。

 

 

絵文字エディターで絵文字を作成

絵文字エディターでは自分で作成した絵文字を本文に張り付けることができます。

すると本文の編集画面では装飾したい文字の周りを挟む形で<i></i>のHTML表記を挿入でき、

実際に作ってみました。こんなかんじです。

ただ、ペンタブ(パソコンで絵を描くためにある機械)がないと自分の思い通りに絵を描けないので、普段から有効活用するのは難しいかもです。

 

お絵かきエディターで画像を作成

お絵かきエディターでは自分が書きたい絵を描き、本文に挿入することができます。

すると本文の編集画面では装飾したい文字の周りを挟む形で<i></i>のHTML表記を挿入でき、

実際に描いてみました。こんな感じになりました。

これもペンタブ(パソコンで絵を描くためにある機械)がないと自分の思い通りに絵を描けないので、普段から有効活用するのは難しいです。

 

 

 

 

この記事に関連する記事一覧

コメントフォーム

名前

メールアドレス

URL

コメント

管理人プロフィール

 

アフィリ猫:管理人

ブログアフィリエイトアドバイザー。
女子大生向けブログアフィリエイトの情報を発信する人(猫)。

管理人詳細プロフィール

 

ひきこちゃん

私立大学に入学してから学費を自分で払うためにアルバイトを探している女子大生。しかし、人と関わるのが苦手で在宅仕事をしたいと考ていたところ、ブログアフィリエイトに巡り合う。月5万円を稼ぐのが目標。

 

おすすめ商材

アンリミテッドアフィリエイト
 
●1商品で942万円稼ぎ出す仕組み「Unlimited Affiliate NEO(アンリミテッドアフィリエイトネオ)」
 
アフィリエイトで稼ぐ方法をまとめた超大作。
内容がみっちり詰まっているので大変ですが、これを実践すれば間違いはありません。

最近の投稿
カテゴリー
最近のコメント
メタ情報
アーカイブ

ページの先頭へ