2005年01月04日 21:16
記事から直接編集画面へ
いまさらながら地獄変OOさんのlivedoor Blogにお手軽編集機能〜HTMLいじり版を実装しました。去年の７月の記事だというのに。
つけてみるとかなり便利だ。
トップページと個別ページとカテゴリーページにつけた。それぞれの記事の「Posted by〜」のいちばんうしろに「Edit」とあるもの。自分だけそこから直接編集画面に行ける。
HTML編集で
<a href="http://blog.livedoor.com/cms/article/edit?id=<$ArticleId$>">Edit</a>
を入れるだけなのですごく簡単なのだが、どこに入れるかで２，３回試行錯誤してしまったのでメモしておきます。
つけてみるとかなり便利だ。
トップページと個別ページとカテゴリーページにつけた。それぞれの記事の「Posted by〜」のいちばんうしろに「Edit」とあるもの。自分だけそこから直接編集画面に行ける。
HTML編集で
<a href="http://blog.livedoor.com/cms/article/edit?id=<$ArticleId$>">Edit</a>
を入れるだけなのですごく簡単なのだが、どこに入れるかで２，３回試行錯誤してしまったのでメモしておきます。
それぞれ色つきの部分が挿入したところです。
トップページの場合
Loop End の少し前あたりから抜粋。
個別記事の場合
「このBlogのトップへ」の少し前あたりから抜粋。
カテゴリー別の場合
「このページの上へ▲」の少し前あたりから抜粋。
なぜいまさらなのかというと、いままであまり必要なかったからですが最近Blogを始めて１年たったこともあって、１年も前の記事（宝くじのとか年末の番組のとか）にアクセスが来るようになったため、その記事を編集する必要が出てきて、いちいちめんどうだと思ったからです。
使ってみるとかなり便利です。
トップページの場合
Loop End の少し前あたりから抜粋。
<IfArticleCategory>│<a class="aposted" href="<$ArticleCategoryUrl$>"><$ArticleCategory ESCAPE$></a></IfArticleCategory>│<a class="aposted" href="http://blog.livedoor.com/cms/article/edit?id=<$ArticleId$>">Edit</a></div></div>「Edit」の前に区切りの「│」を入れることと、リンクのタグ内に class="aposted" を入れることによって「Posted by〜」と同じ見かけにします。これは以下も同じです。
</IndexArticlesLoop>
<!-- Loop End -->
個別記事の場合
「このBlogのトップへ」の少し前あたりから抜粋。
<a class="aposted" href="#trackback">TrackBack(<$ArticlePingCount$>)</a></IfArticleAllowPing>│
<a class="aposted" href="http://blog.livedoor.com/cms/article/edit?id=<$ArticleId$>">Edit</a>
<div class="menu"><a class="amenu" href="<$BlogUrl$>">このBlogのトップへ</a><IfPrevArticle>
カテゴリー別の場合
「このページの上へ▲」の少し前あたりから抜粋。
<a class="aposted" href="<$ArticlePermalink$>#trackback">TrackBack(<$ArticlePingCount$>)</a></IfArticleAllowPing>│
<a class="aposted" href="http://blog.livedoor.com/cms/article/edit?id=<$ArticleId$>">Edit</a></div></div>
</CategorizedArticlesLoop>
<div class="pagetop"><a class="aposted" href="#top">このページの上へ▲</a></div>
</div>
なぜいまさらなのかというと、いままであまり必要なかったからですが最近Blogを始めて１年たったこともあって、１年も前の記事（宝くじのとか年末の番組のとか）にアクセスが来るようになったため、その記事を編集する必要が出てきて、いちいちめんどうだと思ったからです。
使ってみるとかなり便利です。
トラックバックURL
トラックバック一覧
1. 便利♪便利♪ [ * Arcobaleno Blog * ] 2005年01月14日 12:22
『小春日和の陽射しの中で』さんにお世話になりました。
どうもありがとうございました。
2. 記事から編集画面へ [ おこづかいのタネ ] 2005年01月22日 15:52
記事から編集画面へ直接行けるようにしました。
小春日和の陽射しの中でさんで紹介されています。
説明がとても分かりやすいです。
junikeさん、ありがとうございました。
この機能すごく便利です。
例えば、この記事の内容を変更したいとします。
「Posted by〜」の
3. エントリーからの直接編集 [ mono-Log ] 2005年01月26日 00:34
「おこずかいのタネ」さんを覗いたところ、「 記事から編集画面へ」のエントリーがあり、これいいなぁ、と思いここのBlogも変更させて頂きました。元ネタは「小春日和の陽射しの中で」さんです。
しかし、ちょっと、そこで苦労してしまったので補足。
そもそも「HTMLテンプ
4. 便利機能２つ追加しました [ ☆★☆ I love LIFE ☆★☆ ] 2005年01月28日 15:14
2つほど、Blogの機能を追加してみました。
１つはそれぞれの記事から直接編集画面にいける「Edit」機能
どんな使い方かというと
一度UPされた記事の手直しをするときに、わざわざブログサーバーにログインして
「投稿したBlogの編集をする」からその記事を探して編集…
5. ちょっとだけ [ グウタラビヨリ ] 2005年02月16日 22:43
変えました。
デザインではありませぬ。機能の方です。
記事から直接編集画面へ飛べるってやつです。
記事の最後のposted by〜の最後にeditをくっつけるとそこから自分だけが編集画面へ飛べる。
結構便利だと思います。トラバ返しする時とか。
『小春日和の陽射しの中
6. 細かくちょっと変えてみる [ ゆっくり、ちゃんと。 ] 2005年02月17日 00:25
デザインではなくて、細かい機能を何箇所か。
まずまた「小春日和の陽射しの中で」さんから、記事から直接編集画面へいけるっていうの。結構便利そうな感じ。
あとはトラバのURLをワンクリックで選択可能になるってのを「パンパでガウチョ」さんから。これも前から
7. コラムの開閉＆Edit [ ゴチソウサマデシタ♪ ] 2005年02月17日 14:35
今回リニュしてこちらのBlogが大変参考になりました。ありがとうございました。
8. パン屑リスト・直接編集画面・検索機能の追加 [ ブログでコツコツ儲けよう ] 2005年03月13日 19:41
前回のブログ３カラム化に続いて、今回もブログのカスタマイズに挑戦してみました！
今回の追加機能は
・渡る世間は○○ダ！！様を参考にさせていただいたパン屑リストの追加
・前回の３カラム化でもお世話になった小春日和の陽射しの中で様を参.
9. 各エントリーから直接編集画面に飛ぶ [ スポーツトレーナー始末記 〜養生指南・最上晴朗〜 ] 2005年03月14日 01:10
今週（明日から）は仕事が立て込んでて、
シーズンも大詰めで札幌に行かなきゃならなかったり、かなり忙しくなるので、
今日の内にblogの修正をある程度済ませてしまおう、
という事で、仕事以上の集中力で夜から始めて深夜まで作業中。
まずは地獄変00さんのと.
10. 記事の直接編集 [ スノーボードにハマれ！？ヽ（゜▽、゜）ノ ] 2005年03月16日 00:12
記事を見やすいようにと、
目次を作成し、とんでいった先の記事を小目次にして個別の記事へ。
そういう構造を造っていったんですが、この小目次は後々追加や修正が必要になる。
けれども、その記事自体は古くなっていって、ブログの管理画面の中から掘り当てるのは煩わ.
11. プチ改造 [ 1yard ] 2005年05月07日 01:44
今日はめずらしく（？）夜半を過ぎる前に自宅に戻ってまいりましたので、blogの改造をちょこっとだけ。
このblogを始めて、もう半年以上になり、記事投稿の件数も250件を超えました。
まあ、世の有名ブロガーの皆様からすると、「そんなのまだまだだぞよ」とか云われそう
12. 無知な私がやってみた！「ブログカスタマイズ２種」！ [ 五感てきブログ +Happy Life+ ] 2005年05月31日 22:33
タグとか全然詳しくない上に、記事が増えてきて全構築にめちゃ時間もかかるし･･･色んな意味で「カスタマイズ」とかそういうのって本当に苦手なんですが、今夜は２種類のカスタマイズに挑戦してみました！
『記事から直接その記事の編集画面へ行く』
『個別記事に前と.
13. ブログ改造 [ スーペル・ゾーン ] 2005年06月16日 19:33
またまたブログを少し変えてみたので、
もし不具合があれば教えてください。
macだとデザインが崩れるかも…。
目に見えて変わったところはほとんどないのですが、
前からの懸念事項だった「スクロールの遅さ」を解消させました。
ためしにカテゴリー別記事や月別記事
14. 記事から直接編集画面へ [ きっきんの戦略人生論 ] 2005年07月19日 01:58
久々にBlogを改造しました。自分はよく失敗するのですが、今回はうまくできました。記事の下に「Edit」機能を追加して、直接編集画面に飛べるようになりました！！（もちろん本人だけしか飛べないはずです、、）『小春日和の陽射しの中で』さんのこの記事を参考にしました。.
コメント一覧
1. Posted by snail 2005年01月05日 11:27
初めまして。
１２月３０日のブログを参考に３Ｄカラムに
挑戦してみたのですが、現在のブログのよう
に右側に移動しないまま全体がずれている状
況になってしまいました。問題どのようなこ
とが考えられるでしょうか？よろしければ教
えて下さい。
１２月３０日のブログを参考に３Ｄカラムに
挑戦してみたのですが、現在のブログのよう
に右側に移動しないまま全体がずれている状
況になってしまいました。問題どのようなこ
とが考えられるでしょうか？よろしければ教
えて下さい。
2. Posted by junike 2005年01月05日 15:38
>snailさん
「右側に移動しない」となるとjsファイルがプラグインとして右サイドバーと左サイドバーの間に入っていないか、ファイル形式が違うか、が考えられます。
「全体がずれる」というのがどのようなものか、現在の貴ブログが元に戻されているようなのでわからないですが、たとえば全体の幅が固定の場合、content、links、links2それぞれのwidthとmarginとpaddingをあわせたものがcountainerのwidthより大きいとずれる可能性はあります。数値は合うようにしてみてください。
それ以外は、ずれている状態のままのものを見てみないとわかりません。
「右側に移動しない」となるとjsファイルがプラグインとして右サイドバーと左サイドバーの間に入っていないか、ファイル形式が違うか、が考えられます。
「全体がずれる」というのがどのようなものか、現在の貴ブログが元に戻されているようなのでわからないですが、たとえば全体の幅が固定の場合、content、links、links2それぞれのwidthとmarginとpaddingをあわせたものがcountainerのwidthより大きいとずれる可能性はあります。数値は合うようにしてみてください。
それ以外は、ずれている状態のままのものを見てみないとわかりません。
3. Posted by snail 2005年01月05日 16:32
ありがとうございます。
全体がずれるというのはちょっと勘違
いでした。背景との関係でずれたよう
に見えていたようです。もう１度挑戦
してみます。
全体がずれるというのはちょっと勘違
いでした。背景との関係でずれたよう
に見えていたようです。もう１度挑戦
してみます。
4. Posted by snail 2005年01月05日 17:30
やっぱりダメでした。
右に移動するどころか左側に
無限ループ？のように繰り返し
表示され続けます。
右に移動するどころか左側に
無限ループ？のように繰り返し
表示され続けます。
5. Posted by snail 2005年01月05日 17:47
もし時間がありましたら、こちらにアップしている
のでチェックしてもらえると助かります。
http://blog.livedoor.jp/quicksnail/sample.txt
のでチェックしてもらえると助かります。
http://blog.livedoor.jp/quicksnail/sample.txt
6. Posted by junike 2005年01月05日 18:50
>snailさん
そのsample.txtのCSS自体は３カラム化にあたっては問題ありませんでした（それを使って３カラムにはできました：ここではない実験用IDのブログで試す）。
無限ループっぽいというのはやはりjsファイルがあやしいですね。
たとえば「3column.js」としたつもりが「3column.js.txt」とかになってませんか？エクスプローラでファイルの拡張子を非表示にしていると時々こうなって、それをアップしておかしいというケースがありました。
あるいは、アップしたあとのファイル名が元のファイル名ではなくなっているのに、javascriptプラグインでURL指定をするときの最後のところのファイル名が「3column.js」のままになっているとか（ファイルをアップすると無秩序なファイル名に変換されてしまいます）。
それからCSSファイルですが、そのままですと真ん中のカラムの幅が狭くて窮屈な感じになります。
それぞれ以下のように置き換えるとちょうどいいのではないでしょうか（下の部分以外のところはそのままで）。
#container{
position:relative;
width:780px;
margin:0 auto 0 auto;
text-align:left;
}
#content{
position:relative;
margin-top: 0px;
margin-right:160px;
margin-bottom: 0px;
margin-left: 180px;
line-height: 140%;
padding: 0px 20px 50px 20px;
}
#links{
position:absolute;
left:10px;
top:90px;
width:200px;
padding:0;
}
#links2{
position: absolute;
width:200px;
top:90px;
right: 10px;
margin: 0;
padding:0 0 10px;
}
そのsample.txtのCSS自体は３カラム化にあたっては問題ありませんでした（それを使って３カラムにはできました：ここではない実験用IDのブログで試す）。
無限ループっぽいというのはやはりjsファイルがあやしいですね。
たとえば「3column.js」としたつもりが「3column.js.txt」とかになってませんか？エクスプローラでファイルの拡張子を非表示にしていると時々こうなって、それをアップしておかしいというケースがありました。
あるいは、アップしたあとのファイル名が元のファイル名ではなくなっているのに、javascriptプラグインでURL指定をするときの最後のところのファイル名が「3column.js」のままになっているとか（ファイルをアップすると無秩序なファイル名に変換されてしまいます）。
それからCSSファイルですが、そのままですと真ん中のカラムの幅が狭くて窮屈な感じになります。
それぞれ以下のように置き換えるとちょうどいいのではないでしょうか（下の部分以外のところはそのままで）。
#container{
position:relative;
width:780px;
margin:0 auto 0 auto;
text-align:left;
}
#content{
position:relative;
margin-top: 0px;
margin-right:160px;
margin-bottom: 0px;
margin-left: 180px;
line-height: 140%;
padding: 0px 20px 50px 20px;
}
#links{
position:absolute;
left:10px;
top:90px;
width:200px;
padding:0;
}
#links2{
position: absolute;
width:200px;
top:90px;
right: 10px;
margin: 0;
padding:0 0 10px;
}
7. Posted by snail 2005年01月05日 21:37
どうもわざわざありがとうござい
ました。もう１度やってみようと
思います。
ました。もう１度やってみようと
思います。
8. Posted by snail 2005年01月05日 22:03
３カラムできました！
ご指摘の通りｊｓのＵＲＬを間違えて
いたようです。本当にありがとう
ございました！
ご指摘の通りｊｓのＵＲＬを間違えて
いたようです。本当にありがとう
ございました！
9. Posted by junike 2005年01月05日 22:56
>snailさん
いま確認しました。
できてよかったです。
あとで３カラムにする手順の方にも注意書きを追加しておこうと思います。
いま確認しました。
できてよかったです。
あとで３カラムにする手順の方にも注意書きを追加しておこうと思います。
10. Posted by はな 2005年01月22日 16:02
はじめまして。
この機能、非常に便利ですね。
説明もとても分かりやすくて、簡単に出来ました。
本当にありがとうございました。
この機能、非常に便利ですね。
説明もとても分かりやすくて、簡単に出来ました。
本当にありがとうございました。
11. Posted by べっきー 2005年02月26日 11:33
参考記事と共に確認しながら、無事Edit機能を実装することができました。
具体的な場所を示されていただいていたので、簡単にわかりました。どうもありがとうございます!!
具体的な場所を示されていただいていたので、簡単にわかりました。どうもありがとうございます!!
12. Posted by 兄貴 2005年02月28日 01:52
分かりやすい説明で１回で変える事が出来ました！
「他人がEdit押したらどうなるんだろ〜」と疑問に思い、
小春日和さんのEdit押してみてしまいました(^^;A
「こう表示されるのか」と納得しましたが、
皆さんは真似しないでくださいね（汗）
失礼しました・・・
「他人がEdit押したらどうなるんだろ〜」と疑問に思い、
小春日和さんのEdit押してみてしまいました(^^;A
「こう表示されるのか」と納得しましたが、
皆さんは真似しないでくださいね（汗）
失礼しました・・・
13. Posted by zou 2005年12月15日 15:11
はじめまして☆zouと申します
こんな機能あったらいいのに〜っと前から思ってたのが、
実は、あったなんて…
すごくうれしくて、早速使わせてもらいました。
説明も分かりやすくて、
本当にありがとうございました！
こんな機能あったらいいのに〜っと前から思ってたのが、
実は、あったなんて…
すごくうれしくて、早速使わせてもらいました。
説明も分かりやすくて、
本当にありがとうございました！
14. Posted by junike 2005年12月15日 22:11
zouさんはじめ皆様方、コメントありがとうございます。
ネタ元は記事中にもあるように別の方ですが、お役に立てたようでよかったです。
僕もしょっちゅうこの機能は使っていますので大変重宝しています。
ネタ元は記事中にもあるように別の方ですが、お役に立てたようでよかったです。
僕もしょっちゅうこの機能は使っていますので大変重宝しています。
