Deprecated: The each() function is deprecated. This message will be suppressed on further calls in /home/zhenxiangba/zhenxiangba.com/public_html/phproxy-improved-master/index.php on line 456
はてなブログで、「前の戻る」ページのCSSコードを追加しました… - 人力検索はてな
[go: Go Back, main page]

匿名質問者

質問 はてなブログで、「前の戻る」ページのCSSコードを追加しました。

問題なく追加できたのですが、「カテゴリ」から飛ぶとこのように前のページが2つになってしまいます。
※トップページから次のページを押したときは2つになりません。

こちらの改善策をご教示いただけますでしょうか。

回答の条件
  • 1人10回まで
  • 登録:
  • 終了:2026/02/06 21:27:23

ベストアンサー

匿名回答1号 No.1

コメント拝読。


ご提示の記事を拝見しましたが、記事のフッタにスクリプトを埋めて「前のページ」の要素を追加しています。


私のブログで試してみたところ、カテゴリページにはこのスクリプトがなくても「前のページ」リンクが存在するようでした。

ですので、元からあった「前のページ」と、後から追加した「前のページ」が重複するのだと思います。


解決方法ですが、条件文に以下の条件を追加してみるのはどうでしょうか。

if (location.search.indexOf("?page=") === 0 && location.pathname.indexOf('category') === -1) {
匿名質問者

ご教示いただきましたものを追加しました。

カテゴリページ→次のページでは表示されなくなりましたが、トップページ→次のページを押したときに、前のページボタンが消えてしまいました。

そこで、以下サイト記載のJavascriptおよびCSSを書き換えたところ、どういうわけか解決いたしました。

お忙しい中ご回答いただき、感謝いたします。

https://note.z0i.net/2018/03/hatena-pager-prev.html

2026/02/05 22:01:08
  • 匿名回答1号
    匿名回答1号 2026/02/02 13:33:35
    コードをご提示ください。

    また、

    > 「前の戻る」ページのCSSコードを追加

    とのことですが、CSSだけだと要素を追加して前のページへのリンクを作るのは難しく、HTMLやJavaScriptのコードもあるのではないかな、と思います。
  • 匿名回答2号
    匿名回答2号 2026/02/02 16:08:55
    デザイン設定でどのように記述して追加したのでしょうか。
    変な設定にしてしまっている可能性もあるので、まずはそこを確認しないと完全な解決はできません。また、もし最初からあるテーマ一覧からの選択ではなく、テーマ ストアからテーマを追加インストールして使用している場合、あえて「前のページ」を表示しないようにしているテーマ (Minimalismなど) もあります。その場合は、他のテーマに変更するか、非表示を解除するスタイルシートを追加することで解決することもあります。
    ※ 参考過去質問: https://q.hatena.ne.jp/1543330531
    また、 "カテゴリ" ページでは表示されているとのことですが、逆に前のページが表示されないページもあわせて教えていただければと思います。
  • 匿名質問者
    匿名質問者 2026/02/04 23:00:13
    CSSコードはこちらになります。

    /* Pager */
    .pager {
    position: relative;
    margin: 2em 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    }

    .pager a {
    color: RGB(68, 153, 187);
    }

    .pager a:hover {
    color: RGB(68, 153, 187);
    }

    .pager.autopagerize_insert_before .pager-prev {
    padding: .5em 0;
    border: 1px solid #ddd;
    border-radius: 3px;
    }

    .pager.autopagerize_insert_before .pager-prev a {
    padding: .5em 1em .5em 2em;
    }

    .pager.autopagerize_insert_before .pager-prev:before {
    content: "<<";
    font-weight: 900;
    position: absolute;
    left: .5em;
    top: .5em;
    color: RGB(68, 153, 187);
    }

    .pager.autopagerize_insert_before .pager-next {
    padding: .5em 0;
    border: 1px solid #ddd;
    margin-left: auto;
    border-radius: 3px;
    }

    .pager.autopagerize_insert_before .pager-next a {
    padding: .5em 2em .5em 1em;
    }

    .pager.autopagerize_insert_before .pager-next:after {
    content: ">>";
    font-weight: 900;
    position: absolute;
    right: .5em;
    top: .5em;
    color: RGB(68, 153, 187);
    }

    .pager.pager-permalink .pager-prev {
    margin-right: .25em;
    padding: .5em;
    border: 1px solid #ddd;
    border-radius: 3px;
    }

    .pager.pager-permalink .pager-next {
    margin-left: auto;
    padding: .5em;
    border: 1px solid #ddd;
    border-radius: 3px;
    }


    テーマはMinimalismです。
    ちなみですが、こちらのサイトを参考にしております。
    https://www.marorika.com/entry/hatena-pager-prev

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

回答リクエストを送信したユーザーはいません