wordpress

wordpressに関すること

[WP]オリジナルテーマ作成方法いろは（参）::index.php

by

WordPressオリジナルテーマ作成について語ってみるテスト、弐からの続き。
今回はindex.phpの作成編。

▼前回までの作成状況
themes_making2-3

とりあえずindex.phpで記事表示するところまで作ることにします。
トップページ的な役割をするものなので、single.phpと若干作りが違います。

続きを読む

[WP]オリジナルテーマ作成方法いろは（弐）::functionsとsidebar

by

WordPressオリジナルテーマ作成について語ってみるテスト、壱からの続き。
今回はfunctions.phpとsidebar.php作成編。

▼前回までの作成状況
themes_making2　ここまでの作成状況

functions.phpは配布されたテーマそのまま使う分には特別必要ってワケじゃないんですが、
テーマ作るとなると避けて通れないものであります。特にsidebarとは切れない関係。

前回ではfunctions.phpは作っていないので、
とりあえず新しいphpファイルを用意して名前をfunctionsにして保存しといてください。

続きを読む

[WP]オリジナルテーマ作成方法いろは（壱）

by

wordpressのオリジナルテーマ作成について語ってみるテスト。
ブログっぽいWebサイトテンプレートを作ったので、これを利用して作る方法を追う。
同タイトルの連番シリーズになっています。合言葉は「欲しいテーマが無いなら作ればいいじゃない！」
この記事は配布テンプレダウンロードからheader.phpとfooter.php作成まで。

全体で出てくる主な内容

  • アーカイブページとシングルページのレイアウト変更（３カラムと２カラム分岐）
  • 自作テンプレ・ＣＳＳファイル呼び出し
  • サイドバーウィジェット関連
  • FLASHの表示
  • ループについての解説

用意するもの

  • UTF-8が扱えるエディタ（PHPとHTMLの色分け表示できると見やすい）
  • WordPress本体（ローカル環境が望ましい）
  • XHTML/CSSテンプレート（なんでもいい）

テーマのテンプレートファイル構造がいまいちよく分からないという方は
事前にテンプレートファイルの仕様と構成を見ておくと分かりやすくなるとおもいます。
ファイルの編集は一応wordpressのテーマエディタでも出来なくはないです。

注意

  1. 対象バージョンは2.5～2.6です。下位バージョン対策も一応します。
  2. 手順はすごく・・・俺流です
  3. サンプルデザインをそのまま使うならコピーライト消しちゃダメ
  4. 貼ってあるソースそのまま使うとエラーになるかも（全角混入注意報）
  5. 途中レイアウト崩壊したらＸＨＴＭＬソースをチェックしよう

続きを読む

[WP]画像サムネイルを投稿された記事へのリンク付きで表示

by

記事で使われた画像を使って、記事へのリンクをテンプレート、またはサイドバー内に表示する方法について。
ver2.7でも動きます。

ver2.9の投稿サムネイル機能を使う関数はこちらにあります。

使うとこんな感じになる▼
attachment_ancherlinks　sample

以前書いた画像のサムネイル表示（ループ内）の応用です。
この記事の関数は特定のカテゴリ下にある画像に絞っています。
全てのカテゴリーに対応したい場合はこちらの記事をご覧下さい。

続きを読む

[WP]AutoExternalLinkプラグインをjQuery版にする

by

AutoExternalLinkプラグインはprototypeが使われてます。
前回書いた[WP]AutoExternalLinkプラグイン修正は、prototypeを使ったVicuna用の改造方法でしたが、
今回はリクエストにお答えしてjQuery版に変更する方法を解説します。
ついでにwp_enqueue_script()への対応方法も載せてます。

プラグイン作者はinoccoさん、jsソースはFsikiさんが作られたものです。
この記事では改造部分のみ掲載しており、変更後のソースそのものは配布してません。

続きを読む

[WP]moreタグの出力ソースを変更する

by

<!–more–>　で記事を区切ったときに出力される続きを読むリンクや、ターゲットに使われてるspanタグそのものを変更する方法について。

デフォルトだと、全文が表示されたときに挿入されるソースはこうです。

<p><span id="more-4"></span></p>

たとえばこれを次のようにDivへ変更する

</div>
<div id="more-4">

the_content_more_link について追加

続きを読む

[WP]get_posts()関数について

by

get_posts関数の使い方とCSS Template Listsのページでやってることを紹介しますん。

CSS Template Listsではカテゴリーに記事がpublicで投稿されたら、記事のサムネイルになる画像にリンク貼って一覧表示しています。
記事のサムネイルについては設定や表示をするプラグインもありますが、プラグイン使わなくてもやれる方法があるよ、ってことで。

あるカテゴリーの記事をリストアップしたいという場合、この記事のサンプルのように
普通はquery_posts()とか使うと思いますが

