ページ送りボタンにサムネイルを追加するJS

目的

muragonのカスタマイズ。
記事中のページ送りボタンに、前次ページの先頭画像をサムネイルとして追加する。
サムネルサイズは64×64pxとする。

Javascript

$(function() {

/* 前ページ */
if ($(".entry-pagination .prev").length) {
var prev = $(".entry-pagination .prev").attr("href");
var html = get_img(prev);
$(".entry-pagination .prev span").before(html);
}

/* 次ページ */
if ($(".entry-pagination .next").length) {
var next = $(".entry-pagination .next").attr("href");
var html = get_img(next);
$(".entry-pagination .next span").after(html);
}
});

function get_img(url) {
var img = 'サムネイル無し画像のURL';
var getData = $.ajax({url: 'https:' + url, async: false}).responseText;

/* 先頭画像取得 */
if ($(".entry-body img",getData).length) {
img = $(".entry-body img",getData).eq(0).attr("src");
img = img.replace(/(\/\/public\.muragon\.com\/.*\/.*)(.\png|.\jpg|.\gif)(\?.*)/,'https:$1/crop/64x64$2');
}
var html = '<img src="' + img + '">';
return html;
}

CSS

/* ページ送りボタン */
.entry-pagination .prev,
.entry-pagination .next {
display : flex;
align-items : center;
}

/* 記事タイトル */
.entry-pagination .prev span,
.entry-pagination .next span {
display : block;
padding : 5px;
}

/* サムネイル */
.entry-pagination .prev img,
.entry-pagination .next img {
min-width : 64px;
height : 64px;
}