Seesaaブログのトップページの続きを読むを削除して全文表示させる【新システム】

Seesaaブログの新システムではトップページやカテゴリーページなど全てが「続きを読む」となっていているテンプレートが多いので、この「続きを読む」を削除して、ホームページ風?のトップページになるようにするカスタマイズする方法を紹介します。

これによってこのブログの「まとめページ」のような感じにもできます(目次ページみたいな)。また、カテゴリーページなどはそのまま「続きを読む」を設置しておくので、あくまで変更するのはトップページだけという感じです。それでは早速説明していきましょう。

HTMLの編集でトップページだけ全文表示に

まずSeesaaブログの管理画面から「デザイン」⇒「デザイン設定」⇒「適応中のデザインタイトル」をクリックし、「HTML編集」のタブに切り替えます。

新デザインパンくず-2

「HTML編集」タブに切り替えたら表示されたHTMLから次の部分を探します。初期状態なら153行目付近。近くに「続きを読む」という部分があるのでその付近を探すといいかも。

<div class="article article--entry">

上記コードが見つかったらその下に次のコードを追加(まだ保存はしない)。

<% if:page_name eq 'index' -%>
<% article.entire_body | bodyfilter(article_info,blog) | mark_raw -%>
<% /if -%>

<% unless:page_name eq 'index' %>

まだ保存はしないで下さいね。こんな感じになりますよ。

Seesaa続きを読む削除-1

追加できたらその下の方に「続きを読む」という部分があります。そのさらに下に「/div」という部分があるので、その下に次の1行を追加。

<% /unless %>

これでOK。ちなみに追加した部分を全部みておくとこんな感じになるはずです。

Seesaa続きを読む削除-2

追加したコードの意味としては「もしトップページなら」続きを読むではなく「全文表示」。それ以外は元のまま「続きを読む」を設置するという感じです。

ここまでできたら「保存」。保存できたら次にブログの設定でトップページの表示記事数を設定していきましょう。

トップページに表示させる記事数を設定

先ほど追加したコードでトップページだけは「続きを読む」がなくなって全文表示になっていますが、トップページには全文表示の記事が複数並ぶ事になるので、ブログの設定でトップページに表示する記事数を「1」にしておけばホームページ風のトップページになります。

Seesaaブログの管理画面から「設定」⇒「ブログ設定」と進み、「トップページ表示件数」を「1」に変更し「保存」。

Seesaa続きを読む削除-3

これでトップページの表示件数は1件になるので、一番最新の記事がトップページに全文表示されるという事です。

なので、トップページに表示させたい記事(目次ページなど)を作成したのであれば記事の公開日付を一番最新の日付にして公開すればそれがトップページになります。

WordPressの始め方
サイトのアクセスアップや稼ぐためにおすすめの無料レポート

個人的にアクセスアップや検索上位表示に役立った無料レポートです。登録にメールアドレスが必要ですが、フリーメールでもOKです。

ブログの更新はこちらから

Seesaaブログのトップページの続きを読むを削除して全文表示させる【新システム】”に63件のコメントがあります。

コメントの反映には時間がかかる場合があります。

