Extended Live Archive 表示設定(Options編)

2007/9/6 木曜日

Extended Live Archiveに関しては、
Extended Live Archive 高機能アーカイブ導入編を参照
Extended Live Archive Optionsのポイント
ELA Optionsは、オプションのExt.Live Archiveからアクセス。
以下はああwordpressで主に変更した項目のメモ。
設定が完了したら、Update Options Nowをクリックして更新するのを忘れずに。
What to show ? 何を表示するか?
Show Newest First:ここにチェックを入れると新しい記事から表示します。
Show Number of Comments:チェックすると記事コメントの数を表示します。
Use the default CSS stylesheet: チェックするとデフォルトのスタイルシートでExtended Live Archiveを読み込みます。ここにチェックがなくて、ela.cssをExtended Live Archiveを表示しているページで読み込んでいるときela.cssのスタイルに従ったLive Archiveを表示します。後述予定。
How to show it ? どのように表示するか
Day of Posting Format:ここには、適切なPHP: date – Manualを参考に何か日付を表示する値を入れておくべき。Operaでは、なぜか日付からExtended Live Archiveを表示させると記事タイトル表示が崩れる問題があったが。ここに日付を記入することでこれを回避することが出来た。(原因不明)ああwordpressでは、jSを利用。
What to cut out ? 何を省略する?
タイトルが長すぎたり、タグが多すぎたりする場合はここを変更する。
What about the menus ? どんなメニューを表示するか
Tab Order:では Ultimate Tag Warrior [...]

Extended Live Archive用 ページテンプレート作成

2007/9/5 水曜日

Extended Live Archiveについては
Extended Live Archive 高機能アーカイブ導入編を参照
Live Archiveをarchives.phpをから表示させるにあたって
テーマにarchives.phpがあれば、なければpage.phpなどを参考にExtended Live Archive用テンプレートを作成する。間違ってarchive.phpを編集してしまわないように注意。元からあるファイルを編集する時には、バックアップを忘れずに。
Extended Live Archive用archives.phpに必要な最低限の項目
<?php get_header(); ?>
<?php af_ela_super_archive(); ?>
<?php get_footer(); ?>
Extended Live Archive用archives.phpを作成する。
元からあるarchives.phpを利用する場合は、そのファイルに書かれている。<?php wp_get_archives(’type=monthly’); ?>などのコンテンツを不要ならば削除し、かわりに<?php af_ela_super_archive(); ?>を表示させたい場所に組み込めばよい。
<div id=”content”>などをうまく残して<?php af_ela_super_archive(); ?>を入れてあげれば、それなりに整ったものになるかと思われる。使用しているテーマによって、どのように表示させるのがいいか、異なるだろうから 臨機応変に。
ちなみに、ああwordpressでは、archives.phpはこのテーマのpage.phpを参考にしている。
<?php af_ela_super_archive(); ?>を<div id=”content”></div>で囲み。その後に<?php get_sidebar(); ?>のようにサイドバーを読み込んで、Extended Live Archiveが記事と同様に表示されるようarchives.phpを作成した。1
archives.phpをつかってLive Archiveを表示する
まず、<?php af_ela_super_archive(); ?>を含めて作成したarchives.phpを使用中のテーマフォルダにアップロードする。
管理画面のページ作成を選び。任意のページタイトルを記入したら。右側のサイドバーからページテンプレートを選び、デフォルトテンプレートを今回作ったテンプレートに変更する。投稿内容は空欄で構わない。
最後に新しいページを作成ボタンを押して。終了。作成したページにアクセスすれば、Live Archiveが表示されているはずである。2
Extended Live Archiveは表示形式を変更することが出来ます
Extended Live Archive用の特別なCSSを持っていないテーマでは、ああwordpressのArchiveとは異なるLive Archiveが表示されているはず。おそらくはSons Of Skadi les archivesのようなデフォルト表示形式のLive Archiveと同じもの。
Extended Live Archiveでは、ヘッダーで他のExtended Live Archive用CSSを読み込むことで、Live Archiveの見た目を大きく変えることも可能です。その方法については後述予定。
ただしIEでtagsを開いた時は表示が崩れてしまう。この問題はIE6でもIE7でも同様に起きるようだ。W3C的な文法的ミスではないようだから放置の方向で。他のブラウザでは動くというのもある。原因と対処方法がわかればなんとかしたい。[back]このブログではこの方法でうまくいきました。[back]
Tags: archive, [...]

Ultimate Tag Warrior で関連記事を表示する

2007/8/30 木曜日

