自作ツールのご紹介ですさとうあやこさんのブログコンサルを
受けてから
ブログのカスタマイズしようと
色々やってたら
アメブロのあまりの
クセの強さに悶絶してました
特に不便だと思ったのは
スマホ関連
スマホ用画面は
カスタムヘッダーもつけられないし
フリープラグインも効かない
定型文も使えない
・・・
そんなこんなで
エンジニア魂に火がついてしまい
何とか裏技はないかなぁと
諸々ハマっていたら
ブログが疎かになりました
・・・ハイ本末転倒
さて結果わかったこと
アメブロのスマホ用画面は
定型文も
CSSも
毎回本文に
書かなくてはいけないという・・・
つまり共通の何かを置きたかったら
過去記事も一個ずつ
編集しないといけない
(´・ω・｀)
アメブロは
圧倒的にスマホ読者が多いので
地道に過去記事を
編集することにしました
マイページの編集画面から
一個ずつ開いても良いのですが
閲覧画面の方が
年や月をまたいでも関係なく
一律ページ送りできるので
閲覧画面から編集画面へ行ける
便利ツールを作りました
記事一覧上（URLの末尾がentrylist.html）でも
個別の記事（URLの末尾がentry-[数字].html）でも
このように編集ボタンを表示して
閲覧画面からも
編集できるようにします！
■やり方■
１．下のボックス内をコピペします
javascript: var $parents=null;$("[amb-component=entryItemTitle]")[0]?$parents=$("[amb-component=entryItemTitle]"):$("[amb-component=entryTitle]")[0]?$parents=$("[amb-component=entryTitle]"):$(".contentTitleArea")[0]?$parents=$(".contentTitleArea"):alert("対応していません"),$parents&&$parents.each(function(t,e){var n=$(e),a=n.find("a").attr("href"),p=a.replace(/^https?:\/\/[\w/:#\$&\?\(\)~\.=\+\-]+\/entry\-(\d+)\.html$/,"$1"),r="http://blog.ameba.jp/ucs/entry/srventryupdateinput.do?id="+p,i='<p amb-component="widgetButton" class="skin-widgetButton" style="width:150px;"><a href="'+r+'" target="_blank" amb-component="button" class="skin-btnSide customEdit" style="height: 25px; line-height: 25px;">編集する</a></p>';0===n.find(".customEdit").length&&n.append(i)});
２．アメブロを編集するブラウザに登録します
（解説はGoogle Chromeです）２．アメブロを編集するブラウザに登録します
２−１．予めブックマークバーを表示するようにする
２−２．ページの追加を選ぶ
２−３．URL欄にコピーした中身を貼り付ける
（名前はわかりやすければ何でもOK）
３．実行してみる
記事一覧か記事のページを開いて
作成した名前をクリックしてみましょう
「編集する」ボタンが
タイトル近くに表示されましたか？
ブラウザによっては難しいようなので
もし違うブラウザを使ってて
「やりたいけどやり方がわからない！」
という方は
コメント欄などでお知らせください
誰かのお役に立てれば幸いです
あ、ちなみに私のブログの スマホ画面はまだデフォルトの
ままです
カスタムヘッダー作るの
これからですからね！
・・・ハイ本末転倒
