トップ > ブログカスタマイズ > 編集用リンクの追加(SeesaaBLOG編)
08. 14. 2005

編集用リンクの追加(SeesaaBLOG編)

またまた、シーサーブログのカスタマイズです。

検索エンジン対策(SEO)がメインテーマなのにカスタマイズのネタばっかですね…(^_^;)


さて…”メインテーマ”と言えば!・・・薬師丸ひろ子


”ひろこ”と言えば!・・・谷山浩子


この時代の人なら知ってるはず!・・・伊藤つかさ
つかさちゃん暴れん坊将軍に出てますがぁ〜!猛烈ファン多かったでぇ〜


※特に意味無いです・・・m(__)m


…ならば、アクセス向上の秘訣を一つ … ご伝授しましょう。


ひ・た・す・ら・・・


・・・毎日・・・


・・・


・・・投稿・・・


・・・


するべし!


するべし!!




するべし!!!




・・・ ( ナレーション:呆れ顔で、一同散り始める… )


・・・ あっ〜行かないでぇ〜 ・・・ (^_^;)



いやっ・・これは冗談ではないんです。
でも、予めしておく必要があることってあるでしょ・・・

※ブログのカスタマイズは検索エンジン対策として行う場合があります。
まぁ〜今はシーサーブログカスタマイズに馴れること、それから、使い勝手の向上ということで・・・(^。^)だめ?

※初めから難易度高めなのも知ってますが、とりあえずシーサーブログで何が出来るか知ってた方が面白いかなって。ボチボチ、シーサーブログカスタマイズ入門編もやりますから、とりあえず夢を膨らませておいて・・・ね♪

個別記事の修正画面呼び出しって大変じゃない?

さて、今日はこのブログでも使ってる【編集】リンクについて一席設けたいと思います。

何をする「リンク」かというと、普通なら管理画面を開いて【記事】→【記事一覧】から該当記事の修正画面を呼び出して修正する作業を、閲覧画面の「個別記事」内へ編集画面呼び出し用のリンクを持たせてしまおうというものです。

何が便利かというと、自分の過去ログを見ていて誤字や脱字を発見した時に、その修正画面をすぐ呼び出せます。トラックバックのお返しが簡単になります。・・・など。
※…というかHP代わりにブログを使う人にはおすすめの機能ですね。

僕はこれがないと「ブログの管理したくないかなぁ」ってくらい便利に使ってます。

個別記事編集用リンクのコード

以前の投稿で「シーサーブログにパン屑リストは付くか?」というのがあります。

シーサーブログのカスタマイズ性は、表面上簡単で便利なのですが、ちょっと手の込んだことをしようとするとやはりHTMLコードを弄る必要があります。さらに追加するコードを入れる場所も考慮しないと正常に動きません。

・・・とは言え面倒なことは僕も嫌いなので、編集用のコードをとりあえず提示します。
※このコードはシーサーブログの変数があるため記事に書き込んでも動きません。実装可能な場所は後ほど説明します。


<!-- 記事編集用リンク -->
<script language="JavaScript">
<!--
ebURL = '<a href="http://blog.seesaa.jp/pages/my/blog/article/edit/input?id=';
pgURL = "<% article.page_url %>";
bzTgt = '" target=_blank>編集</a>';
edLink = ebURL + pgURL.substring(33,34) + bzTgt;
document.write( edLink,"<br>" );
//-->
</script>


↓↓↓動作不都合のため修正(2006/02/25)↓↓↓

<!-- 【修正版】記事編集用リンク -->
<script language="JavaScript">
<!--
ebURL = '<a href="http://blog.seesaa.jp/pages/my/blog/article/edit/input?id=';
pgURL = "<% article.page_url %>";
pUlen = pgURL.length;
xNSt = pgURL.search( /article/i ) + 8;
xNEn = pgURL.search( /html/i ) -1 ;
bzTgt = '" target=_blank>編集</a>';
edLink = ebURL + pgURL.substring(xNSt,xNEn) + bzTgt;
document.write( edLink,"<br>" );
//-->
</script>


