【はてなブログ】関連記事を記事下の一番下に移動させる方法

  • 投稿 : 2018-03-19


はてなブログで記事下に関連記事を出すカンタンな方法 - ボクココ
関連記事と記事下の順番を変えたり、いろいろカスタマイズ - FOXISM

1つめの方法は、jQuery(Javascript)を使って移動させる方法
2つめは、CSSを使う方法です。

CSSを使うほうが遅くならないと思うので後者を採用することにしました。

CSSで、関連記事を一番下に

.customized-footer{
    display:-webkit-flex;
    display:flex;
    -webkit-flex-direction: column-reverse;
    flex-direction: column-reverse;
}

デザイン=>カスタマイズ=>デザインCSSに上記を追加するだけです。
カラムを逆順で表示ということをやっています。

flex-direction - CSS | MDN
order - CSS | MDN

flex-directionを使うとしても書き方はいろいろできますので、上記を参考にしてください。orderをつかって、明示的に順番を指定することもできます。

スポンサーリンク