「未来記事」の「記事タイトル」
「管理トップ」の「最近投稿した記事」のリストは、「記事の編集・削除」とほぼ同じ機能を持っています。 わざわざ「記事の編集・削除」を開かなくても、投稿前や投稿直後の再編集が出来るのは、大変に便利です。
「Ameblo Management」の「最近投稿した記事」のリストのアレンジでは、「下書き」「未来記事」の記事タイトルは「黒」、「投稿済」の記事タイトルは「紺色」になります。 これは、記事タイトルのHTML構成が「a要素」か否かを利用していますが、見分けが付き易いデザインです。
一方、「記事の編集・削除」も、最新の記事リストは「最近投稿した記事」とおうよそ同じになります。
ただし、こちらはHTML構成の関係で、「未来記事」の記事タイトルは「紺色」になっていました。 本当は「管理トップ」の様に、「未来記事」の記事タイトルは「黒」にしたかったのですが、CSSだけではそのアレンジが出来なかったのです。
JavaScriptを使うと高度なアレンジが可能
CSSではどうしても出来ないアレンジ（選択的なアレンジ）が、JavaScriptを使うと簡単に可能な場合があります。「未来記事」のタイトルの文字色を「黒」にするのは簡単でした。 従来、「未来記事」の「日付」を「ブルー反転」の表示にしていましたが、このコードを少し拡張しただけです。
下は、その結果です。
これで、二つのリストのデザインを統一出来ました。
「Quick EntryList」 のマニュアル
「Quick EntryList」の全ての機能や扱い方の詳細は、マニュアルを参照ください。
「Quick EntryList」を利用するには
このツールは Chrome / Edge / Firefox の拡張機能「Tampermonkey」上で動作します。 このツールは常駐型のツールで、Tampermonkey上で常に「ON」にしておくと、「記事の編集・削除」の画面を開いた時に起動します。
以下に、このツールの導入手順を簡単に説明します。
❶「Tampermonkey」を導入します
使用しているブラウザに拡張機能「Tampermonkey」を導入する事が必要です。 以下のページに簡単な導入の説明があるので参照ください。
❷「Tampermonkey」にスクリプトを登録します
●「Tampermonkey」の「＋」マークの「新規スクリプト」タブを開きます。
●「新規スクリプト」には、最初からテンプレートが記入されています。 これは全て削除して、完全に空白の編集枠に 下のコードをコピー&ペーストします。
〔コピー方法〕 軽量シンプルなツール「PreBox Button 」を使うと
コード枠内を「Ctrl+左Click」➔「Copy code 」を「左Click」
の操作で、掲載コードのコピーが可能になります。
● 最後に「ファイル」メニューの「保存」を押すと、ツールが使用可能になります。
〔 Quick EntryList 〕 ver. 1.3
// ==UserScript==
// @name Quick EntryList
// @namespace http://tampermonkey.net/
// @version 1.3
// @description 記事の編集・削除の機能拡張
// @author Ameba Blog User
// @match https://blog.ameba.jp/ucs/entry/srventrylist*
// @match https://blog.ameba.jp/ucs/entry/srventry*draft*
// @match https://blog.ameba.jp/ucs/top.do
// @grant none
// ==/UserScript==
if(location.pathname.includes('srventrylist')){ // 記事の編集・削除の場合
let help_url='https://ameblo.jp/personwritep/entry-12742971012.html';
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=['', '?', '?', '?', '?', '?', '?']; }
else{
for(let k=qe_ym.length +1; k<8; k++){ // 配列の数を7個にする
qe_ym.push('?'); }}
let write_json=JSON.stringify(qe_ym);
localStorage.setItem('QE_Point', write_json); // ローカルストレージ 保存
let qe_copy=0; // 複製フラグ
if(sessionStorage.getItem('QE_copy')){ // ストレージより 取得
qe_copy=sessionStorage.getItem('QE_copy'); }
sessionStorage.setItem('QE_copy', qe_copy); // ストレージ 保存
let help_SVG=
'<svg class="qe_h" height="20" width="24" viewBox="0 0 210 220">'+
'<path d="M89 22C71 25 54 33 41 46C7 81 11 142 50 171C58 177 '+
'68 182 78 185C90 188 103 189 115 187C126 185 137 181 146 175'+
'C155 169 163 162 169 153C190 123 189 80 166 52C147 30 118 18'+
' 89 22z" style="fill:#999;"></path>'+
'<path d="M67 77C73 75 78 72 84 70C94 66 114 67 109 83C106 91'+
' 98 95 93 101C86 109 83 116 83 126L111 126C112 114 122 108 1'+
'29 100C137 90 141 76 135 64C127 45 101 45 84 48C80 49 71 50 '+
'68 54C67 56 67 59 67 61L67 77M85 143L85 166L110 166L110 143L'+
'85 143z" style="fill:#fff;"></path>'+
'</svg>';
let disp_qe=
'<div id="disp_qe">'+
'<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>'+
'<button class="qe_button" id="qe_b5"></button>'+
'<button class="qe_button" id="qe_b6"></button>'+
'<button class="qe_button" id="qe_top">Top</button>'+
'<a href="'+ help_url +'" target="_blank" rel="noopener">'+ help_SVG +
'</a></div>';
let Main_h1=document.querySelector('#ucsMainLeft h1');
if(!document.querySelector('#disp_qe') && Main_h1){
Main_h1.insertAdjacentHTML('beforeend', disp_qe); }
let ym_select=
'<select id="ym_select_box"></select>';
let entrySort=document.querySelector('#entrySort');
if(!document.querySelector('#ym_select_box') && entrySort){
entrySort.insertAdjacentHTML('beforeend', ym_select); }
let qe_style=
'<style id="qe_style">'+
'#disp_qe { float: right; margin-top: -2px; background: #fff; } '+
'.qe_s { position: relative; font: normal 14px Meiryo; cursor: default; } '+
'.qe_s:hover::before { '+
'content: "▼ Ctrl+Click：現在の表示年月を登録 Click：登録ページを表示"; '+
'position: absolute; top: -28px; left: 93px; display: block; white-space: nowrap; '+
'height: 19px; padding: 0 6px; background: #fff; border: 1px solid #aaa; } '+
'.qe_button { height: 25px; max-width: 72px; font-size: 15px; '+
'margin: 0 3px; padding: 2px 6px; border: 1px solid #aaa; border-radius: 3px; '+
'background: #fff; vertical-align: -1px; cursor: pointer; } '+
'.qe_button:hover { outline: 1px solid #2196f3; } '+
'.qe_h { vertical-align: -6px; } '+
'#entrySort { position: relative; } '+
'#entryYear { display: flex; justify-content: space-between; '+
'align-items: center; width: 120px; margin: 0 5px; } '+
'#yearText { position: absolute; top: 6px; left: 84px; width: 16px; '+
'padding: 0 1px; font-size: 14px; color: #1976d2; z-index: 1; } '+
'#ym_select_box { position: absolute; top: 0; left: 24px; height: 28px; '+
'width: 81px; padding: 1px 11px 0 0; font: bold 18px Meiryo !important; '+
'text-align: center; border: 1px solid #ccc; outline: none; background: #fff; '+
'appearance: none; scrollbar-width: none; cursor: pointer; } '+
'#ym_select_box::-webkit-scrollbar { display: none; } '+
'#ym_select_box option { font: bold 18px Meiryo; } '+
'#entryMonth { margin-right: -10px; } '+
'#ucsContent { margin-bottom: 0; } '+
'#ucsMain { padding-bottom: 0; } '+
'#sorting .pagingArea { float: left; margin: -3px -10px -3px 20px; } '+
'#sorting .pagingArea ul { padding: 3px 2px 2px; } '+
'#sorting .pagingArea li { margin: 0; padding: 0; border-right: none; '+
'background: #fff; }</style>';
if(!document.querySelector('#qe_style')){
document.documentElement.insertAdjacentHTML('beforeend', qe_style); }
for(let k=1; k<7; k++){
disp_button(k)}
set_year_list();
disp_select();
select_year();
point_set(1);
point_set(2);
point_set(3);
point_set(4);
point_set(5);
point_set(6);
point_top();
paging();
scheduled();
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 query;
let input_year=document.querySelector('input[name="urlParam"]');
if(input_year){
query=input_year.value;
page_year=query.slice(-6, -2); }
if(!page_year){
let currentTime=new Date();
let current_year=currentTime.getFullYear();
page_year=current_year; }
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 point_top(){
let point_top=document.querySelector('#qe_top');
if(point_top){
point_top.onclick=function(event){
location.href=
"https://blog.ameba.jp/ucs/entry/srventrylist.do"; }}}
function paging(){
let paging_area=document.querySelector('.pagingArea');
if(paging_area){
let sorting=document.querySelector('#sorting');
let s_theme=document.querySelector('#selectTheme');
let clone_paging=document.querySelector('#sorting .pagingArea');
if(!clone_paging){
if(sorting && s_theme){
let clone=paging_area.cloneNode(true);
sorting.insertBefore(clone, s_theme.nextElementSibling); }}}}
function scheduled(){
let currentDate = new Date();
let year=currentDate.getFullYear();
let month=currentDate.getMonth() + 1;
let date=currentDate.getDate();
let hour=currentDate.getHours();
let minute=currentDate.getMinutes();
function formatTime(val) {
return ("0" + val).slice(-2); } //「0」付きで2桁テキストに変更
let now=year + formatTime(month) + formatTime(date) +
formatTime(hour) + formatTime(minute)
now=parseInt(now, 10);
let page_year=document.querySelector('#entryYear #year');
if(page_year){
page_year=page_year.textContent; }
else{
page_year='2000'; }
let entry_item=document.querySelectorAll('.entry-item');
for(let k=0; k<entry_item.length; k++){
let p_title=entry_item[k].querySelector('.titleCol h2 a');
let p_time=entry_item[k].querySelector('#entryList .date');
let p_date=p_time.textContent;
p_date=page_year + p_date.replace(/[^0-9]/g, '');
p_date=parseInt(p_date, 10); // 文字列を10進数に変換
if(p_date>now){
p_time.style.color='#fff';
p_time.style.background='#2196f3';
if(p_title){
p_title.style.color='#000'; }}}
} // scheduled()
let copy_button=document.querySelectorAll('.deleteCol .process[onclick*="copyEntry"]');
for(let k=0; k<copy_button.length; k++){
copy_button[k].onmousedown=(event)=>{
if(event.ctrlKey){
sessionStorage.setItem('QE_copy', 1); }}} // ストレージの複製フラグをセット
if(qe_copy==1){ // 複製操作で最新ページを開いた時に実行
sessionStorage.setItem('QE_copy', 0); // ストレージの複製フラグをリセット
let edit_button=document.querySelectorAll('.deleteCol .process[href*="/ucs/entry/"]');
let entry_id=document.querySelectorAll('input[name="entry_id"]');
let temp_id=0;
let index=-1;
for(let k=0; k<entry_id.length; k++){
if(temp_id<entry_id[k].value/1){
index=k;
temp_id=entry_id[k].value; }} // IDの最新記事を取得
edit_button[index].click(); } // 複製した記事を再編集で開く
} // 記事の編集・削除の場合
if(location.pathname.includes('top.do')){ // 管理トップの場合
let EntryStatus=document.querySelectorAll('.recentEntry__itemEntryStatus');
for(let k=0; k<EntryStatus.length; k++){
if(EntryStatus[k].textContent.includes('下書き中')){
EntryStatus[k].style.overflow='hidden';
let add=
'<span style="padding:2px 4px; margin: 0 -4px; '+
'color: #fff; background: #2196f3;">下書き</span>';
let str=EntryStatus[k].textContent.split('・');
if(str.length<3){
EntryStatus[k].innerHTML=add; }
if(str.length==3){
EntryStatus[k].innerHTML=str[0] +' '+ add; }}}
} // 管理トップの場合
if(location.pathname.includes('draft')){ // 下書き保存確認画面の場合
//「記事の編集・削除を表示」ボタンを表示
let el_button=
'<div id="el_button">'+
'<svg viewBox="0 0 120 120">'+
'<path d="M0 0L0 112L112 112L112 0L0 0z" style="fill: #fff"></path>'+
'<path d="M23 21L45 21C48 21 52 20 55 22C60 26 56 34 64 36C70 38 '+
'78 37 84 37C88 37 92 37 94 40C97 43 96 48 96 52L96 81C100 81 103 '+
'80 105 76C107 73 106 69 106 65L106 43C106 39 106 35 104 31C101 27 '+
'96 27 92 27C84 27 76 27 68 27C68 22 68 17 65 14C61 10 55 11 50 11C39 '+
'11 26 8 23 21M52 43C52 40 52 38 51 35C48 25 35 27 27 27C21 27 13 26 '+
'9 32C6 37 7 43 7 48L7 82C7 87 6 94 10 97C15 101 22 100 28 100L69 '+
'100C74 100 81 101 86 98C90 95 90 91 90 86L90 58C90 53 90 48 86 '+
'45C83 43 79 43 75 43L52 43z" style="fill: #1976D2"></path>'+
'<path d="M80 53C72 52 65 52 57 52C54 52 49 53 47 52C40 48 44 39 '+
'38 37C34 36 21 35 18 39C16 42 17 45 17 48L17 69C17 74 15 85 18 '+
'89C21 92 28 91 32 91L67 91C71 91 77 92 80 89C82 86 81 81 81 78C81 '+
'70 81 61 80 53z" style="fill: #fff"></path></svg>'+
'記事の編集・削除を表示'+
'<style>'+
'#el_button { position: absolute; top: 100px; left: calc(50% + 200px); '+
'font: bold 16px Meiryo; white-space: nowrap; padding: 7px 20px 5px; '+
'border-radius: 6px; color: #1976D2; background: #fff; '+
'box-shadow: 5px 10px 30px #00000025; } '+
'#el_button:hover { background: #cfd8dc; } '+
'#el_button svg { width: 48px; height: 36px; vertical-align: -12px; } }'+
'</style></div>';
if(!document.querySelector('#el_button')){
document.body.insertAdjacentHTML('beforeend', el_button); }
let files_link=document.querySelector('#el_button');
if(files_link){
files_link.onclick=function(){
location.href="https://blog.ameba.jp/ucs/entry/srventrylist.do"; }}
} // 下書き保存確認画面の場合
「Quick EntryList」最新版について
旧いバージョンの「Quick EntryList」は、アメーバのページ構成の変更で動作しない場合があり、導入する場合は最新バージョンをお勧めします。 最新バージョンへのリンクは、以下のページのリンクリストから探せます。
