記事タイトルのメモマーク、どうしたらつけられますか(リライト、記事の再編集) | パソコンが好きになるブログ〜表技・裏技・便利技伝授!

パソコンが好きになるブログ〜表技・裏技・便利技伝授!

北海道札幌市中央区 大通駅徒歩7分のパソコンスクール「リズ札幌・ライフデザインスクール」パソコンインストラクター川上雄大によるパソコン・IT・ワンポイントレッスン。
スクールでのいろんな方のパソコンレッスンだったり、パソコンとは関係ない話だったり…

こんにちは、パソコンワンポイントレッスン!

PCインストラクターの川上です。


今日の1つ目アップした記事のコメントで、記事とは全然関係ないところ(かえって歓迎^^)で、こんなご質問がありましたので、急遽アップいたします(笑)

そのご質問とは・・・

ところで、ずっと気になっていたんですが、
記事タイトルのメモマーク、どうしたらつけられますか?

西川さんも同じのをつけていますよね。

===================
※ちなみに、この↑枠(角が丸い枠)は(IE8以前だと丸く見えませんのでご注意を)

<div style="background: rgb(255, 238, 238); padding: 10px; border-radius: 10px; border: 3px dotted rgb(255, 0, 0); -moz-border-radius: 10px; -webkit-border-radius: 10px;">○○○</div>

で作ってます。 HTML表示にコピペして、○○○を文章に置き換えると同じようにできますので^^
===================


ん?それはこの記事タイトルの↓↓↓

川上雄大のワンポイントレッスン

最後についている、このメモ帳の画像ですね↓↓↓

川上雄大のワンポイントレッスン

気づかれてしまいましたねぇ~(苦笑)


これは、過去記事を修正したりするときに便利な記事修正ボタンなのです


記事タイトルの横のボタンをワンクリックするだけで記事の編集画面にいけるので、記事修正の時は便利なんです。

私は以前は記事フッターに「リライト」とか「記事編集」といったリンクをペタの隣につけていたのです。

川上雄大のワンポイントレッスン

でも、いつも「ペタ」を押していただく方から、この「リライト」って何?と聞かれることが多くなり、

あぁ、そうか・・・見る方に余計なリンクは邪魔だな、と思ってはずしていたのです。

だって、自分だけが使うリンクですから。


すると、2013年7月9日に西川先生がこの記事↓↓↓
★記事修正ボタンで簡単記事再アップ

を書いてくださったので、それ以来、タイトル横にこっそりと
記事修正ボタンを置いているのです。

やっぱり、誤字脱字があると恰好悪いですからねぇ~(苦笑)

すぐに修正できるように、そうしてます、ハイ^^

具体的な設置方法は、我らがわざめーばさんのこちらの記事↓↓↓
【新】記事タイトル横に記事修正ボタンを設置する方法

で書かれています。

フリープラグインにコピペするだけです!

事前準備として、フリープラグイン内でjQueryを使えるように設定しておけば、
(まだされていない方は、フリープラグインの先頭ではjQueryを使えるようにしておく をご覧になってください。)

次のようにわざめーばさんの用意していただいたコードを貼り付けるだけです。


川上雄大のワンポイントレッスン
 
<!-- 記事修正ボタン -->
<script src="http://p.wazameba.com/njs/ent.js"></script>
<script>$(function(){wzmbKijiEdit()})</script>



あっ、そうそう・・・

この質問、コメントでしてきた人はこの人ですよ~~~(笑)
お察しの通り、あの方です(笑)



<追記1>
ちなみに、現在の私の場合は、記事タイトル最後にメモマークではなくて、透明のgifファイルを設置して、記事修正ボタンとしています^^;

(フリープラグインにこちらのスクリプト↓を追加するとできます。ただし新デザイン用ですので。)


<script>
$(function(){
  var img = 'http://stat.ameba.jp/user_images/20140418/14/sumitak1329/d8/db/g/o0020002012912411565.gif';
  $(".skinArticleHeader").each(function(i, h){
    $('h1', h).append('<a class="edit" href="http://blog.ameba.jp/ucs/entry/srventryupdateinput.do?id=' + $('.skinArticleTitle', h).attr('href').replace(/^.*entry\-(\d+)\.html.*$/, "$1") + '" target="_blank"><img src="' + img + '"></a>');
  });
});
</script>


旧デザインの方は、こちらになります↓

<script>
$(function(){$('#sub_main div.entry h3.title').each(function(i,e){
var id = $('a', e).attr('href').replace(/^.*entry\-(\d+)\.html.*$/, '$1');
var url = 'http://blog.ameba.jp/ucs/entry/srventryupdateinput.do?id=' + id;
var img = 'http://stat.ameba.jp/user_images/20140418/14/sumitak1329/d8/db/g/o0020002012912411565.gif';
$(e).append('<a class="edit" href="'+url+'"><img src="'+img+'" /></a>');
})});
</script>


<追記2>
2015年4月25日にも再度記事をアップいたしましたので、こちらもご覧くださいませ↓↓↓

過去記事を素早く修正する方法




以上、記事修正ボタンの設置でした。

LIDS澄川・ライフデザインスクール
川上 雄大