<?php query_posts('cat=5');if (have_posts()) :?>
<?php while (have_posts()) : the_post(); ?>
<div class="post">
<?php the_content(__('Read More »')); ?>
</div>
<?php endwhile;?>
<?php wp_reset_query();endif;?>

実際使ってみると出来ないことの方が多い。ので、

以前Post, Page, and Attachment Functionsでちらっと書いた
queryよりもスマートに取得出来る、get_posts()を使用する。

※カスタマイズ初心者には難しいかもしれない

続きを読む

[WP]AutoExternalLinkプラグイン修正

by

inoccoさんが作成されたリンクに新しいウィンドウを開くアイコンを自動で追加するプラグイン
AutoExternalLinkをVicuna用に修正してみた話。

プラグイン添付のjsファイルはLogJETさんが作成されたそうなんですが、

  1. 表示エリアが見つからなかったときにエラーが出るのを直しておきたい。
  2. クラス名を２つ３つ並べて指定するとアイコンが出ないので、それもなんとかしたい。
  3. 今使ってるVicunaではヘッダにリンクを貼るとアイコンが出るので、hn要素以外のaタグに追加したい。
  4. iG:Syntax Hiliterのソースにはアイコン出ないようにしたい。

そのまま使えなかったので変えてみますた。
修正箇所は次の通りです。

続きを読む

[WP]WordPress2.5～2.6のパーマリンク編集エリアを常に表示させる

by

「ページスラッグ編集するエリアが見当たらないんだけど・・・・」っていう質問は本家でもよく書かれてます。
Wordpress2.5～2.6はタイトルの下にページスラッグ編集エリアが出ますが、多くの場合表示されてません。

普通はどうやったら出るようになるのかというと、オプション設定の「パーマリンク設定」で、
パーマリンク構造内に %postname%か%pagename% を含む場合のみ表示されるようになります。
表示されるタイミングは、タイトル入力後かオートセーブか何かで下書きが保存された時点ですが、
パーマリンク構造に%postname%が含まれてなければスルーされる。

で、コレではあまりに不便。
このブログは%postname%使わないリンク構造してるけど、ページスラッグも変更しときたいなァ・・・とか思って
常に表示させる方法を我々スタッフが総力を挙げて探しました。

その結果・・・無事見つけ出すことが出来ましたよ！

●Wordpress2.7について
ver2.7ではクイック編集でパーマリンク設定に拠らず変更が可能です。

続きを読む

[WP]wordpress付属のJavascriptを使用する

by

wordpressにはwp-includeのjsディレクトリにprototypeやjQuery等のライブラリーが色々入っている。

テーマやプラグインでこれらを使用出来るようheadにscriptタグを挿入するにはwp_enqueue_script()を使用します。
独自に作成したjsファイルや、プラグインやテーマに同封したjsファイルにも使えるので便利。

続きを読む

[WP]wordpressでRSSを取得して表示

by

wordpressにはRSSを取得して配列に整形する機能が備わってるらしい。…というのを最近TwitterAPI調べてた時知ったのでそれについてのメモ。
バージョンいくつからか詳しく確認してないんだけど、手元にあるので一番古いvar2.1.3には入ってた。
よく考えたらダッシュボードのRSSもコレだよな…ので、新しい情報ではありません。

外部サイトのRSSを取得するには次のように書く

include_once(ABSPATH . WPINC . '/rss.php');
$rss = fetch_rss($uri);

で、これだけ書いたら詳しい人にはﾃｨﾝ!と来るかも。

続きを読む

[WP]ショートコードAPI仕様メモ

by

wordpress2.5から実装されたショートコードについて。
ショートコードというのは、タグの簡易版みたいなものです。プラグインではよくお目にかかります。
2.5から本文中に［gallery］と入力すると、その記事でアップロードされた画像がサムネイルで一覧表示される機能がありますが、こういうのを自作できるわけです。

胡散臭いまとめは信用ならねぇ、という方は公式サイトの説明を見てください。
※この記事は本家解説の完全翻訳はしてません

手っ取り早く作ってみる

下のソースをアクティブになってるテーマのfunction.phpにコピペする。

function bartag_func($atts) {
	extract(shortcode_atts(array(
		'foo' => 'no foo',
		'baz' => 'default baz',
	), $atts));

	return "foo = {$foo}";
}
add_shortcode('bartag', 'bartag_func');

▼投稿画面で次のタグを記入すると、それぞれ違う出力結果になります。

[ bartag ]と本文に投稿→foo = no foo
[ bartag foo=”bar” ]と本文に投稿→foo = bar

続きを読む

[WP]カテゴリーのアイコンを表示するプラグイン「Category Icons」

by