wordpressのプラグインには関連記事を表示させるためのpluginがいくつかあるけれども、軽いブログを目指すああwrodpressとしては、既に導入しているUltimate Tag Warriorのテンプレートタグを使って、関連記事を表示する。
Ultimate Tag Warriorについては、Ultimate Tag Warrior 3導入方法を参照。
Ultimate Tag Warriorでの関連記事表示方法
index.phpなど、テーマの関連記事を表示させたい場所に
<ul class=”utwrelposts”><?php UTW_ShowRelatedPostsForCurrentPost(“posthtmllist”) ?></ul>
などのコードを加え保存してアップロード。
見た目をコントロールしたい時は、テーマのスタイルシートに
.utwrelposts a {text-decoration:none}
.utwrelpostsセレクタを記入して自由に宣言の中身を変えてあげればよい。これで完了。
Ultimate Tag Warriorでの関連記事表示形式
Ultimate Tag Warrior関連記事表示形式のフォーマットは三種類ある。
リンクの色等は、cssで制御する。
postsimplelist
記事タイトルを羅列する。
<?php UTW_ShowRelatedPostsForCurrentPost(“postsimplelist”) ?>
posthtmllist
記事タイトルを改行したような形
<?php UTW_ShowRelatedPostsForCurrentPost(“posthtmllist”) ?>
postcommalist
記事タイトルをカンマで区切って表示
<?php UTW_ShowRelatedPostsForCurrentPost(“postcommalist”) ?>
関連記事を表示数をコントロールする
上に示したコードをそのまま書くと。その記事に関連する記事タイトルをすべて引っ張ってきてしまうようなので、関連記事の表示数を以下の方法で制限する。
<?php UTW_ShowRelatedPostsForCurrentPost(“posthtmllist”,”",”3″) ?>
以上のようにUTW_ShowRelatedPostsForCurrentPostの()の中身を編集する。現在3になっている値を任意の数字に変更す れば、その数だけ関連記事が表示されるようになる。上記Ultimate Tag Warriorでの関連記事表示形式でのサンプル表示は、この機能を使って関連記事表示数を3にしてあります。
関連記事の選ばれ方
ヘルプにどのようなアルゴリズムで関連記事が表示されるかの説明があるわけではないようなので、体感だけれども、各記事につけられたタグが一致する 数が多い記事から関連記事が選ばれ、共通タグ数が同じ場合は、より新しい記事を先に表示するという仕組みらしい。タグ付けを詳細に行っているとより適切な 関連記事が表示されるようになると予測されます。

Tags: css, plugin, tag, theme, wordpress

RSSへのリンクをtopへ戻るボタンに追随させる

2007/8/14 火曜日

移動式リンクのソース
移動するtopへ戻るボタンをcssで指定して設置に関連して、RSSfeedへのリンクボタンも同時に設置。トップへ戻るボタンの記事では、ソースを書いていなかったのでこちらの記事に書いておくことに。
cssソース
#to-header {
display:block;
position:fixed!important;
position:absolute;
left:3px;
bottom:25%;
}

#to-header a img {
border: 0;
}

footer.phpソース
<div id=”to-header”>
    <a href=”#header”><img title=”topへ戻る” alt=”topへ戻る” src=”表示させたいイメージのパス” /></a><br />
    <a href=”<?php bloginfo(‘rss2_url’); ?>”><img title=”<?php bloginfo(‘name’); ?>のRSS” alt=”<?php bloginfo(‘name’); ?>のrss” src=”表示させたいイメージのパス” /></a>
</div>
これでposition:fixed!important;に対応のブラウザ(Firefoxなど)なら適切に表示されるはず。IEでも、cssに設定した座標に表示されているはず。
<div id=”to-header”>と</div>の間に色々他のものを入れてあげれば使い勝手をよくすることが出来る。

Tags: css, Firefox, ie, rss, theme

移動するtopへ戻るボタンをcssで指定して設置

2007/8/14 火曜日

topへ戻るボタン導入方法
マウスにスクロール機能があるとはいえ縦に長いと大変なので。画面左側にtopへ戻るボタンをつけた。
css position:fixed;を利用して画面の半分よりしたあたりに画面スクロールにあわせてイメージがついてくるように指定。<a href=”#header”>で#headerにリンクさせて、トップに戻れるようにした。機能のわりには軽めに出来たような気がする。
導入する上でのソースはRSSへのリンクをtopへ戻るボタンに追随させるの方に記述。
position:fixed;の問題点
問題はIE6などではcss position:fixed;が有効にならないバグがあること。FirefoxやOperaでは指定どおりに表示され、こちらの方がW3C的には正しいはずなのに・・・。IE7では改善されているのだろうか?Vistaが出たとはいえ、IE6とIE7のシェアは9:1くらいらしいから悩ましい。確認したところIE7では指定どおりの挙動。
仕方が無いのでposition:fixed!important;にして、position:fixedを読み込めないブラウザにはposition:absolute;で絶対座標的な表示にしてみた。ユーザビリティはかなり下がるけれど無いよりはマシなレベル。何かよい解決策がjsファイルを使用しない方法であれば教えてもらえると喜びます。

Tags: css, Firefox, ie, opera

タグクラウド
topへ戻る
ああwordpressのrss