2009年2月アーカイブ

新しくCSSを書き始める時はDreamweverの入力補完に勝るものはないけど、ちょっと修正するときに立ち上げるには、adobe系の起動時間は長い。長すぎる。

しかも、「そのあたり」を探すのに、まずHTMLソースでタグのIDやクラス名を確認して、CSSを開いて検索する行為が面倒。
も少しラクな方法はなかろうか。

と考えていたら、sakuraエディタで「アウトライン解析」なる機能を発見。
(半角英数字に変換しようとF10を押したつもりが、F11を押したらしく、偶然出てきました。ただのテキストエディタじゃないのね。人生ってすばらしい。)

原稿を書くときにアウトラインプロセッサの機能って便利だけど、これをCSSに応用してみようではないか!

まず、自分はCSSを書くときに各ブロックごとに見出しを以下のようにつけているので、その前提です。

/*-------------------------------------------------
  ++LAYOUT
-------------------------------------------------*/

テキストファイルに以下を記入して

++ /// LV0
# /// LV1
. /// LV1

ファイル名を css.pl とかなんとかで保存
(sakuraエディタが保存されているあたりへ 「C:\Users\○○○\AppData\Roaming\sakura」)

sakuraエディタを開き、メニューの「設定」→「タイプ別設定一覧」を開く。
未設定の定義を選び(通常なら「設定17」とか)、「設定変更」を選ぶと、タイプ別設定画面が開くので、

設定の名前:CSS
ファイル拡張子:css

と入力し、右側の真ん中にある「アウトライン解析方法」の「ルールファイル」にチェックして、先ほど保存した「css.pl」を読み込む。

そうすると、cssの拡張子のあるファイルはこの定義が適用されます。
CSSファイルを開いて、F11(またはステータスバーにある「アウトライン解析」)を押すと↓こんな感じでメニューみたいにツリー状で現れます。

WS000005.JPG

「++」を親としてid「#」やclass「.」を折りたたんでます。

MTで、サイドバーだけ編集したい時は、「++WIDGET」を開いてダブルクリックすると、その行に飛ぶので、ほんのちょっと作業がラクに。
時間があったらこれに入力補完のルールを適用してもよいけど、基本はDWで記述していくので、今のところは必要ないかも。

タグ指定を追加したものを作ってみた。
よかったらどうぞ。→

css.txt

ないもの、あります (ちくま文庫)

堪忍袋の緒、左うちわ、一本槍、語り草、転ばぬ先の杖、目から落ちたうろこ、おかんむり、他人のふんどし...どうやらあるらしいけど、みたことのないもの。

クラフト・エヴィング商会はそんな商品を扱っているらしい。
naimono.jpg
ほとんど自分の中にあったりするのね。身近にも。
そんなグッズをイラスト入りで紹介。
思わずクスッとしたりうなずいてみたり、さりげなく諭されたり。

このブログはMTOSを使ってますが、MTのデフォルトにはMETAタグが記述されていません。
それくらい自分で工夫しろよ♪と試されている感じもしますが、ここはWEB制作者の端くれとして見てみないフリをするワケにはいきませんね。

プラグイン等はいりません。
「デザイン」⇒「テンプレート」⇒「モジュールテンプレート一覧」の「ヘッダー」モジュールのタイトルタグ(<title><$mt:var name="title"$></title>)の下あたりに以下を記述してみました。

<MTIf name="main_index">
<meta name="description" content="<$MTBlogDescription$>" />
<meta name="keywords" content="全体的なキーワードをいくつか" />
</MTIf>
<MTIf name="entry_template">
<MTIfNonEmpty tag="MTEntryTags">
<meta name="keywords" content="<MTEntryTags glue=","><$MTTagName$></MTEntryTags>,<$MTEntryCategory$>,<$MTEntryKeywords$>" />
</MTIfNonEmpty>
<meta name="description" content="<$MTEntryBody words="100"$>" />
</MTIf>