各カテゴリーに任意のアイコンを設定・表示するWordpress用プラグイン「Catgory Icons」の紹介と日本語化ファイルの配布。

このプラグインは、カテゴリーそれぞれに独自のアイコンを設定することが出来て、
サイドバーのカテゴリーリストや記事のタイトルに設定したアイコンを表示してくれます。

インストール

WordPress2.3～2.6.1対応
最新バージョン2.0.7

※ver2.0.5の翻訳ファイルそのまま使用してても問題はありません。

ダウンロード後展開、wp-content/plugins/にアップロードしたら、有効化する。

日本語化ファイルは、解凍したmoファイルをlanguagesフォルダに入れます。
moファイルのアップロード形式はバイナリで。
2.0.5からプラグインに同胞されたようです。ﾜｰｲ

ダウンロード

若干エラーの日本語が怪しいかもしれない。

2.0.7の変更点は大体次の通りです。

  • My Category Orderに対応。
  • アイコンリストにソート機能が付いた（テーブルのヘッダクリックで動作）
  • ウィジェットが本体に内包された（category-icons_widget.phpが無くなり、本体有効化だけでウィジェットが使用可能に）
  • 不要なフィールドの削除とMySQLに関する修正
  • イタリア語・トルコ語翻訳ファイルの追加

2.0.2→2.0.5はSEO Friendly Imagesに関する差分です。

続きを読む

[WP]WordPressテンプレートカスタマイズ用小技メモ

by

テンプレートファイルのカスタマイズで使えそうなソースのサンプルをつらつらと書き散らしてみる。その２はこちら。

タイトルの文字数制限

一定数以上のタイトルを省略（抜粋）する。
下記サンプルだと10文字まで拾って以下を三点リーダにしています

<?php 
	$title= mb_substr($post->post_title,0,10);
	echo '<h1>'.$title.'…</h1>';
?>

続きを読む

[WP]SEO対策系プラグイン比較まとめ

by

WordPress用のSEO対策・ヘッダ操作系プラグインを比較したまとめ。
タイトルやメタタグを操作するもの中心。サイトマップは除外。
メタタグ操作はテーマでやれなくもないけど、プラグイン使う方が楽です。

選択条件

  • 公式サイトでのダウンロード数の高い順
  • WordPress2.5に対応している
  • 日本語で使える（翻訳の有無は問わない）

続きを読む

[WP]テンプレートファイルの仕様と構成

by

テンプレートファイルの役割やら構成なんかについてのまとめ。そこそこ初心者向け。

WordPressテーマ概要

WordPressのデザインはテーマと呼ばれてます。テーマを構成するファイル群がテンプレートファイルです。
他のブログのようにテーマをテンプレートと呼んでも通じるけど、検索するときはテーマ(Theme)を使う方が良いかも。

ダウンロードしたばかりだと”Classic” と “Default”の２つがプリインストールされてますが、
テーマ新しく追加する場合は、ダウンロードして解凍したテーマのフォルダをWordpressのwp-content/themes/にアップロードするだけ。
デザイン（表示）に並ぶテーマのスクリーンショットをクリックすれば即座に変更されます。
テーマ変更で再構築が必要ない、というのがWordpressの良いところ。

WordPressは1.x系、2.0.x系、2.1.x系、2.2以降と2.5以上では内部仕様が違ってるので、テーマやプラグインはバージョンにあったものを選ばないとエラーが出たりするので注意。
特に2.7は最新とあって対応してるテーマやプラグインもまだ少ないようです。
公式のリスト»
WordPress 2.7 Theme Compatibility List
WordPress 2.7 Plugin Compatibility List
ver2.5→ver2.7に修正

WordPressはコアファイル・プラグイン等全てPHPなので、PHPとmySQLに通じていればかなり色々なことができます。
テーマを構成するテンプレートファイルは、XHTMLとPHPのテンプレートタグで作成されてます。
XHTMLとUTF-8で記述するのがベターですが、HTMLでも文字コードさえ合ってれば問題はないです。
文字コードはWordpress2.5ではUTF-8のみになりました。
テキストエディタはBOM無しのUTF-8で保存できるものを選ぶ必要があります。(メモ帳はダメ！絶対）

テンプレートに記述するWordpress独自のPHPコードはテンプレートタグの他、ループやファンクションなどかなり色々使えます。
PHPの関数や変数なんかも使えます。

続きを読む

[WP]WordPress　オプションページの作成

by

どうしても作りたいプラグインが出来たので試しに作ってみてるが、その際避けて通れないオプション設定ページ。
テーマの独自設定を作りたい時にも使える。
Creating Options Pagesから適当に抜粋。
ページそのものの追加は前のエントリーで紹介してるので省略。

最後の方に設定保存のメカニズムについても適当に解説をつけてみた。

続きを読む