ページャーの上部表示
「記事の編集・削除」の記事リストは最大で20件で、1ヵ月の投稿記事が20件を超えるとページャーがリストの下部に表示されます。 この段階から溢れた分のリストは別ページ表示になります。
これは投稿数が多いユーザーには周知の事ですが、「記事の編集・削除」を色々な目的で操作していると、このページャーがスクロールしないと表示されない位置にあるのが不便と思う場合があります。
そこで、このページャーのクローン（パーツのコピー）をページ上部にも表示する事にしました。
デザイン
以下は「Ameblo Management 」のアレンジを適用したページで、このツールによって上部にページャーを表示した状態です。
「テーマを選択」「新しい順・古い順」の機能ボタンを表示する行に、クローンを表示しています。
デフォルトのページデザインの場合は、ツールとしての機能は同じですが、下の様なレイアウトになります。
少し窮屈なレイアウトで色々と工夫をしていますが、デフォルトのデザインに迎合し過ぎると本末転倒になるので、「一応使える」形に纏めています。
「古い順」の表示などに対応
使う場合は少ないと思いますが、「記事の編集・削除」の記事リストは「昇順」「降順」の表示順の変更ができます。 これは「新しい順」「古い順」のボタンを押すことで切替わり、ページを変更するとリセットされ「新しい順」になります。
この「古い順」表示の場合は、クエリ文字列に下の太字部が追加されます。
これまでのコードは、クエリ文字列前半の「?entry_ym=202201」から年月の値を取得してボタン表示にしていました。 そのため「古い順」表示のリストで表示年月の登録をすると「so=A-SC」といった妙なキャプション表示になります。
登録されるのはクエリ文字列全体で機能上は問題ないのですが、登録内容が判らないボタンになるので、正しい年月を取得できるコードに改めました。
また、クエリ文字列を手作業やツールで適当に書換えても、ページが表示される場合があります。 この場合に登録をすると、ありえない不正な値が登録されるので、それに対処しました。（正常なページで登録しなおせば済む話ですが） これは、得られた年度が「2000～2099」の範囲にない場合や、月が「1～12」の範囲にない場合をエラーと判定し、「記事の編集・削除」のトップページに戻る様にしています。
「Quick EntryList」を利用するには
このツールは Chrome / Edge / Firefox の拡張機能「Tampermonkey」上で動作します。 このツールは常駐型のツールで、Tampermonkey上で常に「ON」にしておくと、「記事の編集・削除」の画面を開いた時にのみに起動します。
以下に、このツールの導入手順を簡単に説明します。
❶「Tampermonkey」を導入します
使用しているブラウザに拡張機能「Tampermonkey」を導入する事が必要です。 以下のページに簡単な導入の説明があるので参照ください。
❷「Tampermonkey」にスクリプトを登録します
●「Tampermonkey」の「＋」マークの「新規スクリプト」タブを開きます。
●「新規スクリプト」には、最初からテンプレートが記入されています。 これは全て削除して、完全に空白の編集枠に 下のコードをコピー&ペーストします。
〔コピー方法〕 軽量シンプルなツール「PreBox Button 」を使うと
コード枠内を「Ctrl+左Click」➔「Copy code 」を「左Click」
の操作で、掲載コードのコピーが可能になります。
● 最後に「ファイル」メニューの「保存」を押すと、ツールが使用可能になります。
〔 Quick EntryList 〕 ver. 0.3
// ==UserScript==
// @name Quick EntryList
// @namespace http://tampermonkey.net/
// @version 0.3
// @description 記事の編集・削除の機能拡張
// @author Ameba Blog User
// @match https://blog.ameba.jp/ucs/entry/srventrylist*
// @grant none
// ==/UserScript==
let year_list=[]; // 選択年度の配列
let point_ym; // ユーザーの指定年月のクエリー文字
let qe_ym=[]; // Quick EntryList 復帰ポイントのユーザー設定
let read_json=localStorage.getItem('QE_Point'); // ローカルストレージ 保存名
qe_ym=JSON.parse(read_json);
if(qe_ym==null){
qe_ym=['', '?', '?', '?', '?']; }
let write_json=JSON.stringify(qe_ym);
localStorage.setItem('QE_Point', write_json); // ローカルストレージ 保存
let disp=document.createElement("div");
disp.setAttribute("id", "disp_qe");
disp.innerHTML=
'<span class="qe_s">表示年月：</span>'+
'<button class="qe_button" id="qe_b1"></button>'+
'<button class="qe_button" id="qe_b2"></button>'+
'<button class="qe_button" id="qe_b3"></button>'+
'<button class="qe_button" id="qe_b4"></button>'+
'<select id="ym_select_box"></select>';
if(!document.querySelector('#disp_qe') &&
document.querySelector('#ucsMainLeft h1')){
document.querySelector('#ucsMainLeft h1').appendChild(disp); }
let style=document.createElement('style');
style.setAttribute('id', 'years_style');
style.textContent=
'#disp_qe { float: right; padding-left: 20px; margin-top: -2px; '+
'background: #fff; } '+
'.qe_s { font: normal 14px Meiryo; cursor: default; } '+
'.qe_s:hover::before { '+
'content: "Ctrl+Click：表示年月を登録 Click：登録ページを表示"; '+
'position: absolute; margin: -27px 0 0; padding: 2px 6px 0; '+
'background: #fff; border: thin solid #aaa; } '+
'.qe_button { height: 24px; min-width: 70px; font-size: 15px; '+
'margin: 0 4px; padding: 2px 6px; border: 1px solid #ccc; '+
'vertical-align: -1px; cursor: pointer; } '+
'#ym_select_box { font: bold 18px Meiryo !important; '+
'height: 28px; padding: 0 10px; margin: 0 0 0 20px !important; } '+
'#ym_select_box option { font: bold 18px Meiryo; } '+
'#sorting .pagingArea { float: left; margin: -3px 20px; '+
'background: #fff; } '+
'#sorting .pagingArea ul { padding: 3px 2px 2px; } '+
'#sorting .pagingArea li { margin: 0; padding: 0;border-right: none; } ';
if(!document.querySelector('#years_style') &&
document.querySelector('#disp_qe')){
document.querySelector('#disp_qe').appendChild(style); }
for(let k=1; k<5; k++){
disp_button(k)}
set_year_list();
disp_select();
select_year();
point_set(1);
point_set(2);
point_set(3);
point_set(4);
paging();
function disp_button(n){
let button=document.querySelector('#qe_b'+n);
if(button){
let date_raw;
let ny;
let nm;
if(qe_ym[n].indexOf("&so=")!=-1){ // 古い順表示の場合
date_raw=qe_ym[n].substring(0, qe_ym[n].indexOf("&so=")); }
else{
date_raw=qe_ym[n]; }
ny=date_raw.slice(-6, -2);
nm=date_raw.slice(-2);
if((ny>1999 && ny<2100) && (nm>0 && nm<13)){
button.textContent=ny+'-'+nm; }
else{ // 未登録の場合
button.textContent='- - -'; }}}
function select_year(){
let set_year;
let ym_select_box=document.querySelector('#ym_select_box');
if(ym_select_box){
ym_select_box.onchange=function(){
set_year=ym_select_box.options[ym_select_box.selectedIndex].value;
location.href=
"https://blog.ameba.jp/ucs/entry/srventrylist.do?entry_ym="+
set_year +"01"; }}}
function set_year_list(){
let currentTime=new Date();
let year=currentTime.getFullYear();
for(let k=2000; k<year+1; k++){
year_list.push(k); }
year_list.reverse(); }
function disp_select(){
let page_year;
let ym=location.search;
if(ym){
page_year=ym.slice(-6, -2); }
else{
page_year=0; }
let ym_select_box=document.querySelector('#ym_select_box');
if(ym_select_box){
for(let k=0; k<year_list.length; k++){
let option=document.createElement('option');
option.text=year_list[k];
option.value=year_list[k];
ym_select_box.appendChild(option);
if(page_year==year_list[k]){
option.selected=true; }}}}
function point_set(n){
let point_button=document.querySelector('#qe_b'+n);
if(point_button){
point_button.onclick=function(event){
if(!event.ctrlKey){ // 登録ページの表示
location.href=
"https://blog.ameba.jp/ucs/entry/srventrylist.do"+ qe_ym[n]; }
else{ // ページを登録
let date_raw;
let ny;
let nm;
let current_search; // 現在のクエリー文字列
if(!location.search){ //「記事の編集・削除」の初期表示の場合
let currentTime=new Date();
ny=currentTime.getFullYear();
nm=('0'+(currentTime.getMonth()+1)).slice(-2); }
else{
if(location.search.indexOf("&so=")!=-1){ // 古い順表示の場合
date_raw=location.search.substring(0, location.search.indexOf("&so=")); }
else{
date_raw=location.search; }
ny=date_raw.slice(-6, -2);
nm=date_raw.slice(-2); }
if((ny>1999 && ny<2100) && (nm>0 && nm<13)){
let ok=confirm(
" 💢 Quick指定年月の登録を変更します\n\n"+
"「OK」を押すと現在選択している "+ny+"年 "+nm+"月 のページを登録します" );
if(ok){
current_search=location.search;
if(!current_search){
current_search='?entry_ym='+ny+nm; }
qe_ym[n]=current_search;
let write_json=JSON.stringify(qe_ym); // ローカルストレージ 保存
localStorage.setItem('QE_Point', write_json);
disp_button(n); }}
else{ // クエリーの値が不正値の場合
let ok=confirm(
" 💢 クエリー文字列が異常値で登録できません\n\n"+
" 「OK」を押すと先頭ページに移動します" );
if(ok){
location.href=
"https://blog.ameba.jp/ucs/entry/srventrylist.do"; }}}
}}} // point_set()
function paging(){
let paging_area=document.querySelector('.pagingArea');
if(paging_area){
let sorting=document.querySelector('#sorting');
let s_theme=document.querySelector('#selectTheme');
if(sorting && s_theme){
let clone=paging_area.cloneNode(true);
sorting.insertBefore(clone, s_theme.nextElementSibling); }}}
「Quick EntryList」最新版について
旧いバージョンの「Quick EntryList」は、アメーバのページ構成の変更で動作しない場合があり、導入する場合は最新バージョンをお勧めします。 最新バージョンへのリンクは、以下のページのリンクリストから探せます。
