FC2ブログの行間を詰める方法を解説していきます。
記事本文の文章の固まり同士の幅を詰めたり、また逆に広げたりすることはカンタンにできます!
行間の調整と言っても以下のように調整する箇所は2つあります。どこの幅を詰めたり広げたりしたいか、まずそれを確認してください。
単純に「行間」を調整したい場合、文章のひとかたまりである「段落間」を調整したい場合、やり方はそれぞれ違いますのでそれぞれの方法を参照なさってください。
FC2ブログの本文の「行間」を詰めたり広げたりする調整方法を解説していきます。
1. ご自分のFC2ブログにログインしメインメニューの「テンプレート[PC]」か、左端の設定の「テンプレートの設定」をクリックします。
2. スタイルシート編集の欄内にあるline-heightと記されている部分を探します。
キーボードのCtrlキーとFキーを同時に押すとブラウザに検索バーが表示されますので、そこにline-heightと入力して検索すると該当箇所がすぐに見つかります。
3. このline-heightの値を小さくすると行間は狭まっていきます。通常は1.3~1.6が読みやすい幅だと言われていますが、ここでは試しに行間を詰めるため「1」に設定変更してみます。
数字を変更したら、その下の更新ボタンをクリックします。
ここまで済んだらブログを開いて確認してみましょう。
このように先ほどより行間が狭まっていることが確認できるかと思います。逆に幅を広げたい場合は当初の数値(1.4)より大きな数値を入力すればOKです。
1より小さな数値(0.9など)に設定すると行が重なってしまいますので、基本的に1以上を設定しましょう。
次はFC2ブログの本文の段落と段落の間のスペース(段落間)を詰めたり広げたりする方法を解説します。
1. この段落間を調整するには記事自体にすこし手を加える必要があります。
このようにすでに投稿済みの記事、またはこれから投稿する記事を段落ごとに<p></p>で囲んでください。
段落の頭に<p>を置き、段落の最後に</p>を置きます。
これは通称Pタグといって、囲んだ文章をひとつの段落として指定するために使用するものです。
2. Pタグの設定が済んだら先ほどと同じように「テンプレートの設定」を開いて、スタイルシートの編集の欄の一番下に下記のタグを書き込んでください。
書き込んだら更新ボタンをクリックします。
3. ブログを開いて記事を確認してみましょう。このように段落間の幅が詰まっていることが確認できますね。
もし、もっと段落と段落の間を狭めたいならmargin-bottomの-8を-10~-15のように書き換えて下さい。
逆に段落間を広げたい場合はmargin-bottomのマイナスを取って10~30など数字を大きくしてみてください。
幅が広すぎても狭すぎても読みにくいのがブログの記事です。
何度も数値を変えたりしてご自分にとって読みやすいと思える「狭さ・広さ」を見つけて見てください。
FC2ブログをSSL化する設定方法|手順を画像入りで解説
ファビコンの世界一わかりやすい作り方!超初心者向けガイド
サーチコンソールのページごとのクエリの調べ方【新Ver対応】
Gmailを振り分けて複数のメールアドレスを一括管理する方法
ヤフーメールを転送しgmailで受け取る方法!3分で完了
こんにちは。いつもありがとうございます。
FC2を利用しているので行間の詰め方はとても参考になりました。
利用してみたいです。ありがとうございます。
ryoujiさん、こんにちは。
すこし行間を調整するだけで見た目の印象が変わります。
ぜひやってみてください。
はじめまして。
先日、メルマガに登録をさせて頂き、テンプレートも頂きました。
早速、ブログに設置してみましたが、Google ChromeやIEだと正常に表示されるのですが、Firefoxのブラウザで確認すると、表示がズレてしまっています。
具体的には、フッターが真ん中あたりにズレ込み、記事と被ったような表示になってしまいます。
FC2、Seesaaどちらも試しましたが、両方ともFirefoxではテンプレートの表示がズレます。
これを直す方法はあるのでしょうか?
よろしくお願い致します。
田中さん、はじめまして。
Firefoxでは表示が崩れるとのことですが
私の環境でテストした限りでは
正常に表示されています。
また今のところ他の方から
同様の報告は受け取っていません。
・ブラウザのキャッシュを削除して試してみる
・ブラウザを最新版に更新してみる
といったことを試されてみて
もしまだ表示がおかしければ
このページの上部メニューにある
「お問い合わせ」からご連絡をください。
よろしくお願い致します。