※当記事内同一コードを読み替えてご覧下さい(^^ゞ
(2006/02/25)



・・・ということで、又してもJavaScriptで実現してます。
※ってゆーか、こうしないと出来なかった・・・(~_~;)・・・のです。

シーサーブログでは編集用URL用の変数や関数を公表していないので、無い頭を一捻りすることになります。また、このリンクを使用するには事前にシーサーブログの管理画面へサインインしている必要があるようです。
※他のブログならログイン画面が出るんですが、シーサーはエラーを返すんです。(T_T)

※質問などあれば、コメント欄へ書き込んでください。できるだけお答えします。


さてこのコード、何処にいれましょうか?

1.まずシーサーブログにサインインして目的のブログ(複数ある場合)の【デザイン】→【コンテンツ】→【記事(ページコンテン...】→さらに、右上の【コンテンツHTMLの編集】と移動します。

2.僕のこのブログを例にすれば、コンテンツHTMLのテンプレートの中間あたりに次のようなコードがある訳です。

</div>

</div>

</div>
<% /loop -%>


多分</div>が3つと<% /loop -%>があるのは、テンプレート共通と思うのですが例外があるかもしれません。その場合<% /loop -%>を探してください。

3.その上に次のような記述(コード)があると思います。
※解かり易く修正してます。また、テンプレートによって若干記述が異なります。

<% if:article.accept_comment -%>
| <a href="<% article.page_url %>#comment">Comment(<% article.children_count | __or__ | echo('0') %>)</a>
<% /if -%>
<% if:article.accept_tb %>
| <a href="<% article.page_url %>#trackback">TrackBack(<% article.tb_count | __or__ | echo('0') %>)</a>
<% /if -%>
<!--
<% if:style.disp_category %>| <a href="<% article_category.page_url %>"><% article_category.name %></a><% /if %>
-->

</div>

</div>

</div>
<% /loop -%>


これは、個別記事最下部に表示される”| Comment(0) | TrackBack(0) "を表示する部分です。

…っと言うことは、このコードの直前に「一発編集用リンク」のJavaScriptコードを組み込めばよいことになりますね。

4.具体的な例として・・・...

〜 中略 〜

<div class="posted">posted by <% article.nickname %> at <% article.createstamp | date_format("%H:%M") -%>
<% if:article_weather -%>
| <% article_weather.state %> <% article_weather.weather_emoji -%>
<% /if -%>
<% if:diet_log -%>
| <% if:diet_log.condition == -2 %>絶不調<img src="<% site_info.blog_url %>/img/icon/5.gif" width="16" height="17" border="0" alt="絶不調" /><% /if -%>
<% if:diet_log.condition == -1 %>不調<img src="<% site_info.blog_url %>/img/icon/4.gif" width="16" height="17" border="0" alt="不調" /><% /if -%>
<% if:diet_log.condition == 0 %>普通<img src="<% site_info.blog_url %>/img/icon/3.gif" width="16" height="17" border="0" alt="普通" /><% /if -%>
<% if:diet_log.condition == 1 %>好調<img src="<% site_info.blog_url %>/img/icon/2.gif" width="16" height="17" border="0" alt="好調" /><% /if -%>
<% if:diet_log.condition == 2 %>絶好調<img src="<% site_info.blog_url %>/img/icon/1.gif" width="16" height="17" border="0" alt="絶好調" /><% /if -%>
<% /if -%>

<!-- 記事編集用リンク -->

<script language="JavaScript"> 
<!--
ebURL = '<a href="http://blog.seesaa.jp/pages/my/blog/article/edit/input?id=';
pgURL = "<% article.page_url %>";
bzTgt = '" target=_blank>編集</a>';
edLink = ebURL + pgURL.substring(33,40) + bzTgt;
document.write( edLink," " );
//-->
</script>
<!-- 記事編集用リンク終了 -->

<% if:article.accept_comment -%>
| <a href="<% article.page_url %>#comment">Comment(<% article.children_count | __or__ | echo('0') %>)</a>
<% /if -%>
<% if:article.accept_tb %>
| <a href="<% article.page_url %>#trackback">TrackBack(<% article.tb_count | __or__ | echo('0') %>)</a>
<% /if -%>
<!--
<% if:style.disp_category %>| <a href="<% article_category.page_url %>"><% article_category.name %></a><% /if %>
-->

</div>

</div>

</div>
<% /loop -%>

〜 以下省略 〜


・・・てな感じになります。

これを保存してサイト全体を再構築して表示させると次のような表示になるはずなのですが・・・

posted by seoblog at 15:56 | 編集 | Comment(0) | TrackBack(0)

 

・・・上手く表示されたでしょうか?
※サンプルのコードに”絶不調”・・・”絶好調”などとあります。SeesaaBLOGの「ダイエット」とか「お天気」などオプションで使われるものですね。
それからこのブログではカテゴリ表示を記事タイトル下に移動してます。該当コードがコメントアウトされてるのでご了承ください。



この修正リンクの留意点(または注意事項)

■使用上の留意点

すでに前述したようにサインインした状態でないとエラーを返されます。
なので、このリンクを確実に動作させるには次のようにします。

1.シーサーブログの管理画面にサインインする。
2.ブログの管理画面から【サイトの確認】でブログを開く。
※この手順ではシーサーブログ側でエラーを返さないことを確認しています。本当はログイン画面を出してくれると最高なんですが、何かと融通利かないSeesaaBLOGなのでした。 (^。^)ちゃんちゃん


■それでもエラーが返る場合のチェック項目

上記の手順で編集リンク使用してもエラーを返す場合、JavaScrptに与えているパラメータを見直す必要があります。でも、その前にどのような誤りが存在するか確認する必要があります。

1.【編集】リンクが吐き出すURLをチェックします。
  併せて提示したJavaScriptの動き方について理解しておきましょう
  まず、編集したい個別記事を開き表示されるURLを確認します。
  この個別ページを例にとれば、
  http://seoblo.seesaa.net/article/5893970.html
  …といったURLですが”5893970”の部分が重要となります。

2.編集ページで共通するベースURLが、
  http://blog.seesaa.jp/pages/my/blog/article/edit/input?id=
  …であることを無条件で覚えてください。

3.上記1.と2.をJavaScriptで組み合わせ、
  http://blog.seesaa.jp/pages/my/blog/article/edit/input?id=5893970
  という個別ページの編集用URLを作ってるわけですが…

4.一字一句の誤りがあってもエラーが返ります… (T_T)
  確認するには【編集】リンクにポイントし表示されるURLを確認します。
  特に出やすいと思われるのが、次のようなURLの誤りです。
  http://blog.seesaa.jp/pages/my/blog/article/edit/input?id=/589397
  http://blog.seesaa.jp/pages/my/blog/article/edit/input?id=893970.
  http://blog.〜中略〜/input?id=******* の *******部分がずれてますね。

5.この場合JavaScriptの次の部分を修正します。
  edLink = ebURL + pgURL.substring(33,40) + bzTgt;
  前にずれているなら 34,41 に変更します。
  後ろにずれるなら 32,39 へ変更すると修正できます。
  修正できたら、保存→サイトの再構築をして、4.の手順で再確認します。



--------------------------------------------------


後記:

・おやおや、右サイドバー落っこっちゃいました…(^_^;)

原因確認→<blockquote>で囲んだアルファベット羅列の折り返しが上手くいかないため。<blockquote>の使用を撤廃し style="margin-left: 40" などと段落単位で直接指定したら回避しました。

・回避しました。

※まあった〜長がぁ〜くなったですが、シーサーブログカスタマイズの投稿が一段落したら記事分割して見易くしたいと思います。その際は関連書籍の紹介もしたいですねぇ〜 (^。^)


posted by seoblog | | Comment(1) | TrackBack(1)
この記事へのコメント
久しぶりに来て見たらパムの温床…
…対策中…
Posted by 管理人 at 2006年02月25日 11:23
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

この記事へのTrackBack URL
http://blog.seesaa.jp/tb/5893970

記事ごとに編集画面へのリンクを貼る(seesaa)※毎回サインイン画面を出さないver
Excerpt: 投稿した後に、その記事を修正しようとした場合、 いちいち、seesaaブログにサインインして、 記事一覧から該当記事を探して修正するのは面倒です。 そこで、定番!記事ごとに編集画面へのリンクを貼って..
Weblog: ん~?( ̄~ ̄;)
Tracked: 2005-11-15 17:32
×

この広告は1年以上新しい記事の投稿がないブログに表示されております。