10月2008

Category Order[カテゴリーの並び変え]

このページは、私がWordpess/ワードプレスでブログサイトを制作する上で必要とするプラグインを書き留めたものです。よって、下記Wordpess/ワードプレス用プラグインの使用方法を解説したページではありません。

ダウンロードサイト:David Coppit’s Code Page

最下部 Category Order 2.0.1 をダウンロード[2008/10/30現在]

ダウンロードしたファイル(Zip)を解凍後、/wp-content/plugins/へアップロード。使い方はいたってシンプル。

  • [Insert spacer before this item] カテゴリー行間が開く(上)。
  • [Insert spacer after this item] カテゴリー行間が開く(下)。
  • [Put the Post Count Inside the Category Link] 投稿数までリンクに含まれる(リンク領域が広がる)。選択後は[Put the Post Count Outside the Category Link]と表示される(解除)。
  • [Reset the Order to Single Level , Alphavetical] デフォルトの状態へ。

参考:Category Order:カテゴリーの順序を並び替え

WordPress:インクルードタグ

特定のファイル(phpファイル)の読み込み。

ァイル名を指定

<?php get_header(); ?>
<?php get_footer(); ?>
<?php get_sidebar(); ?>
<?php comments_template(); ?>

TEMPLATEPATH/sidebar-2.phpを作製したとき

<?php get_sidebar('2'); ?>
sidebar-***.php の ***部分 2.5以上

特定のテンプレートの読み込み。

TEMPLATEPATH/header-singleを作製したとき

<?php include (TEMPLATEPATH . '/header-single.php'); ?>

デザイン的に変更箇所が多い場合はこちらが便利。

WordPress:条件分岐指定タグ

特定のページにだけ特定内容を表示させたい時などに使用。

  • index.phpにだけ特定内容を表示
  • page.phpにだけ特定内容を表示
  • single.phpにだけ特定内容を表示など
<?php if(タグ): ?> ~ <?php endif; ?>

指定サンプル:1

<?php if(is_home()): ?>
<h1>AAAAAAAAAA</h1>
<?php endif; ?>
<?php if(is_archive()): ?>
<h1>BBBBBBBBBB</h1>
<?php endif; ?>

指定サンプル:2

<?php if(is_home()): ?>
<h1>AAAAAAAAAA</h1>
<?php else: ?>
<h1>BBBBBBBBBB</h1>
<?php endif; ?>

メインページ

<?php if(is_home()): ?> ~ <?php endif; ?>

フロントページ

サイトのフロントページが表示されている場合。投稿の場合とページの場合あり。管理画面の「設定>表示設定>トップページの表示」で、「最新の投稿」が選択されているか、「固定ページ (以下を選択)」で現在のページが表示されている場合。 注: この条件タグは バージョン 2.5 で追加。

<?php if(is_front_page()): ?> ~ <?php endif; ?>

シングルページ

<?php if(is_single()): ?> ~ <?php endif; ?>

記事を含むページ

<?php if(comments_open()): ?> ~ <?php endif; ?>
WordPress ループ内で処理中の記事がコメント受信を受け付けている場合
<?php if(pings_open()): ?> ~ <?php endif; ?>
WordPress ループ内で処理中の記事がピン(ピンバックおよびトラックバック)を受け付けている場合

ページ

<?php if(is_page()): ?> ~ <?php endif; ?>

ページテンプレート(バージョン 2.5以降)

<?php if(is_page_template()): ?> ~ <?php endif; ?>

カテゴリーページ

<?php if(is_category()): ?> ~ <?php endif; ?>

アーカイブページ

<?php if(is_archive()): ?> ~ <?php endif; ?>

タグページ

<?php if(is_tag()): ?> ~ <?php endif; ?>

日付別ページ

<?php if(is_date()): ?> ~ <?php endif; ?>
<?php if(is_year()): ?> ~ <?php endif; ?>
<?php if(is_month()): ?> ~ <?php endif; ?>
<?php if(is_day()): ?> ~ <?php endif; ?>
<?php if(is_time()): ?> ~ <?php endif; ?>

検索結果ページ

<?php if(is_search()): ?> ~ <?php endif; ?>

404 Not Found ページ

<?php if(is_404()): ?> ~ <?php endif; ?>

(さらに…)

min-width:最小幅指定

min-widthプロパティは要素の最大の横幅を設定。IE6以前のバージョンは未対応な点に注意。

プロパティ

min-width

em | px | %

対象

すべての要素(tableは除く)

継承の有無

なし

通常は最小幅[max-width]と同時指定します。