メインページ(main_index)ではブログの全体的な説明用語と、<$MTBlogDescription$> でブログの説明文を出力。
個別記事(entry_template)では、個別記事に付いたタグ(「,」で区切る)「,」カテゴリ名「,」キーワードの順に出力し、記事の冒頭100文字を「description」として出力します。

この記事でいうと、
タグ:MovableType
カテゴリ:制作メモ
キーワード:MovableTypeカスタマイズへの道,MTOS,MT,
なので、METAタグは
<meta name="keywords" content="MovableType,制作メモ,MovableTypeカスタマイズへの道,MTOS,MT" />
となっているハズ。

最近ハヤリのレコメンドエンジンとまでは言わないけど、読んでいる記事と関連する記事が、いい感じで表示されて、ウロウロできる。

そんな機能が欲しい時にはこのプラグイン。
RelatedEntries
これは、記事ごとに入れた「タグ」の最新記事を表示するものなので、投稿の際に「タグ」付けしていないと意味はないですが...。

まず、RelatedEntries_1_20.zip をダウンロードしたら、プラグインディレクトリに放り込む。
あとは個別記事の、記事が表示される下に関連記事表示用の記述をします。

MTOS4.12でいうところの、「デザイン」⇒「テンプレート」⇒「モジュールテンプレート一覧」の「ブログ記事の詳細」モジュールに以下を記述。

<div id="related-items" class="related-items">
<h2 class="related-items-header">関連記事</h2>
<MTRelatedEntries>
<ul>
<MTEntries lastn="7">
<li><a href="<MTEntryLink>"><MTEntryTitle></a></li>
</MTEntries>
</ul>
</MTRelatedEntries>
</div>

※基本は赤い部分だけでよいみたいです。
ナイス!

↓↓↓↓見えてる??

過去に書いた記事を複製して編集&投稿することができるMovableTypeのプラグイン。
Duplicate

通常のブログ記事ではあまり必要ないかもしれないけど、ECサイトとか定期的に同じ記事を投稿するニュースリリースで使う場合や、カテゴリやタグ、キーワードがシリーズ化(?)された記事を書くときは便利かもしれない。
商用はご相談だけど。

インストールは「Duplicate」をダウンロードしてプラグインディレクトリにアップするだけで、「一覧」⇒「ブログ記事」を見ると「複製」って出てくる。

出力ファイル名は、「-1」のように付けてくれるけど、日付はその都度変更が必要。

ただ、上記サイトのコメント欄で指摘されているように、
 ・記事一覧画面から「再構築」「削除」ボタンがなくなる
 ・一括編集ができなくなる
ってのが引っかかるけど、割合でいうと複製のほうが頻繁なので、問題なし。
一括編集する場合は「システムメニュー」⇒「プラグイン」の一覧で「Duplicate」を一旦無効にしてから作業するとOKのようです。

惜しいけどステキなプラグインです。アリガトウ!

MovableTypeは吐き出されるページが静的なHTMLで、サーバー上に物理的にHTMLファイルが存在するところがお気に入りだけど、「次の○件」とか、通常のブログとして利用する場合あって当然のページ分割の機能は、PHPにしないとダメだった。

が、いまや静的ページでも分割が可能なんですね。
静的ページ用ページ分割プラグイン:PageBute

ということで、遅ればせながら入れてみた。
上記サイトからPageButeをダウンロードして、PageBute.pl をMovable Typeの「plugins」ディレクトリにアップロード。

まず、メインページを分割します。
トップページに10件表示して、過去の分もそのまま10件ずつ遷移できるようにします。
デザイン⇒テンプレート⇒(インデックステンプレート)メインページ
の、
<MTEntries>
<$MTEntryTrackbackData$>
<$MTInclude module="ブログ記事の概要"$>
</MTEntries>

となっているところを以下に変更。
赤い部分が追加するソースです。

