最新記事一覧で改行されるのを防ぐには

アメブロでは、初期状態ではタイトルが長い記事は、下の様に最新記事一覧でタイトルが改行されて表示されます。

アメブロの最新記事一覧を1行表示させる方法3 (1)

しかし、このような表示はいまいちすっきりしない、という人も多いと思います。

この記事では、どうすればアメブロでタイトルの長い記事でも、最新記事一覧で1行表示するかについてご紹介いたします。

ブログデザインのCSSの編集

タイトルの長い記事でも、最新記事一覧で1行で表示するには、ブログデザインのCSSの編集を行います。

なお、CSSの編集を行うためには、ブログデザインを「CSS編集用デザイン」にする必要があります。

もしほかのデザインを使用している場合は、「CSS編集用デザイン」に変更をお願いします。

ブログ管理画面の右上にある「三本線」ボタンを、押して出てきたメニューの「デザインの変更」を押します。

アメブロの最新記事一覧を1行表示させる方法3 (2)

ページ上部にある、「適用中のデザイン:CSS編集用デザイン」の下にある「CSSの編集」を押します。

アメブロの最新記事一覧を1行表示させる方法3 (3)

「現在使用中のブログデザインCSS」の一番下に、以下の内容をコピーして貼り付けをして、「保存」を押します。

#recentEntries{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

アメブロの最新記事一覧を1行表示させる方法3 (4)

タイトルの長い記事でも、最新記事一覧で1行表示されました。

アメブロの最新記事一覧を1行表示させる方法3 (5)

まとめ

以上、アメブロでタイトルの長い記事でも、最新記事一覧で1行表示する方法についてご紹介させていただきました。

表示を整えてブログの見栄えを良くすることは、ブログの読者を増やすうえで重要なポイントです。

皆さんもブログがより見やすくなるようカスタマイズしてみてください。

「アメーバキング2」アメブロ売上倍増&アクセスアップの多機能ツール

http://ci-s.net/amebaking2/

  • アメブロのサイトタイトルの下にメニューバーを作成する方法
  • アメブロのPCとスマホの広告を表示させない方法
  • アメブロのページの先頭へ戻るボタンを作る方法
  • アメブロのCSSが反映されないときの対処方法

Twitterでフォローしよう

  • 仮想通貨
    【知らない損する】ビットコイン初心者が勘違いしていること5つ
    2023年3月22日
  • アフィリエイト
    アフィリエイト初心者におすすめのASP一覧 11選
    2018年8月18日
  • 仮想通貨
    【知らないとヤバイ】不労所得は存在しないのか?ウソなのか?
    2021年8月30日
  • 仮想通貨
    【初心者にオススメ】ビットコインや仮想通貨(暗号資産)取引所ランキング
    2021年5月28日
おすすめの記事
FC2ブログ カスタマイズ初心者講座
目次1 画像にリンクを貼る方法2 文字にリンクを貼る3 画像をアップする4 画像を挿入する5 画像にリンクを貼る 画像にリンクを貼る方法 画...