<div id="box">
<div id="***"></div>
<div id="***"></div>
<div id="***"></div>
</div>
---- CSS ----
#box {
  min-width: 700px;
  max-width: 900px;
}

IE6以前のブラウザ用にCSSファイルを作成するなどの対処が必要。

IE独自拡張スクリプトを記述

#box {
  min-width: 700px;
  max-width: 900px;
  width: expression(document.body.clientWidth < 701? "700px":document.body.clientWidth > 901? "900px" : "100%");
  position: relative;
}

IE用CSSファイルを読み込む

<head>
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />

<!--[if gte IE 6]>
<link rel="stylesheet" href="IE用.css" type="text/css" media="screen" />
<![endif]-->
</head>

(さらに…)

max-width:最大幅指定

max-widthプロパティは要素の最大の横幅を設定。IE6以前のバージョンは未対応な点に注意。

プロパティ

max-width

em | px | %

対象

すべての要素(tableは除く)

継承の有無

なし

通常は最小幅[min-width]と同時指定します。

<div id="box">
<div id="***"></div>
<div id="***"></div>
<div id="***"></div>
</div>
---- CSS ----
#box {
  min-width: 700px;
  max-width: 900px;
}

IE6以前のブラウザ用にCSSファイルを作成するなどの対処が必要。

IE独自拡張スクリプトを記述

#box {
  min-width: 700px;
  max-width: 900px;
  width: expression(document.body.clientWidth < 701? "700px":document.body.clientWidth > 901? "900px" : "100%");
  position: relative;
}

IE用CSSファイルを読み込む

<head>
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />

<!--[if gte IE 6]>
<link rel="stylesheet" href="IE用.css" type="text/css" media="screen" />
<![endif]-->
</head>

(さらに…)

clearfix:floatの解除