内容に問題なければ、下記の「コメントを送信する」ボタンを押してください。

  1. しげぞう 投稿作成者

    みな様

    コメントありがとうございます。ソーシャルボタンが見えないというのはどのような状態でしょうか?消えたのか、それとも表示されているけど一部隠れているような感じでしょうか?それから使っているデザイン名も教えてもらえると助かります。

    使っているデザインによって多少違いがでてくる場合もありますのでよろしくお願いします。

  2. みな

    はじめまして!みなと申します。
    ブログ初心者でしげぞう様の記事を大変参考にさせていただいております。

    続きを読むを消し、最新の記事を全文表示させたらソーシャルボタンが見えなくなりました。
    同じ記事を最近の記事の方から開くとボタンが表示されます。
    トップページでもボタンが表示されるようにする方法を教えていただけると助かります。
    よろしくお願いします。

  3. なべ

    しげぞう様

    ありがとうございます!レスポンシブ表示で画像がきちんと縮小されるようになりました!

    また、サイドバーのアイキャッチ画像の表示もこの設定で改善されました!

    トップページが検索されなくなるのは困る為、index-2,3,4は削除しません。

    本当にありがとうございました。

    なべ

  4. しげぞう 投稿作成者

    なべ様

    返信ありがとうございます。動画はiframに対してmax-width:100%としてあるようなので、画像に対して以下を追加でどうでしょうか?

    img {
        max-width: 100%;
    }

    これで一度試してみて下さい。確認する場合にはキャッシュ(以前のデータ)が残っている場合がありますので再読込み(リロード)もしてみて下さいね!

    それからindex-2,3,4と続くのは確かに個別ページと重複しますが、間違ってトップページの削除やnoindexをするとトップページが検索に全くヒットしない状態になる可能性があるため注意です。

  5. なべ

    しげぞう様

    ご連絡ありがとうございます。
    テンプレートはこちらと同じ「シンプルA.ホワイト右カラム」です。

    TOPページ記事下の
    index-2.html・3・4と続く.htmlも投稿記事と重複する為、
    削除した方が良いのかなと考えていますが、問題なければ、
    残しておきたいと思っています。

    よろしくお願いいたします。

  6. しげぞう 投稿作成者

    なべ様

    コメントありがとうございます。一度確認してみますので、使っているデザイン名を教えてもらえますか?チェックして修正してみますね!

  7. なべ

    初めまして。
    TOPページ(固定記事)からindex-2.htmlに続く全てのページ画像が
    レスポンシブにならず、縮小されませんです。

    投稿記事URLでの表示は問題ないのですが、
    TOPページの固定だけでもレスポンシブ表示になるようにしたいです。

    よろしくお願い致します。

  8. さちえ

    出来ました。有難うございます。

    なんか思ったよりも大変そうなコードを書いて頂いて恐縮です。
    非常に解りやすかったので、少し改造も出来ました。

    重ねて御礼申し上げます。

  9. しげぞう 投稿作成者

    さちえ様

    返信ありがとうございます。あれこれ試してみたんですが、コメント欄はできるのですが、SNSボタンなどはやは個別記事でないと設置できませんでした。

    なので、一応「コメントを書く」だけ設置する方法になります。失敗したら元に戻せるように事前に今のHTMLはコピーしてメモ帳などで保存しておいて下さい。

    全文表示にするために追加したコード(153行目付近に追加したコード)ですが、これの以下の部分にさらにコメント用のコードを差し込む必要があります。

    <% if:page_name eq 'index' -%>
    <% article.entire_body | bodyfilter(article_info,blog) | mark_raw -%>
    
    ここにコードを入れる
    
    <% /if -%>
     
    <% unless:page_name eq 'index' %>

    「ここにコードを入れる」という部分を消して次のコードをいれます。

    <% if:article.accept_comment_show -%>
    <div id="comments" class="module module--comments">
    						<h3 class="module__heading">この記事へのコメント</h3>
    						<div class="module__body">
    							<div class="comments">
    								<ul class="comments__list">
    									<% loop:list_article_children -%>
    										<li class="comments__item">
    											<article>
    												<p class="comments__user-name">
    													<% if:comment.homepage -%>
    														<a href="<% comment.homepage | tag_strip -%>" target="_blank" rel="nofollow"><% comment.writer | tag_strip -%></a>
    													<% else -%>
    														<% comment.writer | tag_strip -%>
    													<% /if -%>
    												</p>
    												<div class="comments__content">
    													<% comment.body | tag_strip | nl2br | clickable('target=&quot;_blank&quot; rel=&quot;nofollow&quot;') | mark_raw -%>
    												</div>
    												<footer class="comments__meta">
    													<% comment.createstamp | date_format('%Y年%m月%d日 %H:%M') -%>
    												</footer>
    											</article>
    										</li>
    									<% /loop -%>
    								</ul>
    								<% if:article.accept_comment_catch -%>
    									<div class="comments__leave">
    										<a href="<% article.post_comment_relative_url -%>" rel="nofollow">コメントを書く</a>
    									</div>
    								<% /if -%>
    							</div>
    						</div>
    					</div>
    				<% /if -%>

    かなり長いですがこれでOKでした。

  10. さちえ

    返信ありがとうございます。
    早いレスポンスに返答が遅れて申し訳ありません。
    使っているのはシンプルA.パステルブルー 右カラムです。
    お手数おかけいたします

  11. しげぞう 投稿作成者

    さちえ様

    コメントありがとうございます。最近のSeesaaブログは新、旧両方のデザインが混じっている感じなので、もし良かったら使っているデザイン名を教えて下さい。デザインによって多分対処方法が違ってくる感じがしてますので、どうぞよろしくお願い致します。

  12. さちえ

    始めまして。
    記事を読んで全文を表示することはできたん出来たんですが、
    全文を表示することにより、
    記事下のコメントを書くへのリンクその他が表示されなくなりました。

    記事タイトルをクリックすれば通常通りコメントを書くへのリンクが出るんですが、
    トップページの記事の下にリンクを出すにはどうしたらいいでしょうか?

    HTMLには記事へのコメント<a hre~の文字があるんで、
    これを表示させればいいような気がするんですが。

    よければ教えてください

  13. しげぞう様

    ご返答ありがとうございます。

    やはり個人では難しいのですね。。。
    まだまだアフィリエイトでわからないことばかりですので、わからない点があればまた質問させていただきます!

    ご丁寧にありがとうございました。