Firefoxのデザイン崩れに修復対応しました
Firefoxの「全角空白が関係する改行」に対応したデザイン修正を行いました。
「Follow Feed Checker」の設定パネルは、「HOME」の左上隅のアメーバアイコンを「左Click」すると表示されます。 このパネルのレイアウトが、不測の改行によって
下の様に崩れされていました。
下は、修復後の正常なデザインです。
「Follow Feed Checker」の全ての機能と操作方法
「Follow Feed Checker」は、ホームのフォローフィードを便利にします。
①「フォローフィード」の自動更新と、スクロールで指定した件数を自動表示する
➁「フォローフィード」から、フォロー対象の設定変更・解除を可能にする
フォロー/フォロワーの関連ツールとして、先ずお勧めしたいツールです。 気になったブログを見つけたらとにかくフォローし、後々は本当に有益なフォローに整理するという、快適で有効なフォロー方法を支援します。
操作方法の詳細は、以下のマニュアルを参照ください。
「Ameblo Management」の利用をお勧めします
「Follow Feed Checker」は「Ameblo Management」でアレンジした「HOME」画面や「フォロー管理」画面を前提に制作しています。 とりわけ「フォローフィード」は、「Ameblo Management」を適用すると圧倒的に使い易くなります。
▪「フォローフィード」は「HOME」画面の最上部に配置されます。
▪ デフォルトの2列の千鳥配列は、1列で縦並びのリストになります。
▪「新着 ●」「未読 ●」のマークと「記事タイトル文字色」で、未読 / 既読が明瞭に判断出来ます。 デフォルトの新着マークが消えた後も、未読が判断できます。
「Ameblo Management」は、「ホーム」画面以外にも、アメブロの多くの画面のデザインをユーザーライクにアレンジします。 このスタイルを利用するには、以下のリンク先の導入手順を参照ください。
「Follow Feed Checker」を利用するには
このツールは Chrome / Edge / Firefox版の拡張機能「Tampermonkey」上で動作します。 以下に、このツールの導入手順を簡単に説明します。
❶「Tampermonkey」を導入します
◎ 使用しているブラウザに拡張機能「Tampermonkey」を導入する事が必要です。
既に「Tampermonkey」を導入している場合は、この手順 ❶ は不要です。
拡張機能の導入については、以下のページに簡単な説明があるので参照ください。
❷「Tampermonkey」にスクリプトを登録します
◎「Tampermonkey」の「＋」マークの「新規スクリプト」タブを開きます。
◎「新規スクリプト」には、最初からテンプレートが記入されています。 これは全て削除して、完全に空白の編集枠に 下のコードをコピー&ペーストします。
〔コピー方法〕 軽量シンプルなツール「PreBox Button 」を使うと
コード枠内を「Ctrl+左Click」➔「Copy code 」を「左Click」
の操作で、掲載コードのコピーが可能になります。
◎ 最後に「ファイル」メニューの「保存」を押すと、ツールが使用可能になります。
〔 Follow Feed Checker 〕 ver. 1.9
// ==UserScript==
// @name Follow Feed Checker
// @namespace http://tampermonkey.net/
// @version 1.9
// @description 「フォローフィード」の管理補助ツール
// @author Ameba Blog User
// @match https://www.ameba.jp/home
// @match https://blog.ameba.jp/ucs/blgfavorite/*
// @match https://blog.ameba.jp/ucs/top.do
// @grant none
// ==/UserScript==
let path=document.location.pathname;
if(path=='/home'){ // HOMEページで有効
let mode=0;
let lock=0;
let user_id;
let redo; // インターバル変数
let setting=[]; // 動作設定の記録配列
// setting[0] スクリプト名
// setting[1] フィード初期リスト数
// setting[2] フィードタイマー更新 ON/OFF
// setting[3] タイマー更新の繰返し時間
// setting[4]
// setting[5] リスト更新直前の最下のリスト番号
// setting[6] リスト更新直前のページスクロール量
let read_json=localStorage.getItem('followfeed_set'); // ローカルストレージ保存名
setting=JSON.parse(read_json);
if(setting==null || setting.length<7){
setting=['FollowFeedSet',20,1,10,0,0,0]; }
let write_json=JSON.stringify(setting);
localStorage.setItem('followfeed_set', write_json); // ローカルストレージ保存
ff_panel();
ff_setting();
auto_feed();
function slow_more(){
let more_button=
document.querySelector('.HomeChecklist .Collection_ReadMore_Button');
if(more_button){
let rect=more_button.getBoundingClientRect();
let item=document.querySelectorAll('.HomeChecklist_Collection_Item');
if(rect.top<window.innerHeight && item.length<setting[1]){ // 指定記事数まで 🔴
last_item();
more_button.click(); }}}
function last_item(){
let item=document.querySelectorAll('.HomeChecklist_Collection_Item');
for(let k=item.length-1; k>=0; k--){
let rect=item[k].getBoundingClientRect();
if(rect.top<window.innerHeight){
setting[5]=k; // 🔵 リストの表示上の末尾を取得
setting[6]=parseInt(window.pageYOffset);
break; }}
let write_json=JSON.stringify(setting);
localStorage.setItem('followfeed_set', write_json); } // ローカルストレージ保存
function fix_last(){
let item=document.querySelectorAll('.HomeChecklist_Collection_Item');
let more_button=
document.querySelector('.HomeChecklist .Collection_ReadMore_Button');
if(more_button){
if(item.length<setting[5]){ // 指定記事までリストを開く 🔵
more_button.click(); }}
document.documentElement.scrollTop=setting[6]; }
function top_env(){ // ページ最上部に 戻るボタン・スクロールバー で戻った場合
if(document.documentElement.scrollTop<100){
setting[5]=8;
setting[6]=0;
let write_json=JSON.stringify(setting);
localStorage.setItem('followfeed_set', write_json); }} // ローカルストレージ保存
function auto_feed(){
redo=setInterval(()=>{
feed(setting[2]); }, setting[3]*60000); } // 自動タイマー設定と開始 🔴
function feed(sw){
let control_b=document.querySelector('.PcModuleHeader_Control button');
if(control_b && sw==1){
last_item(); // 🔵 リストスクロール位置取得
control_b.click();
fix_last(); }} // 指定記事までリストを開く 🔵
function ff_panel(){
let help_SVG=
'<svg class="ff_help" 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:#000;"></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 panel=
'<div id="ff_panel">'+
'<input id="ff_close" type="submit" value="✖">'+
'<span> フィードの初期リスト数 </span>'+
'<input id="list_open" type="number" value="20" min="10" step="10"> '+
'<label><input id="ff_timer" type="checkbox"> タイマー更新</label> '+
'<div id="ref_set"><span>更新間隔 </span>'+
'<input id="ref_setter" type="number" value="10" min="1" max="30" step="1">'+
'<span> 分</span></div>'+
help_SVG+
'<style>#ff_panel { position: fixed; top: 8px; left: calc(50% - 532px); '+
'font: bold 16px/24px Meiryo; color: #666; background: #fff; '+
'width: auto; height: 30px; padding: 7px 60px 3px 20px; border: 1px solid #20d6c5; '+
'box-shadow: 4px 6px 8px rgb(0, 0, 0, .1); z-index: 10; display: none; } '+
'@media screen and (max-width: 1140px){ #ff_panel { left: 28px; }} '+
'#ff_close { padding: 3px 2px 1px; } '+
'#list_open, #ref_setter { width: 50px; height: 18px; padding: 4px 2px 1px; '+
'text-align: center; } '+
'#ref_set { display: inline-block; } '+
'.ff_help { position: absolute; top: 9px; right: 12px; width: 24px; height: 24px; '+
'cursor: pointer; } '+
'.PcHeader_Logo_Image { outline: 1px solid #20d6c5; outline-offset: 3px; } '+
'</style></div>';
if(!document.querySelector('#ff_panel')){
document.body.insertAdjacentHTML('beforeend', panel); }}
function ff_setting(){
let pc_logo=document.querySelector('h1.PcHeader_Logo');
let ff_panel=document.querySelector('#ff_panel');
if(pc_logo && ff_panel){
pc_logo.onclick=function(event){
event.preventDefault();
ff_panel.style.display='block';
let ff_close=document.querySelector('#ff_close');
ff_close.onclick=function(event){
event.stopImmediatePropagation();
window.location.reload(); }
let list_open=document.querySelector('#list_open');
list_open.value=setting[1];
list_open.onchange=function(){
setting[1]=parseFloat(list_open.value);
let write_json=JSON.stringify(setting);
localStorage.setItem('followfeed_set', write_json); } // ストレージ保存
let ff_timer=document.querySelector('#ff_timer');
let ref_set=document.querySelector('#ref_set');
let ref_setter=document.querySelector('#ref_setter');
if(setting[2]==1){
ff_timer.checked=true;
ref_set.style.opacity=1;
ref_setter.disabled=false; }
else{
ff_timer.checked=false;
ref_set.style.opacity=0.5;
ref_setter.disabled=true; }
ff_timer.onchange=function(){
if(ff_timer.checked){
setting[2]=1;
ref_set.style.opacity=1;
ref_setter.disabled=false; }
else{
setting[2]=0;
ref_set.style.opacity=0.5;
ref_setter.disabled=true; }
let write_json=JSON.stringify(setting);
localStorage.setItem('followfeed_set', write_json); } // ストレージ保存
ref_setter=document.querySelector('#ref_setter');
ref_setter.value=setting[3];
ref_setter.onchange=function(){
if(parseFloat(ref_setter.value)>=0.1){
setting[3]=parseFloat(ref_setter.value); }
else{
setting[3]=1; }
let write_json=JSON.stringify(setting);
localStorage.setItem('followfeed_set', write_json); } // ストレージ保存
let ff_help=document.querySelector('.ff_help');
if(ff_help){
ff_help.onclick=()=>{
let url='https://ameblo.jp/personwritep/entry-12796420579.html'
window.open(url, '_blank'); }}
}}} // ff_setting()
let target=document.querySelector('.HomeChecklist'); // 監視 target
let monitor=new MutationObserver(main);
monitor.observe(target, {childList: true, subtree: true}); // 監視開始
function main(){
fix_last(); // ホームを開いた時の初期リスト表示 🔴
window.addEventListener('wheel', function(){
slow_more(); });
window.addEventListener("scroll", function() {
top_env(); });
window.addEventListener("beforeunload", function(){
setting[5]=8;
setting[6]=0;
let write_json=JSON.stringify(setting);
localStorage.setItem('followfeed_set', write_json); }); // ローカルストレージ保存
let more_button=
document.querySelector('.HomeChecklist .Collection_ReadMore_Button');
if(more_button){
more_button.addEventListener('mousedown', function(event){
last_item(); }); }
mode_select();
checker();
function mode_select(){
let control_a=document.querySelector('.PcModuleHeader_Control a');
control_a.onclick=function(e){
lock=1; } //「設定」で mode_selectを抑止
let control_b=document.querySelector('.PcModuleHeader_Control button');
control_b.onclick=function(e){
lock=1;
setTimeout( function(){
lock=0; }, 100); } //「フィードを更新」で mode_selectを抑止
let checklist=document.querySelector('.HomeChecklist');
let title=document.querySelector('.HomeChecklist .PcModuleHeader');
let title_label=document.querySelector('.HomeChecklist .PcModuleHeader_Title');
let title_con=document.querySelectorAll('.PcModuleHeader_Control_Link');
title.style.cursor='pointer';
title.onclick=function(){
if(mode==0 && lock==0){
mode=1;
checklist.style.boxShadow='0 0 0 15px #6292ab inset';
title.style.boxShadow='0 -4px 0 10px #6292ab, 0 0 0 20px #6292ab inset';
title_label.style.color='#fff';
title_con[0].style.background='#fff';
title_con[1].style.background='#fff';
wide_style();
checker();}
else if(mode==1 && lock==0){
mode=0;
checklist.style.boxShadow='';
title.style.boxShadow='';
title_label.style.color='#298538';
title_con[0].style.background='';
title_con[1].style.background='';
wide_style_off();
checker(); }}
let k;
let r_column=document.querySelector('.PcLayout_RightColumn');
let c_style=window.getComputedStyle(r_column);
let c_width=c_style.getPropertyValue('width');
let c_item=document.querySelectorAll('.HomeChecklist_Collection_Item:nth-child(odd)');
function wide_style(){
if(c_width=='740px'){
checklist.style.padding='20px';
for(k=0; k<c_item.length; k++){
c_item[k].style.marginRight='24px'; }}}
function wide_style_off(){
if(c_width=='740px'){
checklist.style.padding='';
for(k=0; k<c_item.length; k++){
c_item[k].style.marginRight='64px'; }}}}
function checker(){
let k;
let user_href;
let item=document.querySelectorAll('.HomeChecklist_Collection_Item');
for(k=0; k<item.length; k++){
select_item(k); }
function select_item(n){
if(mode==1){
item[n].onclick=function(e){
e.preventDefault();
user_href=item[n].querySelector('.HomeChecklist_Article_Link').getAttribute('href');
user_id=user_href.replace('https://ameblo.jp/', '');
let index=user_id.indexOf('/entry');
user_id=user_id.substring(0, index);
item[n].style.outline='2px solid red';
setTimeout( conf, 800);
function conf(){
item[n].style.outline='';
let url_str='https://blog.ameba.jp/ucs/blgfavorite/favoritelist.do?' + user_id;
window.open( url_str, '_blank'); }}} // ページ移動
else if(mode==0){
item[n].onclick=function(e){ ; }}}}
} // main()
} // HOMEページで有効
if(path.includes('blgfavorite')){ // フォロー管理ページで有効
let user_id;
let win_url;
let target=document.querySelector('body'); // 監視 target
let monitor=new MutationObserver(table_view);
monitor.observe(target, {childList: true, subtree: true}); // 監視開始
function table_view(){ // HOMEから遷移して来た最初の管理画面でのみ動作する
let k;
let tr_href=[];
let find=0;
win_url=window.location.search.substring(1,window.location.search.length);
if(win_url !='' && win_url.indexOf('pageID') ==-1){ // URLにuser_idが有る場合
user_id=win_url;
sessionStorage.setItem('followfeedcheck_id', user_id); // セッションストレージ名
let table_tr=document.querySelectorAll('.tableList tbody tr');
for(k=0; k<table_tr.length; k++){
tr_href[k]=table_tr[k].querySelector('td.title a').getAttribute('href');
if(tr_href[k].indexOf(user_id) !=-1){
find=1;
table_tr[k].style.outline='2px solid red';
table_tr[k].scrollIntoView({block: 'center'});
return; }} // 検索処理を終了
if(find==0){ // user_idが見つからないと2ページへ移動
let pager=document.querySelector('.pagingArea');
let end=document.querySelector('.pagingArea .disabled.next');
if(!end && pager){ // ページング末尾で無ければ2ページへ
let url_str='https://blog.ameba.jp/ucs/blgfavorite/favoritelist.do?pageID=2&More';
window.open( url_str, '_self'); }}} // URLにuser_idが有る場合
else if(win_url.indexOf('&More') !=-1){ // URLに&Moreが有る場合のみ
user_id=sessionStorage.getItem('followfeedcheck_id'); // &Moreページで再読込み
let table_tr=document.querySelectorAll('.tableList tbody tr');
for(k=0; k<table_tr.length; k++){
tr_href[k]=table_tr[k].querySelector('td.title a').getAttribute('href');
if(tr_href[k].indexOf(user_id) !=-1){
find=1;
table_tr[k].style.outline='2px solid red';
table_tr[k].scrollIntoView({block: 'center'});
return; }} // 検索処理を終了
if(find==0){ // user_idが見つからないと次ページへ移動
let end=document.querySelector('.pagingArea .disabled.next');
if(!end){ // ページング末尾で無ければ次ページへ
let page_n=win_url.replace(/[^0-9]/g, '');
page_n=parseInt(page_n, 10) +1;
let url_str=['https://blog.ameba.jp/ucs/blgfavorite/favoritelist.do?pageID=',
+ page_n + '&More'].join('');
window.open( url_str, '_self'); }}}
else{ ; } // HOMEからの遷移ではなく、単独でフォロー管理を開いた場合
} // table_view()
} // フォロー管理ページで有効
if(path=='/ucs/top.do'){ // 管理トップ で実行
let style=
'<style class="ff_link">'+
'.user__followInfo { cursor: pointer; border-radius: 4px; } '+
'.user__followInfo:hover { outline: 1px solid #2196f3; background: #f7fbfb; } '+
'</style>';
if(!document.querySelector('.ff_link')){
document.body.insertAdjacentHTML('beforeend', style); }
let followinfo=document.querySelector('#contents .user__followInfo');
if(followinfo){
followinfo.onclick=()=>{
location.href='https://blog.ameba.jp/ucs/reader/readerlist.do'; }}
let f_memo; // フォロワー数の記録
f_memo=localStorage.getItem('follower_memo'); // ローカルストレージ保存名
if(f_memo==null){
f_memo=0; }
localStorage.setItem('follower_memo', f_memo); // ローカルストレージ保存
if(followinfo){
let fnum=followinfo.querySelector('.user__followNumber');
let now_fnum; // 現在のフォロワー数
if(fnum){
now_fnum=parseInt(fnum.textContent, 10); // 更新されたフォロワー数
if(f_memo!=now_fnum){
fnum.style.color='red';
followinfo.style.background='#aaead6';
setTimeout(()=>{
localStorage.setItem('follower_memo', now_fnum); // ローカルストレージ保存
}, 1000); }}}
} // 管理トップ で実行
「Follow Feed Checker」最新版について
旧いバージョンの JavaScriptツールは、アメーバのページ構成の変更で動作しない場合があり、導入する場合は最新バージョンをお勧めします。
●「Follow Feed Checker」の最新バージョンへのリンクは、以下のページのリンクリストから探せます。