親ボックス内でfloatを解除する子ボックス[#footer{clear:both;}など]を設けない場合のfloat解除方法。

親ボックス内でfloatを解除しなかった場合、背景画像が表示されない、或いは親ボックスの下まで表示されない場合などに有効だが、基本的には親ボックス内でfloatを解除した方がbetter。

<div id="box">
<div id="box-a"></div>
<div id="box-b"></div>
</div>
---- CSS ----
#box { width: 700px; margin: 0 auto; background: #******; }
#box-a { width: 500px; float: left; }
#box-b { width: 200px; float: right; }
<div id="box" class="clearfix">
<div id="box-a"></div>
<div id="box-b"></div>
</div>
---- CSS ----
#box { width: 700px; margin: 0 auto; background: #******; }

.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

 .clearfix { display: inline-block; } /* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
 .clearfix { display: block; } /* End hide from IE-mac */

#box-a { width: 500px; float: left; }
#box-b { width: 200px; float: right; }

参考:Clearing a float container without source markup

和訳:構造のマークアップなしでフロートをクリアする方法

とても参考になる記事:clearfixの決定版を作る -モダンブラウザ編-

Related Entries[関連記事一覧表示]

このページは、私がWordpess/ワードプレスでブログサイトを制作する上で必要とするプラグインを書き留めたものです。よって、下記Wordpess/ワードプレス用プラグインの使用方法を解説したページではありません。

ダウンロードサイト

ダウンロードしたファイル(Zip)を解凍後、/wp-content/plugins/へアップロード。

設置したい箇所に下記ソースを挿入。

<?php related_posts(); ?>

プラグイン:Related Entriesの設定

Related Entriesを有効化するとプラグイン管理ページに[Related Posts Options]が表示されるので選択。

How many related posts would you like to show?:
関連記事の表示数指定。
Before / After (Post Title) : / For example: <li></li>or<dl></dl>

関連記事タイトルの表示設定。
Show excerpt?
抜粋表示指定。
Excerpt length (No. of words):
抜粋の文字数指定。
Before / After (Excerpt): / For example: <li></li>or<dl></dl>

抜粋部分の表示設定
Show password protected posts?
パスワードで保護された記事の表示指定。

SQL Index Table Setup

SQL Index Table Setupが反映されない(上手くいかない)とき。

[phpMyadmin] [データベース] [データベース名] [SQL]から

ALTER TABLE `wp_posts` ADD FULLTEXT `post_related` (
  `post_name` ,
  `post_content`
  )

ALTER TABLE `データベースのテーブル接頭後_posts` ADD FULLTEXT `post_related` (,,,,,?

WordPressの使い方(運用例)

WordPressは[ID]と[パスワード]を発行する事により、ひとつのサイトを複数人で運営管理(更新作業)できます。今までのような、ホームページ制作担当者だけが更新作業をするより効率的に運営が可能となります。

wordpressの使い方(運用例)

各課単位で更新

wordpressの使い方(運用例)

商店街の各店単位、共同組合の各組合員単位で共同運営

wordpressの使い方(運用例)

(さらに…)

Google Maps

このページは、私がWordpess/ワードプレスでブログサイトを制作する上で必要とするプラグインを書き留めたものです。よって、下記Wordpess/ワードプレス用プラグインの使用方法を解説したページではありません。

ダウンロードサイト

制作者ページ

解説ページ:Google Mapsの新仕様に対応したWordPressのプラグイン -Google Maps Quicktag

Lightview for WordPress[画像拡大スクリプト]

このページは、私がWordpess/ワードプレスでブログサイトを制作する上で必要とするプラグインを書き留めたものです。よって、下記Wordpess/ワードプレス用プラグインの使用方法を解説したページではありません。

ダウンロードページ:Lightview for WordPress

ダウンロードページ:Lightview 2.3.2

ダウンロードしたファイル(Zip)を解凍後、Lightview 2.3.2の中身 [CSSフォルダ] [imagesフォルダ] [lightview.js]をLightview for WordPressフォルダへ入れ、/wp-content/plugins/へアップロード。

class="lightview"をリンク部分へ入力。

<a href="画像.jpg" title="タイトル" class="lightview">****</a>

デモ表示

以下カスタマイズ参考:coliss

backgroundColor ----- 背景色
border ----- ボーダーのサイズ
buttons.opacity ----- ボタン不透明度
effects ----- Scriptaculousの効果
images ----- lightview.jsからみたディレクトリ
imgNumberTemplete ----- 画像のナンバリング
overlay ----- オーバーレイ
radus ----- 角丸の半径
sideshow.delay ----- スライドの表示タイミング
titleCaptionSplit ----- タイトルとキャプションの区切り
transition ----- リサイズのエフェクト
viewport ----- 画像の表示領域
zindex ----- zindexの値

Google (XML) Sitemaps Generator

このページは、私がWordpess/ワードプレスでブログサイトを制作する上で必要とするプラグインを書き留めたものです。よって、下記Wordpess/ワードプレス用プラグインの使用方法を解説したページではありません。

ダウンロードページ

制作者ページ

Sitemap.xmlの生成。

ダウンロードしたファイル(Zip)を解凍後、/wp-content/plugins/へアップロード。空ファイル[sitemap.xml]・[sitemap.xml.gz]を作成して、トップディレクトリにアップロード。パーミッション[606/666]

WP-PageNavi[ページナビ]

このページは、私がWordpess/ワードプレスでブログサイトを制作する上で必要とするプラグインを書き留めたものです。よって、下記Wordpess/ワードプレス用プラグインの使用方法を解説したページではありません。

ダウンロードページ

作者ページ

番号表示のページリンク[ページング]

ダウンロードしたファイル(Zip)を解凍後、/wp-content/plugins/へアップロード。

ページナビを設置したい箇所に下記ソースを挿入。

<?php wp_pagenavi(); ?>

ページナビゲーション:pagebar

ダウンロードページ

作者ページ

番号表示のページリンク[ページング]

ダウンロードしたファイル(Zip)を解凍後、/wp-content/plugins/へアップロード。

ページナビを設置したい箇所に下記ソースを挿入。

<?php wp_pagebar(array(’before’=>’Pages: ‘))?>

All in One SEO Pack[seo]

このページは、私がWordpess/ワードプレスでブログサイトを制作する上で必要とするプラグインを書き留めたものです。よって、下記Wordpess/ワードプレス用プラグインの使用方法を解説したページではありません。

ダウンロード

日本語版 All in One SEO Pack 1.4.6.14

作者ページ

各ページのTitleタグ、Meta Keywords、Meta Descriptionの個別指定。

Breadcrumb Navigation XT[パン屑リスト]

このページは、私がWordpess/ワードプレスでブログサイトを制作する上で必要とするプラグインを書き留めたものです。よって、下記Wordpess/ワードプレス用プラグインの使用方法を解説したページではありません。

ダウンロードページ

作者ページ

<?php if ( class_exists('breadcrumb_navigation_xt') ) { ?>
    <div class="breadcrumb">
    <?php 
    // Display a prefix
    echo 'Navigation: ';
    // new breadcrumb object
    $mybreadcrumb = new breadcrumb_navigation_xt;

// Apply options: オプション設定
//    設定したい項目の行頭のスラッシュ2つを外すと有効になる。UTF-8で保存。
//    以下にセットしてある値は、true/false の項目は初期値の逆、その他は初期値。

// $mybreadcrumb-&gt;opt['static_frontpage'] = true;    // 「ページ」を使ってブログ以外のホームページを設けている(ブログがホームの下位レベルにある)場合。初期値は false(ホーム=ブログ)
    // その場合のオプション
    // $mybreadcrumb-&gt;opt['url_blog'] = '';  // ブロクのURL。http://www.site.com/myweblog/にブログがあるなら '/myweblog/'
    // $mybreadcrumb-&gt;opt['home_display'] = false;   // 「Home」を表示しない場合。初期値は true(表示)
    // $mybreadcrumb-&gt;opt['url_home'] = get_settings('home');    // ホームへのリンクURI
    // $mybreadcrumb-&gt;opt['home_link'] = false;  // ホームにリンクを付けずテキストのみ表示。初期値は true(リンク付き)
    // $mybreadcrumb-&gt;opt['title_home'] = 'Home';    // ホームを表すテキスト

// その他のオプション
// $mybreadcrumb-&gt;opt['title_blog'] = 'Weblog';  // ブログのトップを表すテキスト
// $mybreadcrumb-&gt;opt['separator'] = ' / ';  /* 階層間の区切り文字 */
// $mybreadcrumb-&gt;opt['title_search'] = 'Search';    /* 検索結果ページを表すテキスト */
// $mybreadcrumb-&gt;opt['singleblogpost_prefix'] = 'Blog article: ';   /* 記事名の接頭辞 */
// $mybreadcrumb-&gt;opt['singleblogpost_suffix'] = '';     /* 同 接尾辞 */
// $mybreadcrumb-&gt;opt['page_prefix'] = '';   /* ページ名の接頭辞 */
// $mybreadcrumb-&gt;opt['page_suffix'] = '';   /* ページ名の接尾辞 */
// $mybreadcrumb-&gt;opt['urltitle_prefix'] = 'Browse to: ';    /* 上位ページのリンクにポインタを当てたときのツールチップの接頭辞 */
// $mybreadcrumb-&gt;opt['urltitle_suffix'] = '';   /* 同ツールチップの接尾辞 */
// $mybreadcrumb-&gt;opt['archive_category_prefix'] = 'Archive by category &amp;#39;';  /* カテゴリアーカイブの接頭辞 */
// $mybreadcrumb-&gt;opt['archive_category_suffix'] = '&amp;#39;';  /* カテゴリアーカイブの接尾辞 初期値はシングルクオート */
// $mybreadcrumb-&gt;opt['archive_date_prefix'] = 'Archive: ';  /* 年月日アーカイブの接頭辞 */
// $mybreadcrumb-&gt;opt['archive_date_suffix'] = '';           /* 年月日アーカイブの接尾辞  */
// $mybreadcrumb-&gt;opt['use404'] = false; /* 404エラーのときに次項の専用タイトルを表示しない場合。初期値は true(表示) */
// $mybreadcrumb-&gt;opt['title_404'] = '404';  /* 404エラー時の表示タイトル */
// $mybreadcrumb-&gt;opt['link_current_item'] = true;   /* 現在のページ名にリンクを付ける場合。初期値は false(テキストのみ) */
// $mybreadcrumb-&gt;opt['current_item_urltitle'] = 'Link of current page (click to refresh)';  /* 前項でtrueにしたときのツールチップ表示 */
// $mybreadcrumb-&gt;opt['current_item_style_prefix'] = ''; /* 現在のページ名の接頭辞(タグでもOK。&lt;span class=&quot;bc_current&quot;&gt;等) */
// $mybreadcrumb-&gt;opt['current_item_style_suffix'] = ''; /* 現在のページ名の接尾辞 */
// $mybreadcrumb-&gt;opt['posttitle_maxlen'] = 0;   /* 記事タイトルの表示文字数。0は無制限 */
// $mybreadcrumb-&gt;opt['singleblogpost_category_display'] = true; /* 単体記事表示時にカテゴリを表示。初期値は false(非表示) */
// $mybreadcrumb-&gt;opt['singleblogpost_category_prefix'] = '';    /* 前項でtrueにしたときのカテゴリ名の接頭辞 */
// $mybreadcrumb-&gt;opt['singleblogpost_category_suffix'] = '';    /* 同 接尾辞 */

// Display the breadcrumb
$mybreadcrumb-&gt;display();
?&gt;
&lt;/div&gt;&lt;!-- [breadcrumb] --&gt;

<?php } ?>

参考:power source

追記
コチラの方が使い勝手が良いです。Breadcrumb NavXT