WordPress

WordPress を高速化する5つの方法

17

WordPress を高速化する5つの方法です。

  1. テーマの効率化
  2. PHP の高速化
  3. ページキャッシュプラグインの使用
  4. MySQL クエリキャッシュ
  5. MySQL テーブル最適化

(続きを読む…)

WordPress API フックの使い方

2

API フックとは

プラグインやテーマの動作を WordPress 本体に連動させることができます。WordPress 本体に修正を加えなくてもカスタマイズできます。

アクションとフィルタ

API フックにはアクションとフィルタがあります。アクションは WordPress で発生するイベントによって実行されます。イベントは投稿やテンプレートの変更などユーザが行う行動です。フィルタはテーマなどで出力するテキストデータを変更するものです。
(続きを読む…)

WordPress テーマを作成(8)function.php の使用

1

WordPress のテーマを作成しているときに、テーマ内でちょっとした機能を入れるときに便利なファイルが function.php です。

テーマフォルダに function.php を作成すると、テーマが有効化されているとブログの画面を表示する前に自動的に読み込まれます。

この機能を利用してテーマで使う関数などを function.php に定義しておけば、テンプレートファイルもすっきりと読みやすくなります。

注意点としては関数名をつけるときに既存の関数とぶつからないようにすることです。参考に function.php を使用している他のテーマを見てみるとよいかと思います。ユニークなるように関数名をつける必要があります。ユニークなテーマ名をつけて、テーマ名をプレフィックスとして関数名につけるとよいかと思います。

WordPress テーマを作成する(7) 任意のテンプレートを読み込む

1

WordPress のテーマのテンプレート内に任意のテンプレートファイルを読み込ませる方法です。

例えば hoge.php というファイルをテンプレート内に読み込ませたい時は、読み込ませたい部分に下記のように書きます。

<?php include ( TEMPLATEPATH . '/hoge.php'); ?>

(続きを読む…)

ブログにコードを表示するときに便利な dp.SyntaxHighlighter

4

今までのデザインでは pre タグ or code タグで PHP などのコードを表示していましたが、今回のサーバ移転&デザイン変更を機にコードの表示に SyntaxHighlighter を使用してみました。

syntaxhighlighter – Google Code

特徴

  • 多言語対応のシンタックスハイライト
  • 行番号を付加
  • クリックするだけでクリップボードへのコピーが可能(IEのみ)
  • 別ウィンドウでソースを表示可能
  • コードの印刷が可能
  • JavaScriptオフの状態では、テキストエリアにてコードが表示される

(続きを読む…)

サーバ移転 XREA からさくらへ

0

昨日、このブログを設置しているサーバを XREA からさくらへ移転しました。移転ついでに WordPress のバージョンも 2.5 にアップ & テンプレート変更してみました。WordPress 2.5 や移転の話はまたそのうち書きます。

XREA は安くてよかったのですがサーバが重すぎです。毎日夕方になるとブログを開くのが重くなり、しまいには PHP ファイルがダウンロードされるというありえない状態に。また、先月2回ほどメール送受信が2日ほど不可能になり、移転を決めました。
(続きを読む…)

WordPress テーマを作成する(6) CSS でデザインを整える

1

前回まではまだ縦に長いだけのデザインされていない状態でした。今回は CSS を作成してデザインを整えてブログらしくして行こうと思います。 (続きを読む…)

WordPress テーマを作成する(5) サイドバーをウィジットに対応させる

10

前回作成したサイドバーをウィジットに対応させて、管理画面からサイドバーを変更できるようにしてみました。

sidebar.php の修正

sidebar.php の ulタグ の直後に以下の行を追加
<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?>
また sidebar.php の最後の ul タグの前に以下の行を追加
<?php endif; ?>
つまり ul タグの中を上記の if 文ではさむ感じです。

<div id="sidebar">
<ul>
<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?>
// ここにデフォルトのサイドバーの内容を書く
<?php endif; ?>
</ul>
</div>

functions.php の作成

作成しているテーマディレクトリに functions.php を作成して下記のコードを追加する。

<?php
if ( function_exists('register_sidebar') )
    register_sidebar();
?>

これで管理画面で 表示 > ウィジット でアクセスすると下記のような画面になり動的にサイドバーを変更することができます。
dynamic1.png

少しの手間で使い勝手が便利になるので、テーマを作成するときにはウィジットに対応させておいた方がいいでしょう。

参考URL:Widgetizing Themes ? Automattic

WordPress テーマを作成する(4) サイドバーを作る

1

今回はサイドバーを作っていきます。sidebar.php にコードを書いていきます。

骨格

WordPress のサイドバーは下記のような構成の HTML になります。

WordPress テーマを作成する(3) トップページの投稿一覧を作る

1

index.php に投稿一覧を作成する

投稿内容の一覧を表示するには下記のコードのパターンを使用します。

<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
/* ここに投稿内容を表示するコードを書く */
<?php endwhile; ?>
/* 1件も投稿がなかった場合 */
<?php endif; ?>

最初の if (have_posts()) で投稿があるかチェックしてあれば、次の while 文で投稿の数だけループして、投稿がなければ endwhile に分岐します。

WordPress のタグを使用して投稿内容を表示する

上記のループ内で使用する個別の投稿を表示するタグの一部を書いておきます。
投稿の個別URLを表示<?php the_permalink() ?>
タイトルを表示<?php the_title(); ?>
投稿日時を表示<?php the_time('Y/m/d') ?>
カテゴリを表示<?php the_category(', ') ?>
コメント・トラックバックを表示<?php comments_popup_link('0ä?¶', '1ä?¶', '%ä?¶'); ?>
投稿の編集リンクを表示(ログインしていないと非表示になる)<?php edit_post_link('ç?¨é??', '', ' | '); ?>

最終的なコード

<?php get_header(); ?>

<div id="content" class="narrowcolumn">
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<div class="post" id="post-<?php the_ID(); ?>">
<h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h2>
<small><?php the_time('Y/m/d') ?></small>
<div class="entry">
<?php the_content('続きを読む ?'); ?>
</div>
<p class="postmetadata">カテゴリ:?<?php the_category(', ') ?> | <?php edit_post_link('編集', '', ' | '); ?> コメント・トラックバック:<?php comments_popup_link('0件', '1件', '%件'); ?></p>
</div>
<?php endwhile; ?>
<div class="navigation">
<div class="alignleft"><?php next_posts_link('? 前のページへ') ?></div>
<div class="alignright"><?php previous_posts_link('次のページへ ?') ?></div>
</div>
<?php else : ?>
<h2 class="center">Not Found</h2>
<p class="center">Sorry, but you are looking for something that isn't here.</p>
<?php endif; ?>
</div>

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

最終的にこうなりました。(クリックで拡大表示されます)
wp3.png

まだ CSS をまったく書いていないので縦にのっぺりとしていますが、だいぶブログらしくなってきました。

Go to Top