<MTIfPageBefore><span><$MTPageBefore delim="前の10件"$></span></MTIfPageBefore>
<$MTPageLists$>
<MTIfPageNext><span><$MTPageNext delim="次の10件"$></span></MTIfPageNext>


<MTPageContents count="10">
<MTEntries lastn="50">
<$MTEntryTrackbackData$>
<$MTInclude module="ブログ記事の概要"$>
<$MTPageSeparator$>
</MTEntries>
</MTPageContents>

<MTIfPageBefore><span><$MTPageBefore delim="前の10件"$></span></MTIfPageBefore>
<$MTPageLists$>
<MTIfPageNext><span><$MTPageNext delim="次の10件"$></span></MTIfPageNext>

これで上下にページのナビゲーションが追加されました!
PageBute.jpg
<MTPageContents count="10">
<MTEntries lastn="50">
は、最大50件の記事を10件ずつ遷移するということです。
MTはトップページのデフォルトの表示件数は5件なので、
lastnで最大件数を指定した上で[ count="10"] 等と指定しないと、ページ遷移しません。
 
おなじく、カテゴリや月別アーカイブのページを分割するには、
デザイン⇒テンプレート⇒アーカイブテンプレート一覧⇒ブログ記事リスト
<MTIf name="datebased_archive">
<MTEntries>
<$MTEntryTrackbackData$>
<$MTInclude module="ブログ記事の概要"$>
</MTEntries>
<MTElse>
<MTEntries limit="auto">
<$MTEntryTrackbackData$>
<$MTInclude module="ブログ記事の概要"$>
</MTEntries>
</MTIf>
を以下に変更します。
<MTIfPageBefore><span><$MTPageBefore delim="前の10件"$></span></MTIfPageBefore>
<$MTPageLists$>
<MTIfPageNext><span><$MTPageNext delim="次の10件"$></span></MTIfPageNext>


<MTIf name="datebased_archive">
<MTPageContents count="10">
<MTEntries>
<$MTEntryTrackbackData$>
<$MTInclude module="ブログ記事の概要"$>
<$MTPageSeparator$>
</MTEntries>
</MTPageContents>
<MTElse>
<MTPageContents count="10">
<MTEntries>
<$MTEntryTrackbackData$>
<$MTInclude module="ブログ記事の概要"$>
<$MTPageSeparator$>
</MTEntries>
</MTPageContents>
</MTIf>

<MTIfPageBefore><span><$MTPageBefore delim="前の10件"$></span></MTIfPageBefore>
<$MTPageLists$>
<MTIfPageNext><span><$MTPageNext delim="次の10件"$></span></MTIfPageNext>


ブログ記事リストの場合はそのアーカイブに属する記事はすべて表示されるので、lastnは必要ないらしい。
メデタシ。

デスク周りに物理的にポストイットを貼ったりするのが嫌い。
スティッキーズとかを常に立ち上げているのもいや。
だって、整理できないんだもの。

そこで。EverNote。分かってる分かってる。そりゃもう便利なんだよね。
脳をバックアップしてくれるツール『EverNote』〜WIRED VISION
Evernoteの基本的な使い方【チュートリアル編】〜ITmedia
Evernoteのタグとノートブックを使いこなす【チュートリアル編】〜ITmedia
Evernoteで自分の脳を拡張する(プライベートベータご招待)〜TechCrunch
Evernote for iPhone は「いつでも」「何でも」メモできるツール〜Lifehacking

Windowsで、Macで、持ってないけどiPhoneで使えて常に同期されているなんてそりゃスバラシイ。使い方も簡単だしね。

EverNote

evernote.gif

あっという間に記事が溜るけど、Webサービスと違って検索が速いし、予め必要な部分だけ保存してるから無駄がない。ただ、検索結果がちょっとアヤシイってことを除けば。さらに、MacとWindows、WEB上ではインターフェイスや挙動が違うので戸惑い気味。

なんとかならんものか。

2010年8月

1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31        
テクノラティプロフィール

[PR]