• HOME
  • >
  • タグ: wordpress
  • プラグイン無しで作った「ページナビ」と「トップへ戻るボタン」

    最近、何かと身の回りを整理したくなる断舎利モードに入っていて、2年以上着なかった服とか、10年近く着こんでいる服とか、使わなくなったバッグとか、再読しそうもない本とか、使うかも~と取って置いた紙袋とか、インストールしたけど活用してないスマホのアプリとか、、、、諸々処分しています。

    その流れで当サイトを見直してみると、インストールしているプラグインが多過ぎるのではないかと気になりました。
    確かにプラグインは「こんなのが欲しかった!」という機能を簡単に実装してくれる便利なものです。
    その便利さと単なる好奇心から、これまで多数のプラグインを試してきました。
    導入しても使い勝手が悪いものも多く、その都度削除を繰り返してきて、現在21個のプラグインが入っています。
    中には何のために入れたか忘れてしまったプラグインもあり、これはちょっとまずい状況です。
    プラグインの入れ過ぎはデメリットが大きい。

    WordPressでプラグインを導入するときの心構えと、初心者におすすめの7つのプラグイン

    https://thewppress.com/basic/plugins-for-newbies/ 参照

    プラグインは更新がたびたびあって煩わしい上に、更新を怠るとそれもまた不具合の元です。
    当サイトも以前「WordPress Related Posts」の更新時に重大な不具合が起きたこともありました。
    ⇒「プラグインを使わないで、関連する投稿記事を表示する

    便利だからとプラグインを安易に導入するより、できるだけプラグイン無しで機能を実装できる方法を見つけていきたいと思います。Google先生の力を借りて。

    というわけで、今回、比較的簡単にできそうなものを見つけましたので、メモしておきます。

    (1)ページナビをプラグイン無しで作る

    これまでページ送りの表示にはプラグイン「WP-PageNavi」を使っていましたが、これをプラグイン無しで作る方法が下記サイトに書かれていました。

    「WordPressにプラグイン無しでページネーションを設置する方法」 

    https://coliss.com/articles/blog/wordpress/how-to-build-a-wordpress-post-pagination-without-plugin.html 「コリス

    ノーマル版と拡張版の二通り紹介されていますが、私はPagination without plugin:拡張版の方をまるっきりコピーして実装できました。興味のある方は「WordPressにプラグイン無しでページネーションを設置する方法」を参考になさってください。
    出来上がりは、こんな感じです。↓

    ページネーションを表示させる場所は、当サイトではテーマテンプレートの「index.php」のみにしました。

    (2)TOPへ戻るボタンをプラグイン無しで作る

    プラグイン「Royal Scroll to Top」を使って表示していた「トップへ戻るボタン」、これもプラグイン無しで作ることにしました。
    アフィリエイトで稼ぐ方法を全部話そうと思う」というサイトの下記記事が分かり易く、とても参考になりました。というか、サイト主さん自作のJavaScriptをそのまま(勝手に)使わせていただきました(ありがとうございます)。

     ページの先頭に戻るボタンを自作してみた 
     自作のJavaScriptをWordPressで利用する方法

    アフィリエイトで稼ぐ方法を全部話そうと思う」参照

    cssを少し書き換えて、丸いボタンを作りました。

    /* topへ戻るボタン */
    #scroll-top{ /* ボタンのデザイン */
    	background-color:#000; /* ボタンの背景色 */
    	color:#fff; /* ボタンの文字色 */
    	text-align:center; /* ボタン内の文字を中央に */
    	position:fixed; /* 画面がスクロールしても固定する */
    	right:100px; /* 固定する場所は右から100px */
    	bottom:20px; /* 固定する場所は下から20px */
    	display:none; /* ボタン表示は最初は非表示 */
    	margin:0 0; /* ボタンの余計な余白はいらない */
    	border-radius: 50%; /* 円形にする */
    	-webkit-border-radius: 50%; /* Safari,Google Chrome用 */
    	-moz-border-radius: 50%; 
    	cursor:pointer; /* カーソルを指のマークに */
    	opacity:0.6; /* ボタンの透明度 */
    	}
    	 
    	#scroll-top p{
    		font-size: 14pt;/* ▲のフォントサイズ*/
    		padding:16px;/* ▲の余白 */
    		text-decoration:none;
    		display:block;
    	}
    	 
    

    出来上がりはこんな感じです。↓

    パンくずリストをプラグイン無しで作る

    今回はプラグイン無しでパンくずリストを作ったので、備忘録としてメモしておきます。

    作成にあたって、とても分かり易い解説がされている下記サイトを参照いたしました。(感謝!)

    WordPress】パンくずリストをプラグイン無しで自作する方法

    オリジナルゲーム.com【WordPress】パンくずリストをプラグイン無しで自作する方法」参照

    作成手順は、

    1. 作業前に変更するファイルのコピーを取っておく(※これ、大事です)
    2. functions.phpにコードを追記する
    3. パンくずを表示させたいファイルにコードを追記する
    4. style.cssでスタイルを整える
    5. category.phpとtag.phpの二重表記を修正(必要があれば)

    2.functions.phpに追記したコード

    「【WordPress】パンくずリストをプラグイン無しで自作する方法」に掲載されている完成版を、まるっきりコピーして使用させていただきました。

    // ===========================
    // = パンくず =
    // ===========================
    function mytheme_breadcrumb() {
        	//HOME>と表示
        	$sep = '>';
        	echo '<li><a href="'.get_bloginfo('url').'" >HOME</a></li>';
        	echo $sep;
         
        	//投稿記事ページとカテゴリーページでの、カテゴリーの階層を表示
        	$cats = '';
        	$cat_id = '';
        	if ( is_single() ) {
        		$cats = get_the_category();
        		if( isset($cats[0]->term_id) ) $cat_id = $cats[0]->term_id;
        	}
        	else if ( is_category() ) {
        		$cats = get_queried_object();
        		$cat_id = $cats->parent;
        	}
        	$cat_list = array();
        	while ($cat_id != 0){
        		$cat = get_category( $cat_id );
        		$cat_link = get_category_link( $cat_id );
        		array_unshift( $cat_list, '<a href="'.$cat_link.'">'.$cat->name.'</a>' );
        		$cat_id = $cat->parent;
        	}
        	foreach($cat_list as $value){
        		echo '<li>'.$value.'</li>';
        		echo $sep;
        	}
         
        	//現在のページ名を表示
        	if ( is_singular() ) {
        		if ( is_attachment() ) {
        			previous_post_link( '<li>%link</li>' );
        			echo $sep;
        		}
        		the_title( '<li>', '</li>' );
        	}
        	else if( is_archive() ) the_archive_title( '<li>', '</li>' );
        	else if( is_search() ) echo '<li>検索 : '.get_search_query().'</li>';
        	else if( is_404() ) echo '<li>ページが見つかりません</li>';
        }
    

    3.パンくずリストを表示させたいファイルに追記するコード

    <div class="mytheme_breadcrumb">
        <?php mytheme_breadcrumb(); ?>
           </div>
    

    パンくずリストを表示させたいファイル
      ・single.php
      ・category.php
      ・tag.php

    コードを追記する位置は各ファイルの<div id=”content” role=”main”>の下になります。<div>のクラス名は任意。

    4.style.cssでスタイルを整える(一例:2021/03/27修正しました)

    /* パンくず */
    .mytheme_breadcrumb li {
        font-size: 90%;
        display: inline-block;   
    }
    

    5.category.phpとtag.phpの二重表記を修正

    私が使っているテンプレートでは、カテゴリーとタグページに元々パンくずが表示されていたので、二重表記になってしまいました。スタイルを統一するために
    category.phpとtag.phpのコードを一部削除しました。

    category.phpで削除したところ

    <h1 class="archive-title"><?php printf( __( 'Category Archives: %s', 'twentytwelve' ), '<span>' . single_cat_title( '', false ) . '</span>' ); ?></h1>
    

    tag.phpで削除したところ

    <h1 class="archive-title"><?php printf( __( 'Tag Archives: %s', 'twentytwelve' ), '<span>' . single_tag_title( '', false ) . '</span>' ); ?></h1>
    

    イラスト素材ブログ「アトコンのMe-time」を始めました。

    昨年2月から、フリー素材投稿サイト「イラストAC」に素材投稿を始めました。
    以前はフリー素材サイトからダウンロードして、チラシやバナーを作る素材利用者側だったのですが、adobe Illustratorにはまって、自分でも素材を作りたくなってきました。

    16ケ月経った現在、投稿数 150点。
    ダウンロード数は、国内と海外を合わせて合計 5,130 DL 。

    投稿数もダウンロード数も、まだまだ少ないです。
    とてもブログで友人に紹介できるものではなく、作成した素材も「見て見て!!」と自信を持って披露できるものでもなく、こっそりと匿名で投稿を続け、そのうち素敵な素材が描けるようになり、DLも劇的に増え、いつかは堂々とポートフォリオサイトを作るのだ、と心に決めていたのですが、、、、

    今月、イラストACサイトから「イラストAC以外のWebサイトに作品をアップしていると、著作者確認が取れて作品審査がスムーズに行えます」といった旨の案内があったので、思い切って作品サイトを作ることにしました。

    そのうち素敵な素材が描けるようになり、DLも劇的に増え、、、、なんて夢みたいなこと言ってないで、その時その時のありのままをさらけ出すことが、もしかしたら上達の道になるかもしれません。

    というわけで、これからは作成素材を「アトコンのMe-time」にアップしてから、イラストACに投稿することにします。
    時々でも、どなたか見てくだされば嬉しいです。

    プラグインを使わないで、関連する投稿記事を表示する

    WordPressには、標準装備以外の機能を追加してくれるプラグインが数多く配布されています。
    とても便利なのでついつい、あれもこれもとインストールしてしまいがちですが、メリットがあれば当然デメリットもあるわけで。
    プラグインを入れ過ぎるとアップデート作業も増えますし、めったにないことですがアップデートの際に重大な不具合を起こすリスクもあります。

    WordPress Related Postsのアップデートでエラー

    この前、WordPress Related Postsのアップデートで、そのめったにない不具合を経験しました。
    WordPress をバージョン 4.8 に更新して、そのあとWordPress Related Postsをバージョン 3.6.4 にアップデートしようと更新ボタンを押した途端、画面が真っ白!何も表示されない状態になってしまいました。
    管理画面も真っ白で入ることができず、私の頭の中も真っ白に!
    本来ならこんなトラブルの時こそ、エラーの原因を追究してスキルを上げるチャンスなのですが、真っ白な画面が恐ろしくて気持ちの余裕をなくし、すぐにFFFTPを立ち上げてサーバーからWordPress Related Postsを削除しました。
    それで一応問題なくサイトは復旧しました。

    あとから検索するとこのエラーに対して、解決法がネットにありました。
    原因は「PHPのバージョンが5.3以下だと作動しない」ことだそうです。

    参照サイト:

    【WordPress】関連記事プラグインRelated Postsエラーの解決方法

    プラグイン無しで関連投稿記事を表示させる方法

    WordPress Related Postsはバックアップを取ってあったので、旧バージョンをサーバーにアップし、そのまま使い続けていました。こんな感じで関連記事を表示させています。

    しかし、このプラグインのアップデートは当分できないので、この際、プラグインを使わず関連投稿記事を表示させてみることにします。

    以下のサイトを参照させていただきました。ありがとうございます!

    WordPressのサムネイルつき関連記事を表示する

    プラグインなしで関連記事を表示する方法[WordPressカスタマイズ]

    『WordPressのサムネイルつき関連記事を表示する』のコードでは、サムネイルの下にタイトルといった形で横並びに5個表示されます。
    プラグインなしで関連記事を表示する方法[WordPressカスタマイズ]』のコードでは、サムネイルの横にタイトルと記事の抜粋を表示し、それを10個縦に並べたスタイルになります。
    どちらも関連した記事を、ページを読み込むごとにランダムに表示させます。

    新規にテンプレートを作成する
    related-entries.php

    テーマ内にrelated-entries.phpというファイルを新規に作成します。
    コードは下記のようにしました。

    <?php
    //カテゴリ情報から関連記事を5個ランダムに呼び出す
    $categories = get_the_category($post->ID);
    $category_ID = array();
    foreach($categories as $category):
      array_push( $category_ID, $category -> cat_ID);
    endforeach ;
    $args = array(
      'post__not_in' => array($post->ID,'booklist'),
      'posts_per_page'=> 5,//表示させる個数
      'category__in' => $category_ID,
      'orderby' => 'rand',//ランダムに表示させる
    );
    $query = new WP_Query($args); ?>
      <?php if( $query -> have_posts() ): ?>
      <?php while ($query -> have_posts()) : $query -> the_post(); ?>
         
         <ul class="related-entry">
          <li class="related-entry-thumb">
      <a href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>">
            <?php if ( has_post_thumbnail() ): ?>
            <?php the_post_thumbnail(array(100,100)); //サムネイルのサイズ?>
            <?php endif; ?>
            </a>
          </li>
                 <li class="related-entry-title"> <a href="<?php the_permalink(); ?>">
              <?php the_title(); ?>
              </a></li>
        </ul>
    
      <?php endwhile;?>
      <?php else:?>
      <p>記事はありませんでした</p>
      <?php
    endif;
    wp_reset_postdata();
    ?>
    <br style="clear:both;">
    

    下記のコードをテーマのテンプレートの表示させたい所に挿入します。
    一般的にはsingle.phpに表示させるようです。

    
     <!-- 関連する投稿ここから -->             
                    
                <div id="related-entries">
      <h3>関連する投稿</h3>
      <?php include( TEMPLATEPATH . '/related-entries.php' ); ?>
    </div><!-- #related-entries --> 
         <!-- 関連する投稿ここまで -->  
    

    (※)今までWordPress Related Postsを導入していた場合は、テンプレートに記述してある以下のコードを必ず削除しましょう。

    <?php wp_related_posts()?>

    style.CSSのコードも書いておきます。あまり参考にならないかもしれませんが・・・
    (※ただ今cssを修正中です。)
    仕上がりはこんな感じです。5個の関連記事を横並びにしてみました。

    一つプラグインを減らすことができて、ちょっとスッキリです。と言いたいところですが、こんな記事を見つけました。

    【WordPress】プラグイン選びのポイント~悪いプラグインって何?

    私もプラグインをあれこれ入れてみては削除し、を繰り返してきたのでデータベースには相当ゴミがたまっているはず。次回は、溜まったゴミを削除するプラグインClean Optionsを試してみたい。

    WordPress4.4で掲示板を作る

    以前、「wordpressで掲示板を作る」にWordPressのコメントフォームを利用して掲示板を作る方法を紹介しました。

    コメントフォームをそのまま使うと、メールアドレスやウェブサイトの入力項目が表示されます。
    メールアドレスが入力必須項目となっていると、掲示板としては気軽にコメントしずらい気がします。
    かといって、WordPressのディスカッションの設定では、メールアドレスだけ必須項目から外すということができません。
    それで、テンプレートを少し書き直すことで、ウェブサイトの項目を削除し、メールアドレスを入力必須項目から外し、名前だけを必須にするようなフォームを作りたかったのです。

    WordPressのメジャー アップグレードの際には、その都度テンプレートのコードを書き直す、という手間さえかけてきたのですが、それが今回、WordPress4.4へのアップグレードからテンプレートの仕様が変わって、以前の方法が通用しなくなってしまいました。

    というわけで、何か他の方法はないかと検索したところ、なんと以前よりも簡単なカスタマイズをみつけましたのでメモしておきます。

    WordPress4.4で掲示板を作る

    掲示板を作成する手順は「wordpressで掲示板を作る」と同じです。
    手順②の「メールアドレスは入力必須項目から外し、webアドレスの入力フォームは削除する。」という部分を変更します。

    (A),(B)の2パターンメモしておきます。

    (A)名前は入力必須にして、メールアドレスは入力しなくても承認されるようにし、ウェヴサイトの項目は削除する場合

    keijibann01

    • WordPressのディスカッションの設定で、「名前とメールアドレスの入力を必須にする」のチェックを外します。(チェックを入れるとメールアドレスの項目にも必須マーク(*)が付いてしまうため。)
    • テーマのfunctions.phpに以下のコードを追加します。
    • 自動的に代替メールアドレスが表示されるようになります。
    
    //コメントフォームの変更
     
    // コメントからウェブサイトを削除
    function my_comment_form_remove($arg) {
    $arg['url'] = '';
    return $arg;
    }
    add_filter('comment_form_default_fields', 'my_comment_form_remove');
     
    
    //名前は必須項目にする
    
    function preprocess_comment_author( $commentdata ) {
     if ("" === trim( $commentdata['comment_author'] ))
     wp_die('お名前を入力して下さい。');
     return $commentdata;
    }
    add_filter('preprocess_comment', 'preprocess_comment_author', 2, 1);
    /* comment-template.phpの配列$argsのカスタマイズ */
    add_filter('comment_form_defaults', 'comment_form_customize_args');
    function comment_form_customize_args($args) {
     // コメントフォームの前の文言を変更
     $args['comment_notes_before'] = '
    
    お名前は必須項目です。
    メールアドレスが公開されることはありません。
    
    ';
     return $args;
    }
    
    //メールアドレス項目を入れたときの設定(未入力時は自動でメールアドレスを設定する)
    
    if (basename($_SERVER["REQUEST_URI"]) == "wp-comments-post.php") {
     if ($_POST['email'] == null || $_POST['email'] == '') {
     $_POST['email'] = 'guest@example.com';
     }
    }
    

    (B)名前を必須項目にして、メールとウェヴサイトの項目を削除する場合

    keijibann00

    • WordPressのディスカッションの設定で、「名前とメールアドレスの入力を必須にする」にチェックを入れます。(名前のところに必須マーク(*)を付けたいので)
    • テーマのfunctions.phpに以下のコードを追加します。
    
    //コメントフォームの変更
     
    // コメントからEmailとウェブサイトを削除
    function my_comment_form_remove($arg) {
    $arg['url'] = '';
    $arg['email'] = '';
    return $arg;
    }
    add_filter('comment_form_default_fields', 'my_comment_form_remove');
     
    
    /* comment-template.phpの配列$argsのカスタマイズ */
    add_filter('comment_form_defaults', 'comment_form_customize_args');
    function comment_form_customize_args($args) {
     // コメントフォームの前の文言を変更
     $args['comment_notes_before'] = '
    
     お名前は必須項目です。
    
    ';
     return $args;
    }
    
    //自動でメールアドレスを設定する(メールアドレス項目を削除した場合も設定する)
    
    if (basename($_SERVER["REQUEST_URI"]) == "wp-comments-post.php") {
     if ($_POST['email'] == null || $_POST['email'] == '') {
     $_POST['email'] = 'guest@example.com';
     }
    }
    

    以前はWordPress本体のテンプレートを2個書き直していましたが、今度はテーマのfunctions.phpに追加記述するだけなので、WordPressの メジ’ャー アップグレードのたびに書き直す必要がなくなり、ちょっと楽になりました。

    下記ブログを参考にさせていただきました。
    下記ブログを参照して、自分なりのカスタマイズを試してみることをお勧めします。

    IE8のレイアウト崩れは直ったみたいですが・・・

    20150705-0一昨日「ブラウザチェックツールを使ってみたらIE8で完全にアウトだった!!」に書いたように、「IEテスタ」をインストールしてIEのバージョン5.5~11をチェックしてみたところ(5.5と6は仕方ないとしても)8でもレイアウトが崩れていて愕然としました。
    レイアウトの崩れと言えば、やはりcssの書き方、特にfloat、margin、paddingの扱いに原因がありそうなので、cssを精査してみました。

    私のブログはWordPresssのデフォルトテーマ「Twenty Twelve」バージョン 1.7をカスタマイズして作成しているので、「Twenty Twelve」のcssと見比べながら、不要なfloatを見つけて削除し、それでも崩れが直らず焦りましたが、最終的には下図のようにbodyに

    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;

    を追記したところでレイアウト崩れが直りました。
    左側が「Twenty Twelve」のcss。右側が修正後の当ブログのcss。あれ?これで良かったのか?

    2015070703
    まあ、崩れが直ったんだからいいじゃないかって思いたいのですが、他にきちんとした対応の仕方があるのじゃないか?他のブラウザではもっと酷いレイアウト崩れを起こしているのではないか?と不安が募るのは私が知識不足である証拠です。
    この夏には、是非ともHtml5とcss3を学習しておきたい。

    それにしても、IEのバージョン格差は何とかならないものか?
    ブラウザに関しては世界統一を望みます。

    ブラウザチェックツールを使ってみたらIE8で完全にアウトだった!!

    20150705-4そろそろHTML5について本気で勉強しなければと本を購入しました。
    と、その前に久しぶりにブラウザチェックをすることに。
    Windows7を使い始め、ブラウザをGoogle Chromeに変えてからというもの、IEの存在を忘れつつありました。
    しかしWeb上ではまだまだIEを使っている人が多いはず。そこでIEに特化したブラウザチェックツールを手に入れることに。

    「IEなどの複数のブラウザチェックができる便利な無料ツールまとめ (NESTonline Blog)参照」

    上記サイトで紹介されていた、無料ソフトIEテスタ」をインストールしてみました。
    これがなかなかの優れもので、IE5.5~11まで一括して動作確認ができます。
    ダウンロードサイトはこちら → http://www.my-debugbar.com/wiki/IETester/HomePage

    下図がIEテスタ」上の表示画面です。

    20150705-1

    予想していたことですが、IE5.5と6ではレイアウトがガチャガチャに崩れていて観れたもんじゃありませんでした。でももう対応する能力がなくIE6以前については諦めることにしました。
    しかし、残念なことにIE8でも下記図のごとく崩れていました。
    いつからこんな姿になっていたのか?
    Windows XPのサポートが終了しているとは言え、IE8を使っている人は多いと思われるので何とかしなければと思うのですが、今日のところはどこをどう修正したらよいのか分からずじまい。
    しばらくは御見苦しい姿をさらしたままということになりそうです。

    20150705-0

    こちらは携帯やタブレットなどの表示を確認できるサイト「Responsive Design Testing」です。インストール無し、登録不要、web上で無料で利用できます。お手軽ですね。
    20150705-2

    WP”カスタム投稿タイプ”を使ってブログを複数追加する

    WordPressには「投稿タイプ」と「固定ページタイプ」の2種類のコンテンツがあります。
    ブログや更新情報、商品情報などのように、常に記事や情報を追加して、ページが増えていくような場合は「投稿タイプ」を使用し、プロフィールや、お問い合せ欄などのように、1枚のページで収まるような場合は「固定ページ」と、使い分けするようになっています。
    「固定ページ」は何個でも新規追加できますが、「投稿タイプ」は1個のWordPressに1個が標準装備です。
    通常、ブログ機能は1つしかない。1つじゃ物足りないと思ったことはありませんか?

    ブログを複数持ちたい場合は、「WordPressのマルチサイト機能で複数サイトを作る」という手もありますが、新たにWordPressをインストールしたくはない、既に運用しているWordPressに別個のブログをちょっと増やしたいだけ、という場合「カスタム投稿タイプ」が簡単で便利です。

    というわけで、固定ページタイプで作成した「読書リスト」ページを、「カスタム投稿タイプ」を使って、ブログ形式のページに作り直してみました。単に「カスタム投稿タイプ」を使ってみたいという好奇心だけでやってみましたので、「カスタム投稿タイプ」を作成する一例として、参考程度にご覧ください。

    1. 「カスタム投稿タイプ」を利用してブログを一つ追加する。
    2. 「カスタム投稿タイプ」のカテゴリーを設定できるようにする。
    3. 「カスタム投稿タイプ」を表示させる固定ページを作成する。
    4. カテゴリー別の一覧ページが表示されるようにする。
    5. 「カスタム投稿タイプ」を利用してブログを複数追加する。
    6. 「投稿が見つかりません」とか「404エラー」画面が表示された場合の対処法

    1.「カスタム投稿タイプ」を利用してブログを一つ追加する。

    functions.phpに以下のコードを追記します。
    下記の「booklist」と「読書リスト」という記述は全て、任意の名前に置き換えてください。

    // ===========================
    // = カスタム投稿 =
    // ===========================
    function new_post_type(){
     //読書リストページ
     register_post_type(
     'booklist',
     array(
     'label' => '読書リスト',
     'public' => true,
     'hierarchical' => false,
     'has_archive' => true,
     'supports' => array(
     'title',
     'editor',
     'thumbnail',
     'excerpt'
     ),
     'menu_position' => 5
     )
     );
    }
    add_action('init', 'new_post_type');
    
    
    7行目のbooklist 英数半角の任意の名前。あとから変更するのは面倒なので、最初できっちり決めておく。
    label 任意の名前。日本語でOK。管理画面のメニューに表示される。
    public 公開、編集の項目
    has_archive trueにするとarchiveが自動的に生成される。
    supports 記事編集画面に表示する項目。ここでは、「タイトル」、「本文」、「アイキャッチ画像」、「抜粋」の4項目を指定している。
    menu_position 管理画面のメニューに表示する位置。5は「投稿」の下の位置を指定している。
    ‘menu_position’ で位置指定する数値について

    • 5 – 投稿の下
    • 10 – メディアの下
    • 15 – リンクの下
    • 20 – 固定ページの下
    • 25 – コメントの下
    • 60 – 最初の区切りの下(コメントの下に区切りがある)
    • 65 – プラグインの下
    • 70 – ユーザーの下
    • 75 – ツールの下
    • 80 – 設定の下
    • 100 – 二つ目の区切りの下(設定の下に区切りがある)
      WordPress Codex 日本語版関数リファレンス/register post type」参照

    参考サイト:

    上記のコードを追加してfunctions.phpをサーバーにアップすると、管理画面のメニューに「読書リスト」の項目が表示されます。
    custom01
    カスタム投稿の投稿編集ページは下図ようになります。
    custom03-1

    2.「カスタム投稿タイプ」のカテゴリーを設定できるようにする

    functions.phpに、さらにコードを追記します。
    ”タクソノミーの作成”以下がカテゴリーを設定できるようにするコードです。

    // ===========================
    // = カスタム投稿 =
    // ===========================
    function new_post_type(){
     //読書リストページ
     register_post_type(
     'booklist',
     array(
     'label' => '読書リスト',
     'public' => true,
     'hierarchical' => false,
     'has_archive' => true,
     'supports' => array(
     'title',
     'editor',
     'thumbnail',
     'excerpt'
     ),
     'menu_position' => 5
     )
     );
     //タクソノミーを作成
     register_taxonomy(
     'booklist_cat',
     'booklist',
     array(
     'label' => '読書リストカテゴリー',
     'labels' => array(
     'popular_items' => 'よく使う読書リストカテゴリー',
     'edit_item' => '読書リストカテゴリーを編集',
     'add_new_item' => '新規読書リストカテゴリーを追加',
     'search_items' => '読書リストカテゴリーを検索',
     ),
     'public' => true,
     'hierarchical' => true,
     'rewrite' => array('slug' => 'booklist_cat')
     )
     );
     }
    add_action('init', 'new_post_type');
    

    booklist_catは1.で決めた任意の名前のうしろにcatをつけたものです。booklistcatと書いてもOKです。
    コードを追記してfunctions.phpをサーバーにアップすると、下図のように、管理画面の「読書リスト」メニューに、「読書リストカテゴリー」の項目が表示されます。custom02-1カスタム投稿の投稿編集ページにもカテゴリーの項目が表示されます。
    custom02-2

    3.「カスタム投稿タイプ」を表示させる固定ページを作成する。

    カスタム投稿タイプのarchivesページを表示させる方法は、いろいろあるようですが、ここでは専用の固定ページを作成して表示させることにします。
    page-book.phpというように、page-任意の名前.phpというテンプレートを作成します。
    page-book.phpの1行目にはテンプレートネーム(任意)を記述します。

     <?php /** The template name:booklist */ 

    【page-book.phpの記述一例】
    divのidやクラス名などは任意の名前に置き換えてください。

    <?php
    /**
     The template name:booklist
     */
    get_header(); ?>
     <div id="primary" class="site-content">
     <?php if ( have_posts() ) : ?>
     <?php /* Start the Loop */ ?>
     <?php query_posts( 'post_type=booklist&posts_per_page=10' ); ?>
     <?php while ( have_posts() ) : the_post(); ?>
     <a href="<?php the_permalink(); ?>"></a><?php echo get_the_term_list( $post->ID, 'booklist_cat', 'Category: ','・','' ); ?>
     <?php get_template_part( 'content', 'page' ); ?>
     <?php endwhile; // end of the loop. ?>
     <!-- ページナビここから -->
    <nav class="nav-single">
     <span class="nav-previous"> <?php previous_post_link('前の投稿', TRUE); ?><br/>
     <?php
     $prevPost = get_previous_post(true); //前の記事データを取得
     previous_post_link( '%link', $prevThumbnail.'%title' ); //出力
     ?></span>
     <span class="nav-next"><?php next_post_link('次の投稿', TRUE) ?><br/>
    <?php
     $nextPost = get_next_post(true); //次の記事データを取得
     next_post_link( '%link', $nextThumbnail.'%title' ); //出力
     ?></span> </nav>
     <!-- ページナビここまで -->
     <?php endif; // end have_posts() check ?>
     </div><!-- #primary -->
    <?php get_sidebar(); ?>
    <?php get_footer(); ?>
    

    ループ内の下記コードは、1ページに表示する最大投稿数を設定するコードを記述しています。上記の例では1ページに投稿を10件表示するよう設定しています。

    <?php query_posts( 'post_type=booklist&posts_per_page=10' ); ?>
     

    ループ内の下記コードは、カスタム投稿のカテゴリー表示をしています。

    <a href="<?php the_permalink(); ?>"></a><?php echo get_the_term_list( $post->ID, 'booklist_cat', 'Category: ','・','' ); ?>
    

    プラグインWP-PageNaviを導入している場合は、ページナビの部分を下記コードに置き換えてもOKです。

    <?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); } ?>
    

    page-book.phpテンプレートを作成してサーバーにアップしたら、管理画面で任意の名前の固定ページを追加します。
    タイトルだけ入力し、本文は空白のままで構いません。
    テンプレートの選択項目はpage-book.phpの冒頭に記述したテンプレート名を選択します。

    cusutom000もし、カスタム投稿のテンプレートを選択しても何故かデフォルトテンプレートに戻ってしまうというエラーが起きた場合、実際私は経験してしまったのですが、そのような場合の原因と対処法が下記サイトに書かれていて、助かりました。

    既存のブログとは異なるデザインのページにしたい場合は、カスタム投稿専用のテンプレートを作成します。

    • archive-カスタム投稿名.phpを作成する。(例:archive-booklist.php)
    • single-カスタム投稿名.phpを作成する。(例:single-booklist.php)
    • cssでスタイルを整える。

    必要ならば、headerやfooter、sidebarなども、専用テンプレートを作成してarchive-カスタム投稿名.php、single-カスタム投稿名.phpに読み込ませたら良い、と私は思っていましたが、検索しているうちに、「条件分岐タグ」を使えば、もっとすっきりとカスタマイズできる、と解説しているサイトに行き当たりました。

    下記サイトではカスタム投稿を index.php に表示する方法についても書かれています。

    4.カテゴリー別の一覧ページが表示されるようにする。

    カテゴリーをクリックするとタイトルの一覧ページが表示できるテンプレートを作成してみます。
    テンプレートは、taxonomy-カスタム投稿名cat.phpです。

    【taxonomy-booklist_cat.phpの一例】
    archive-カスタム投稿名.phpを作成していたら、それを複製して名前を変更するだけでもよいようです。

    <?php get_header(); ?>
    <div id="primary" class="site-content">
    <?php if(have_posts()): while(have_posts()): the_post(); ?>
    <div class="book">
    <?php echo get_the_term_list( $post->ID, 'booklist_cat', 'Category: ','・','' ); ?>&nbsp;&nbsp;&nbsp;<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
    </div>
    <?php endwhile; endif; ?>
    </div>
    <?php get_sidebar(); ?>
    <?php get_footer(); ?>
    

    タイトル一覧が表示されます。
    cusutom-last
    タイトルだけでなく、投稿内容も表示したい場合は、下記コード部分を

    <?php echo get_the_term_list( $post->ID, 'booklist_cat', 'Category: ','・','' ); ?>&nbsp;&nbsp;&nbsp;<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
    

    下記のように置き換えると投稿内容も表示されるようになります。

    <?php echo get_the_term_list( $post->ID, 'booklist_cat', 'Category: ','・','' ); ?>
    <?php get_template_part( 'content', 'page' ); ?>
    

    5.「カスタム投稿タイプ」を利用してブログを複数追加する。

    functions.phpに以下のようにコードを追記します。
    二つ目のカスタム投稿の「document」、「ドキュメント」も任意の名前に置き換えてください。

    // ===========================
    // = カスタム投稿 =
    // ===========================
    function new_post_type(){
     //読書リストページ
     register_post_type(
     'booklist',
     array(
     'label' => '読書リスト',
     'public' => true,
     'hierarchical' => false,
     'has_archive' => true,
     'supports' => array(
     'title',
     'editor',
     'thumbnail',
     'excerpt'
     ),
     'menu_position' => 5
     )
     );
     //ドキュメント
     register_post_type(
     'document',
     array(
     'label' => 'ドキュメント',
     'public' => true,
     'hierarchical' => false,
     'has_archive' => true,
     'supports' => array(
     'title',
     'editor',
     'thumbnail',
     'excerpt'
     ),
     'menu_position' => 5
     )
     );
     //タクソノミーを作成
     register_taxonomy(
     'booklist_cat',
     'booklist',
     array(
     'label' => '読書リストカテゴリー',
     'labels' => array(
     'popular_items' => 'よく使う読書リストカテゴリー',
     'edit_item' => '読書リストカテゴリーを編集',
     'add_new_item' => '新規読書リストカテゴリーを追加',
     'search_items' => '読書リストカテゴリーを検索',
     ),
     'public' => true,
     'hierarchical' => true,
     'rewrite' => array('slug' => 'booklist_cat')
     )
     );
     //タクソノミーを作成
     register_taxonomy(
     'document_cat',
     'document',
     array(
     'label' => 'ドキュメントカテゴリー',
     'labels' => array(
     'popular_items' => 'よく使うドキュメントカテゴリー',
     'edit_item' => 'ドキュメントカテゴリーを編集',
     'add_new_item' => '新規ドキュメントカテゴリーを追加',
     'search_items' => 'ドキュメントカテゴリーを検索',
     ),
     'public' => true,
     'hierarchical' => true,
     'rewrite' => array('slug' => 'document_cat')
     )
     );
     }
      add_action('init', 'new_post_type');
    

    コードを追記してfunctions.phpをアップロードすると、管理画面に「ドキュメント」の項目が追加されます。
    cusutom001

    6.「投稿が見つかりません」とか「404エラー」画面が表示された場合の対処法

    カスタム投稿で作成した記事をプレビューすると、「投稿が見つかりません」といった画面が表示されたりします。この場合、管理画面の「設定」にある「パーマリンクの設定」を更新してみると、表示されるようになります。functions.phpのコードを修正したら、その都度パーマリンクの設定を更新した方が良いようです。

    参照サイト:

    wordpressbookjpg

     

    以前「wp自作テーマでショップをリニューアルしました。」で紹介しました「WordPress3.X 現場のワークフローで覚える ビジネスサイト制作 / MdN(エムディエヌコーポレーション) ハヤシ ユタカ著」を、手元に置いて参考にしつつ、ネット検索で下記のサイトを参照させていただきました。

    <参考サイト>

    RSSフィードから更新タイトルと日付を取得して更新情報を表示する

    htmlページなどに、ブログの更新情報を表示する方法をメモしておきます。

    当サイトでは、トップページ(htm)に、ブログやギャラリーの新規投稿記事のタイトルと日付が自動更新されるように設定しています(下図の赤線枠部分)。
    これはGoogleの提供するGoogle AJAX Feed APIを利用して、RSSフィードを読み込むというものです。

    toppage

    私が表示したい更新情報のスタイルは、

    日付 ..記事のタイトル

    とシンプルなものですが、取得したいRSSフィードは6個。数が多いので、スクリプトコードはhtmに直接記述せず、外部ファイルとして読み込むことにしました。

    私なりの手順は以下の通り。

    1. Feedを取得するコードを記述したJavaScriptファイルを6個作成し、一つのフォルダに入れる。
    2. 更新情報を表示したいhtmlページの<head>~</head>にGoogle AJAX Feed APIと6個のjsファイルを読み込むコードを記述する。
    3. 更新情報を表示したいページの<body>~</body>にFeedのIDを記述。
    4. cssでレイアウトを整える。

    1.JavaScriptファイルのコード

    
    // Feed1のコード
    google.load("feeds", "1");
    
    function initialize() {
    var feed = new google.feeds.Feed("表示させるRSSフィードのURL");
    feed.setNumEntries(表示させたい件数);
    feed.load(function(result) {
    if (!result.error) {
    var container = document.getElementById("feed1");
    for (var i = 0; i < result.feed.entries.length; i++) {
    var entry = result.feed.entries[i];
    var dd = new Date(entry.publishedDate); // now
    var yearNum = dd.getYear();
    if (yearNum < 2000) yearNum += 1900;
    var m = dd.getMonth() + 1;
    if (m < 10) {m = "0" + m;}
    var d = dd.getDate();
    if (d < 10) {d = "0" + d;}
    var date = yearNum + "." + m + "." + d + " ";
    container.innerHTML += "<li><span>" + date +" </span>" +"...<a href='" + entry.link + "' target='_blank'>" + entry.title + "</a></li>";
    }
    }
    });
    }
    google.setOnLoadCallback(initialize);
    

    上記のコードの「表示させるRSSフィードのURL」とfeedのIDナンバー部分を2,3,4・・・と書き換えて、6個のJavaScriptファイルを作成。

        IDナンバーは、ここを書き換える。↓
    google.load(“feeds”, “2“);
    var container = document.getElementById(“feed2“);

    それぞれfeed1.js、feed2.js・・・と名前を付けてフォルダに保存する。フォルダ名はjsとした。

    2.<head>~</head>

    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    <script type="text/javascript" src="feed1.jsまでのパス"></script>
    <script type="text/javascript" src="feed2.jsまでのパス"></script>
    <script type="text/javascript" src="feed3.jsまでのパス"></script>
    <script type="text/javascript" src="feed4.jsまでのパス"></script>
    <script type="text/javascript" src="feed5.jsまでのパス"></script>
    <script type="text/javascript" src="feed6.jsまでのパス"></script>
    

    htmの<head>部分に、外部ファイルを読み込むコードを記述します。

    3.<body>~</body>

    <body>部分の更新情報を表示したい箇所にFeedのIDを記述します。

    <ul id="feed1"></ul>
    <ul id="feed2"></ul>
    ・・・・以下略
    

    4.cssでレイアウトを整える。

    必要に応じて、cssでレイアウトを整えます。

     下記のサイトを参照させていただきました。

    参照したサイト:「サイトに外部ブログのRSSを表示する方法と、記事タイトルが長すぎる場合に省略表示する方法メモ。」(http://webimemo.com/web/3873

    日付やタイトルだけでなく、 記事内容や概要、画像なども表示したい場合は下記サイトを参考にされるといいと思います。

    ブログのRSSを読み込んで新着記事を表示!Google AJAX APIを使ってみました」(http://kana-lier.com/javascript/google_ajax_rssfeed/

    WordPressをローカル環境で動かすWordPress Portable

    WordPress Portable(ワードプレスポータブル)というのがあるそうです。
    XAMPPと同じように、WordPressをローカル環境で動かすことができる、WordPress専用のアプリケーションです。
    WordPressのカスタマイズには、レンタルサーバーにアップする前に、ローカル(自分のPC内)でテストできる環境がある方が、断然便利で安全です。
    WordPress PortableはXAMPPより設置が簡単、データベースの設定も不要だそうです。
    ただし、マックには対応していないらしい。

    001私もどんなものなのか試してみたかったのですが、 既にXAMPPを導入している場合、まずXAMPPをアンインストールしなければならないようなので、WordPress Portableの設置は諦めました。
    WordPressユーザーで、まだローカル環境の構築をしてない方は、 試す価値があると思いますので、紹介してみました。
    興味のある方は、下記サイト等を参考にしてみてください。

    XAMPP をver.1.8.2 にアップグレードする

    WordPressをカスタマイズするには、自分のPCにサーバー環境があった方が断然やりやすい。サーバー環境を構築してくれるXAMPPは、多くの人に利用されている、お勧めできるフリーソフトです。ザンプと読むらしい。

    Apache(Webサーバ)、MySQL(SQLデータベースサーバ)とWebプログラミング言語であるPHPや同目的で使われる>Perlの4つの主要ソフトウェアとphpMyAdminなどの管理ツール、さらにSQLiteなど、いくつかの補助的なソフトウェアとライブラリモジュールが含まれている。(XAMPP – ウィキペディアより)

    私が初めてXAMPPをインストールしたのは、2010年のこと。「ヘッダーやフッターを共有する」から始まる長い話」に書いたとおり、四苦八苦してようやくバージョンは1.7.3をインストールしました。
    2011年には、ver,1.7.4にバージョンアップするつもりが「xampp最新版インストール覚書」に書いたように、結局ver,1.7.3のままで終わったという、情けない私。
    そんなド素人の私でも、これまで毎日XAMPPを活用してきて、私のPCには必要不可欠なソフトウェアとなっています。
    WordPressもどんどん進化しているし、そろそろ、XAMPPもバージョンアップしなければならない時ではないか?
    というわけで、今回XAMPPを最新版ver.1.8.2にアップグレードすることにしました。

    参考にさせていただいたサイトは「プログラミングブログ」の「XAMPP 1.8.0へのアップグレード手順メモ」です。

    1. 1.現在使用中のXAMPPのバックアップをとる。
    2. 2.XAMPPのサイトから最新バージョンをダウンロードする。
    3. 3.XAMPPのコントロールパネルを起動する。
    4. 4.XAMPPのセキュリテイの設定をする。
    5. 5.バックアップの復元
    6. ドリームウィバーのエラー修正

    1.現在使用中のXAMPPのバックアップをとる。

    現在使用中のXAMPPのフォルダ名を「XAMPP1.7.3」とリネームして、そのままCドライブ直下に保存しておきます。

    2.XAMPPのサイトから最新バージョンをダウンロードする。

    http://www.apachefriends.org/jp/xampp-windows.html#2671にアクセスして、「XAMPP Windows版 1.8.2」のZIP アーカイブ をダウンロードしました。
    xampp-0ネット環境のせいばかりではないかもしれませんが、ウチは〝光"じゃないので、ダウンロードに60分くらいかかりました。
    ダウンロードしたzipファイルを解凍して、「XAMPP」のコピーをCドライブの直下に置きます。

    3.xamppのコントロールパネルを起動する。

    「XAMPP」を開いてxampp-control.exeをダブルクリックし、実行します。

    アメリカ国旗とドイツ国旗が表示されますが、アメリカ国旗にチェックが入っていることを確認して、「save」ボタンをクリックします。

    コントロールパネルが立ち上がります。
    (※旧式のコントロールパネルが利用できるというxampp-control-old.exeは、ver.1.8.2には見当たりませんでした。)
    xampp-1

    コントロールパネルで「Actions」の「Start」ボタンをクリックして、ApacheMySQLFileZillaを起動させます。この時、新しいプログラムへのアクセス許可を求めるウィルスセキュリテイのメッセージが出たので、「許可する」をクリックします。
    xampp-2

    http://localhost/xampp/にアクセスしてXAMPPページを開きます。

    xampp-3

    「日本語」をクリックして、XAMPPの〝ようこそージ”を開きます。

    xampp-4

    4.XAMPPのセキュリテイの設定をする。

    左側のメニュー項目から「セキュリテイ」をクリックすると、下記のようなページが開きます。
    xampp-5

    ページに表示されているリンクhttp://localhost/security/xamppsecurity.phpにアクセスして、セキュリテイ設定ページを開きます。

    MYSQL 項目: “ROOT” のパスワードを設定し、「パスワードを変更しました」ボタンをクリックします。

    XAMPPのディレクトリ制御 (.htaccess)のユーザーとパスワードを設定し、「安全なXAMPPディレクトリを作成してください。」ボタンをクリックします。

    ※参考にさせていただいた「プログラミングブログ」の「XAMPP 1.8.0へのアップグレード手順メモ」では、ここで「外部からのアクセスを禁止する」ために、c:/xampp/apache/conf 内にある httpd.confを修正し、c:/xampp/php/php.iniでsafe_modeをOn に変更していますが、httpd.confファイルは、ver.1.7.3とver.1.8.2とでは書かれているコードが異なりますので、ver.1.7.3と同様には修正できないようです。試してみましたが、「アクセス権限がありません」という403エラーが出てしまい、ローカルのウェブサイトが開けませんでした。その辺の知識が無い私には手に余るので、修正するのはやめました。
    私はルーターを使っているから、外部からのアクセスには、まあ安心かと思うのですが、これも自信薄。xamppのver.1.8.2で、外部からのアクセスを禁止する方法を紹介してくれるブログが見つかるのを待つことにします。

    設定が完了したら、コントロールパネルでApacheMySQLを「stop」させ、再び「Start」ボタンをクリックして、再起動させます。

    再びhttp://localhost/xampp/にアクセスすると、パスワード入力画面が表示されます。
    セキュリティー設定の「XAMPPのディレクトリ制御 (.htaccess)」で設定した、ユーザー名とパスワードを入力して、XAMPPページを開きます。左側のメニュー項目からセキュリテイページを開き、ステータスが「安全」になっていることを確認します。
    xampp-6

    5.バックアップの復元

    コントロールパネルでApache、MySQL、FileZilla、Mercury、などを「stop」ボタンで停止させます。

    旧バージョンのXAMPP1.7.3フォルダから、以下のファイルをコピーして、最新バージョンのXAMPPフォルダにペーストします。

    ①バックアップしておいたxampp-1.7.3のhtdocsに置いてある自分のウェブサイトのフォルダを、アップグレードしたxamppのhtdocsにコピーします。

    ②バックアップしておいたxampp-1.7.3のMercuryMailから、アップグレードしたxamppのMercuryMailに上書きします。(※私の場合は必要なさそうな気がするが、、、)

    ③バックアップしておいたxampp-1.7.3のmysql/dataから、アップグレードしたxamppのmysql/dataに上書きします。

    ※「バックアップしておいたxampp-1.7.3のFileZillaFTPから、アップグレードしたxamppのFileZillaFTPに上書きする」を実行したところ下記図のように「匿名のユーザのFTPパスワードが『wampp』のままです。」として、ステータスが「要注意」になってしまいました。xampp-7そこで上書きしたFileZillaFTPを削除して、ver.1.8.2のFileZillaFTPをコピーし直したら、FileZillaFTPのステータスも「安全」と表示されるようになりました。

    コントロールパネルでApache、MySQL、FileZilla、Mercuryなどの「start」ボタンをクリックして起動させ、ローカルホストの自分のウェブサイトにアクセスして、正常に表示されることを確認します。

    ドリームウィバーのエラー修復

    どの段階で、何が災いしたのか分かりませんが、何度目かに開こうとしたDreamweaverが起動しなくなりました。画面はまったく真っ白の状態。
    あれれ?さっきまで、なんてことなく開いたのに~と思っても、開かないものは開かない。

    アドビサイトのDreamweaverヘルプに「ユーザー設定フォルダーを再作成する方法(Dreamweaver CS4/CS5/CS5.5/CS6)」という文書がありました。

    • ・Dreamweaver の起動時にエラーが表示される。
    • ・クラッシュまたは予期しない動作をする。

    という場合の対処法です。手順は以下の通り。

    Dreamweaver を終了します。
    以下のフォルダーを開きます。

    • Windows XPの場合
      C:\Documents and Settings\<ユーザー名>\ApplicationData\Adobe\Dreamweaver <バージョン>\ja_JP\Configuration フォルダーを開き、Configurationの名前を ConfigurationOld に変更します。

    上記のとおりにすると、新しいConfigurationフォルダが自動生成されます。
    再度Dreamweaverを開くと正常に起動しました。なーんだ、簡単!と思ったのもつかの間、Dreamweaverを終了して、もう一度開こうとすると、今度はファイルのスキャンのようなものが始まり、それがなかなか終わらず、挙句に途中でフリーズしてしまう。
    タスクマネジャーを立ち上げて見ると、プログラムが応答していない状態になっている。プログラムを強制終了して、もう一度Dreamweaverを開こうとすると、また、スキャンが始まり、フリーズしてしまい、またまた焦ってしまいました。
    再々度Dreamweaverを開こうとすると、やっぱりファイルのスキャンなのか読み込みなのかが始まったので、今度は強制終了をせず、画面に表示されている「停止する」ボタンをクリックすると、あっけなくスキャンが停止され、Dreamweaverがするっと起動しました。何だ、これは?ってよく分かりませんが、ともかくその後エラーもなく、Dreamweaverは正常起動するようになりました。
    XAMPP1.8.2はコントロールパネルの動きが、旧バージョンに比べてとてもスムーズです。

    次回のアップグレードでは、もっとスマートに作業が完了できるようになっていたいものです。

    2016.4.21【追記】ご注意ください!

    xamppの最新バージョンは2016年4月現在、ver.5.6.19です。
    xamppは2015年7月(ver.5.6.11)から、仕様がずいぶん変わってしまったようです。
    上記方法で最新バージョンをアップデートしようとしたところ、ローカルでファイルの編集や表示はできるのですが、データベースが開けなくなってしましました。

    これは新バージョンのせいなのか、私のデータベースが壊れているせいなのか(その可能性もある)、私にはよくわかりません。
    結局最新バージョンをインストールし、下記ブログを参考にしてパスワードの設定をしました。
    データベースも新規に作成しなおし、Wordpressも新規にインストールして、テーマや投稿のデータをバックアップから復元するという、結構な手間をかけました。

    最新版をインストールしたい方は下記ブログを読んでからにしたほうがいいでしょう。

    参考ブログ
    「2015年7月からXAMPPの導入手順が分かりにくくなりました!対応の方法」
    「【XAMPP】2015年10月から導入手順がまた難解に!対応の方法!securityが無い!」

    wpプラグインWP-DBManager(lolipopサーバー編)

    ロリポップレンタルサーバーがサイバー攻撃され、私のブログも文字化けやなんか、ひどい目にあったことは「ハッカー攻撃に早まって・・」に書いた通りです。
    まあ、実際は私の処置対応がまずかったために、画像データを全て失ってしまい、ブログを一気に復活させることができなくなったわけですが。
    しかし、転んでもただでは起きませんよ。データベースをかなり弄り回したおかげで、データーベースについて理解できたことが多く、次回からはインポートも間違わずにできるはず。
    何はともあれ、データベースのバックアップは頻繁にとっておきましょう。
    そこで、何といっても役に立つのがデータベースのバックアップを自動で行ってくれるプラグイン、WP-DBManagerです。
    バックアップを自動で行ってくれるばかりでなく、メールで定期的に送信もしてくれます。
    これならバックファイルを無くす心配もありませんね。

    なお、2013年9月現在WordPressのヴァージョンは3.6を使用。
    WP-DBManagerはバージョン 2.63をインストールしました。

    WP-DBManagerのインストール

    プラグインのインストール手順は次の通り

    • 1.管理画面の項目から「プラグイン」を開く
    • 2.プラグインの「新規追加」をクリック
    • 3.プラグインの「検索ボックス」にプラグイン名を入力
    • 4.表示されたプラグインの「いますぐインストール」をクリック
    • 5.「プラグインを有効化」をクリック

    しかし、有効化したところ管理画面の上部に下記のような警告が出ました。

    Your backup folder MIGHT be visible to the public
    To correct this issue, move the .htaccess file from wp-content/plugins/wp-dbmanager to /home/users/0/lolipop.jp-dp22138636/web/wordpress/wp-content/backup-db

    有効化しただけでは作動しないようです。

    WordPress超初心者講座>> WP-DBManager(データベース・バックアッププラグイン)」を参照すると、以下の作業が必要だと分かりました。

    FTPソフトなどで【wp-content/plugins/wp-dbmanager】フォルダにアクセスします。ここに、「htaccess.txt」という名前のファイルがあります。
    これを【wp-content/backup-db】フォルダに移動させて、ファイル名を「.htaccess」に変更してください。
    WP-DBManager(データベース・バックアッププラグイン)参照

    上記のとおり「backup-db」フォルダに「.htaccess」をアップロードすると、警告も消えてなくなりました。

    WP-DBManagerの日本語化ファイル

    1年前にファイルを入手したサイトにアクセスしてみると、現在ではダウンロードページが無くなっていました。私のPCには保存したファイルがあるのですが、それを勝手に配布するわけにはいかないので、何とか作者サイトにいけないものかと検索してみました。
    ネット上にはバージョンの古いものはたくさんあるのですが、作者名を表記しているものが無く、なんとなく作者不詳といった感じです。
    私が保存しているものより新しいファイルを配布しているサイトがありました。

    13サポサイフロー WP-DBManager Ver.3
    WP-DBManagerの日本語化ファイルのインストール方法
    上記サイトからダウンロードした2個のファイルwp-dbmanager-ja.moとwp-dbmanager-ja.poをwp-dbmanagerフォルダの中にアップロードします。

    WP-DBManagerは日本語化ファイルが無いとすごく困る、というほどではありません。もちろん英語が堪能な人には全く不要なものです。出所がはっきりしないものは避けたい方は、使用しなくても問題ないと思います。私のような者にとっては、画面が日本語表記であるというだけで、ストレス軽減です。

    01データベースの項目が、次のように日本語化されました。

    02

    [データベースバックアップ画面]
    05[バックアップデータベースの管理画面]
    06[SQLクエリ実行画面]
    07jpg[データベースオプション]
    08jpg[アンインストール画面]
    09jpg

     サーバーがlolipopでエラーが出た場合

    前回(2012年4月)のインストールでは、上記までの設定でデーターベースのバックアップができるようになるかと思いきや、データベースバックアップ画面にエラーメッセージが出ました。

    エラーメッセージの内容は以下のとおり。(日本語がちょっとおかしなところがあります)

    MYSQLのダンプパスを確認中 …
    MYSQLのダンプパスが存在しません。オプションからパスの確認を行ってください。詳細が不明ながあいはサーバ管理者にお問い合わせください。

    MYSQLパスの確認中 …
    MYSQLパスは存在しません。オプションからパスの確認を行ってください。詳細が不明ながあいはサーバ管理者にお問い合わせください。

    mysqldumpとmysqlへのフルパスはDBオプションの設定で自動的に取得されて表示できているのに、 何故か認識してくれませんでした。
    検索してみると「アフィリエイトで稼ぐ為のWordPressアクセスアップ術」>>「ロリポップでのWP-DBManagerの設定方法」に解決法が紹介されていました。
    それによると、ロリポップ側のphp.iniの設定を変更する必要があるようです。

    「php.iniの設定」の「safe_mode」という項目がOnになっていると思いますので、これをOffにする
    「ロリポップでのWP-DBManagerの設定方法」参照

    これでやっと正常にデーターベースのバックアップができるようになりました。

    そうして、あれから1年余り。メールに頻繁にバックアップデータが送られてくるのが鬱陶しくなり、いつしか便利な〝メール送信オプション”を停止してしまい・・・・・・今回の憂き目に遭ったという次第で・・・・全く油断大敵ですね。

    サイバー攻撃に早まって・・

    今週頭から夏風邪をひいて、ついに3日間寝込んでいました。発熱が続き一向に良くなる気配がないので、仕方なく今朝は病院に行き、1時間半の点滴。脱水症状と酸素不足だとか。
    「夏風邪のウィルスに抗生物質は効かないんだけどね」と言いつつ医者は、二次感染を防ぐためだからと、抗生物質を出してくれましたが、これはちょっと不要な薬だなって思います。

    それはともかく、私がウィルスに襲われて弱っている間に、私のブログは大変なことになっていました。 私が利用している「ロリポップ!レンタルサーバー」がサイバー攻撃され、WordPressの利用者に対し不正アクセス、データ改ざんが行われたとのこと。
    私のブログも見事に文字化けし、管理画面もぐちゃぐちゃ。管理画面に不正侵入した証にブログタイトルが、「Hacked by Krad Xin」と書き直されています。
    まったく弱り目に祟り目というか・・・。

    私はサイトに複数個WordPressを設置していますが、今のところ、被害にあったのはそのうちの1個だけ。アドレスにwordpressの文字が入ったものだけでした。
    被害が少ないうちにデーターベースのパスワードを変更しておこうとロリポップのデータベースを開こうとしたら、覚えのないパスワードに変えられていました。これもハッカーの仕業か?と焦りましたが、実はロリポップの方で、パスワードとwp-config.phpファイルの設定、及びパーミッションなどを書き換えているようです。

    さて、この荒らされたブログをどう修復するか?
    どこをどう改ざんされたか分からないブログを修復するよりは、この際、最初から作り直してついでにアドレスからwordpressの文字もなくしてしまおうと、私はブログをまるごと削除してしまいました。
    データベースのバックアップがあるから大丈夫、と深く考えもせず、やってしまいました。
    しかし、バックアップデータをデータベースにインポートしようと何度試みてももうまくいかない。
    何が悪いのか、半端知識では理解できない。
    残っているのは、画像無しのテキストデータだけ。

    何故ブログを削除する前に、文字化けを修復することを考えなかったのか、悔やまれます。
    文字化けは案外簡単に復旧できるようです。ロリポップサイトに、
    2013/08/31 改ざんされたサイトの復旧方法について」というお知らせがあることに、あとから気づいて「しまった!早まった」と思いましたが、もう後の祭りです。
    データ改ざんが文字化けとウィジェットのテキスト変更程度なら、あとはログイン名やパスワードを変更するだけで良かったかも。もちろん被害がそれだけでおさまっていればですが。
    もしかしたら私がハッカーを買いかぶり過ぎていたのかも。もっとスゴイことされるんだって、ビビり過ぎだったかも知れません。

    しかし、削除してしまったデータは戻らないので、当分はテキストデータを一つ一つ見直して、画像がPCに残っているものや新たに画像を取得できる投稿について順次アップして行こうと思います。これを機にブログをすっきり整理していければいいかなと。

    今回の犯人は自分のFacebookで自分の仕事ぶりを随分自慢しているらしいです。ハッキングしたサイトのURLをリスト化しているというので見てみました。日本のサイトがターゲットにされたのは間違いないようです。 しかし、まあ、犯人のFacebookに対し、「いいね!」を押している人が多いのには呆れますね。

    9月2日追記:
    夜、ロリポップから「▽サイト改ざんへの対策をお願いいたします – ロリポップ!」http://lolipop.jp/security/というメールがありました。
    データの改ざんパターンが多数報告されているそうで、「データ改ざんが文字化けとウィジェットのテキスト変更程度」というわけではなかったようです。やはりハッカーを甘く見てはいけないってことでしょうか。
    指定ファイルを開いてみると、「webサイトが改ざんされてしまったら」、以下の作業が必要とのこと。

    最後に 次の注書きがありました。

    ※お使いのパソコンにバックアップファイルがある場合は、一度サーバー上のファイルを削除した後にバックアップファイルをアップロード。その後、ディレクトリのパーミッションを「705」に変更することでも対応は可能です。

    もっと早く教えて欲しかった!!!

    ギャラリーをWordPressでリニューアルしました。

    WordPressはテーマやプラグインが豊富に提供されていることや、カスタマイズの自由度が高いところが魅力ですが、それだけでなくセキュリテイの強化、アクセス向上にも効果的なソフトウェアです。
    個人サイトであってもWordpressを利用すると、明らかにアクセス数が増えます。
    もっと多くの人に作品を紹介したい。知ってもらいたい。そのためにも、ギャラリーをWordpressに移行したいと考えていましたが、Wordpressを使い始めて3年、ようやく実現しました。

    リニューアルに伴い、アドレスも変わりましたので、お気に入りに入れてくださっている方は、ブックマークの変更をお願いいたします。

    山田利喜子さん「皮革染色工芸」の新しいアドレスはhttp://art-container.net/galleries/kawa/です。使用したテーマは、「Wpshower(http://wpshower.com/)」のフリーテーマ「Imbalance 2」

    kawaTOMOKO・T・TORIBATTAさん「銅版画」の新しいアドレスはhttp://art-container.net/galleries/hanga/です。使用したフリーテーマは「WordPress.ORG/themes」に紹介されていた「Polaroids」

    hanga通畠義信さん「鉄のオブジェ」の新しいアドレスはhttp://art-container.net/galleries/tetu/。使用したフリーテーマは、「Wpshower(http://wpshower.com/)」の「Paragrams」

    tetu作品のショップアドレスはhttp://art-container.net/galleries/です。使用したフリーテーマは「Shaken and Stirred Web」の「Shaken Grid (Lite) Free!」(←リンク切れています)
    shop

    以上、ギャラリー向けのシンプルなテーマばかりです。
    テンプレートやcssを書き換え、プラグインも追加して使用していますが、自力で一から作り上げるのは、私には無理。こんな高品質なテーマが無料で提供されているなんて嬉しい限りです。

    今回はWordpressをもう一個インストールし、一個のWordpressで複数のブログサイトを構築できる「マルチサイト」機能を使って、4つのサイトを作成しました。
    Wordpressのマルチサイト機能については、後日改めて(忘れないうちに!)メモします。

    wordpressで掲示板を作る

    ご注意ください!
    WordPress 4.4からテンプレートの仕様が変わり、下記の方法ではメールアドレスを入力必須項目から外すことができなくなりました。
    「WordPress 4.4で掲示板を作る」を書きましたので、そちらも合わせてご参照ください。

    当サイトのゲストブックは、これまでCGIによるフリーの掲示板ソフトを使っていましたが、スパムが大量にやってくるようになったため、新たにwordpressを使用して作成し直すことにしました。

    私が作成したい掲示板(=ゲストブック)の完成目標は、以下の5項目。

    ①wordpressのコメント機能を利用してゲストブックを作る

    「レンサバネット」の「WordPressに掲示板を簡単に設置する方法」を参考にさせていただきました。(こちらのサイトは現在リンク切れとなっています)

    1.固定ページに掲示板用のページを新規作成します。

    本文は空白でも構いません。当サイトではページタイトルを「guestbook」としました。
    それだけでも、掲示板ページが出来上がるのですが、私はメールアドレスを入力必須項目から外したいので、

    2.ディスカッションの設定で、「名前とメールアドレスの入力を必須にする 」のチェックを外します。keijiban-0

    ②メールアドレスは入力必須項目から外し、webアドレスの入力フォームは削除する。

    「「Dragon-Ark」の【wordpress】コメントの必須項目を変更する(メールを必須としない)を参考にさせていただきました。

    wp-comments-post.phpの以下のコード(wordpres.ver3.5.2の場合75行目辺り)をコメントアウトして、Eメールの入力チェックを無効にします。そして新たに名前を必須項目にするコードを追加します。

    /**コメントアウトここから
    if ( get_option('require_name_email') &amp;amp;amp;amp;amp;amp;amp;&amp;amp;amp;amp;amp;amp;amp; !$user-&amp;amp;amp;amp;amp;amp;gt;exists() ) {
    	if ( 6 &amp;amp;amp;amp;amp;amp;gt; strlen($comment_author_email) || '' == $comment_author )
    		wp_die( __('&amp;amp;amp;amp;amp;amp;lt;strong&amp;amp;amp;amp;amp;amp;gt;ERROR&amp;amp;amp;amp;amp;amp;lt;/strong&amp;amp;amp;amp;amp;amp;gt;: please fill the required fields (name, email).') );
    	elseif ( !is_email($comment_author_email))
    		wp_die( __('&amp;amp;amp;amp;amp;amp;lt;strong&amp;amp;amp;amp;amp;amp;gt;ERROR&amp;amp;amp;amp;amp;amp;lt;/strong&amp;amp;amp;amp;amp;amp;gt;: please enter a valid email address.') );
    }
    コメントアウトここまで*/
    //追加部分ここから
    if(!$user-&amp;amp;amp;amp;amp;amp;gt;ID){
    if ('' == $comment_author)
    wp_die('名前を入力して下さい。');
    }
    //追加部分ここまで

    名前とEメールの入力欄を残して、ウェブサイトの入力欄を削除するには、wp-includesフォルダの中にあるcomment-template.phpを編集します。以下のコード部分を探して(wordpres.ver3.5.2の場合1524行目辺り)websiteのフォーム部分を削除したコードに置き換えます。

    以下のコード部分を削除する

    	$fields =  array(
    	'author' =&amp;amp;amp;amp;amp;amp;gt; '&amp;amp;amp;amp;amp;amp;lt;p class="comment-form-author"&amp;amp;amp;amp;amp;amp;gt;' . '&amp;amp;amp;amp;amp;amp;lt;label for="author"&amp;amp;amp;amp;amp;amp;gt;' . __( 'Name' ) . ( $req ? ' &amp;amp;amp;amp;amp;amp;lt;span class="required"&amp;amp;amp;amp;amp;amp;gt;*&amp;amp;amp;amp;amp;amp;lt;/span&amp;amp;amp;amp;amp;amp;gt;' : '' ) . '&amp;amp;amp;amp;amp;amp;lt;/label&amp;amp;amp;amp;amp;amp;gt; ' .
    	            '&amp;amp;amp;amp;amp;amp;lt;input id="author" name="author" type="text" value="' . esc_attr( $commenter['comment_author'] ) . '" size="30"' . $aria_req . ' /&amp;amp;amp;amp;amp;amp;gt;&amp;amp;amp;amp;amp;amp;lt;/p&amp;amp;amp;amp;amp;amp;gt;',
    	'email'  =&amp;amp;amp;amp;amp;amp;gt; '&amp;amp;amp;amp;amp;amp;lt;p class="comment-form-email"&amp;amp;amp;amp;amp;amp;gt;&amp;amp;amp;amp;amp;amp;lt;label for="email"&amp;amp;amp;amp;amp;amp;gt;' . __( 'Email' ) . ( $req ? ' &amp;amp;amp;amp;amp;amp;lt;span class="required"&amp;amp;amp;amp;amp;amp;gt;*&amp;amp;amp;amp;amp;amp;lt;/span&amp;amp;amp;amp;amp;amp;gt;' : '' ) . '&amp;amp;amp;amp;amp;amp;lt;/label&amp;amp;amp;amp;amp;amp;gt; ' .
    	            '&amp;amp;amp;amp;amp;amp;lt;input id="email" name="email" type="text" value="' . esc_attr(  $commenter['comment_author_email'] ) . '" size="30"' . $aria_req . ' /&amp;amp;amp;amp;amp;amp;gt;&amp;amp;amp;amp;amp;amp;lt;/p&amp;amp;amp;amp;amp;amp;gt;',
    	'url'    =&amp;amp;amp;amp;amp;amp;gt; '&amp;amp;amp;amp;amp;amp;lt;p class="comment-form-url"&amp;amp;amp;amp;amp;amp;gt;&amp;amp;amp;amp;amp;amp;lt;label for="url"&amp;amp;amp;amp;amp;amp;gt;' . __( 'Website' ) . '&amp;amp;amp;amp;amp;amp;lt;/label&amp;amp;amp;amp;amp;amp;gt;' .
    	            '&amp;amp;amp;amp;amp;amp;lt;input id="url" name="url" type="text" value="' . esc_attr( $commenter['comment_author_url'] ) . '" size="30" /&amp;amp;amp;amp;amp;amp;gt;&amp;amp;amp;amp;amp;amp;lt;/p&amp;amp;amp;amp;amp;amp;gt;',
    );
    

    以下のコードに置き換える
    [※記述ミスがあったため、4行目を修正しました。20013年8月15日]

    $fields = array(
            'author' =&amp;amp;amp;amp;amp;amp;gt; '&amp;amp;amp;amp;amp;amp;lt;p class="comment-form-author"&amp;amp;amp;amp;amp;amp;gt;' . '&amp;amp;amp;amp;amp;amp;lt;label for="author"&amp;amp;amp;amp;amp;amp;gt;' . __( 'Name' ) . ( $req ? ' &amp;amp;amp;amp;amp;amp;lt;span class="required"&amp;amp;amp;amp;amp;amp;gt;*&amp;amp;amp;amp;amp;amp;lt;/span&amp;amp;amp;amp;amp;amp;gt;' : '' ) . '&amp;amp;amp;amp;amp;amp;lt;/label&amp;amp;amp;amp;amp;amp;gt; ' .
                      '&amp;amp;amp;amp;amp;amp;lt;input id="author" name="author" type="text" value="' . esc_attr( $commenter['comment_author'] ) . '" size="30"' . $aria_req . ' /&amp;amp;amp;amp;amp;amp;gt;&amp;amp;amp;amp;amp;amp;lt;/p&amp;amp;amp;amp;amp;amp;gt;',
         'email'    =&amp;amp;amp;amp;amp;amp;gt; '&amp;amp;amp;amp;amp;amp;lt;p class="comment-form-email"&amp;amp;amp;amp;amp;amp;gt;&amp;amp;amp;amp;amp;amp;lt;label for="email"&amp;amp;amp;amp;amp;amp;gt;' . __( 'Email' ) . '&amp;amp;amp;amp;amp;amp;lt;/label&amp;amp;amp;amp;amp;amp;gt;' .
                    '&amp;amp;amp;amp;amp;amp;lt;input id="email" name="email" type="text" value="' . esc_attr( $commenter['comment_author_email'] ) . '" size="30" /&amp;amp;amp;amp;amp;amp;gt;&amp;amp;amp;amp;amp;amp;lt;/p&amp;amp;amp;amp;amp;amp;gt;'
    );
    

    ③ゲストブックのページだけ、デザインを変更する。

    1.使用中のテーマ(私の場合「twentyeleven」)に新規テンプレートを追加します。
    2.新規テンプレートを作成するには、テーマのpage.phpを開き、任意の名前を付けて保存します。例えばpage-guestbook.phpとか。
    3.新規に追加したテンプレートは、テンプレートネームを変更します。
    テンプレートファイルの冒頭に記述されているTemplate Nameを任意の名前に変更。
    たとえば以下のように書き直します。

    &amp;amp;amp;amp;amp;amp;amp;amp;lt;?php
    /*
    Template Name: guestbook
    */

    4.最初に作成した固定ページguestbookを開いて、テンプレートの項目からguestbookを選択すると、テンプレートがデフォルトから、guestbookのテンプレートに変更されます。

    keijiban-15.guestbookのテンプレートを編集する。
    ゲストブックのページには、ヘッダーイメージやメニュー項目を表示させたくなかったので、テーマのheader.phpをコピーして新たにゲストブック用のheader-2.php(名前は任意)を作成しました。
    6.header-2.phpからヘッダーイメージやメニュー項目に当たる部分のコードを削除します。
    (※2014年12月現在、ヘッダーイメージは表示するように、レイアウトを変更しました。)
    7.guestbookのテンプレートにheader-2.phpを読み込ませるには、get_header(); ?>の()部分に、読み込ませたいheaderの名前を記述します。

    &amp;amp;amp;amp;amp;amp;amp;amp;lt;?php
    /*
    Template Name: guestbook
    */
    
    get_header(2); ?&amp;amp;amp;amp;amp;amp;amp;amp;gt;

    ④ファイルをアップロードできるようにする。

    コメント欄に画像などのファイルをアップできるようにする「プラグインcomment-imageを導入しました。
    1.プラグインの新規追加画面でcomment-imageを検索
    2.いますぐインストールをクリック
    3.プラグインの有効化をクリック
    有効化するだけで、画像 (GIF, PNG, JPG, JPEG)をアップすることができます。
    特に設定画面もないので、どうしても変更したいところがあれば、comment-imageのPHPファイルやcssファイルを直接書き直すことになります。

    ⑤画像認証を設置する。

    ほとんどのスパムは、wordpressの最強スパムブロックプラグイン「Akismet 」がキャッチしてくれるので、ブログに表示されることはありませんが、画像認証なしだと、やはりスパムがゾクゾクやってきます。認証無しってことは、ドアを開けっ放しにしているのと同じなんですね。
    そこで、SI CAPTCHA Anti-Spam(コメント画像認証導入プラグイン)を導入することにしました。

    「WordPress超初心者講座」の「SI CAPTCHA Anti-Spam(コメント画像認証導入プラグイン)」を参考にさせていただきました。

    1.プラグインの新規追加画面でSI CAPTCHA Anti-Spamを検索
    2.いますぐインストールをクリック
    3.プラグインの有効化をクリック
    4.管理画面のプラグイン項目からSI CAPTCHA オプションを開いて、必要なら設定をする。
    オプションの設定は、デフォルトのままでも特に問題ありません。

     [追記]2015年2月22日 SI CAPTCHA Anti-Spamは不要になりました。

    先月SiteGuard WP Pluginを導入したのですが、SI CAPTCHA Anti-Spamを有効化したままにしていたので、画像認証の入力画面が2個にダブっていることに、今頃気が付きました。
    SiteGuard WP Pluginは

    「管理ページとログインに関する攻撃からの防御に特化したセキュリティプラグインです。ブルートフォース攻撃、リスト攻撃等の、不正にログインを試みる攻撃や、コメントスパムを受けにくくするための機能です。画像認証の文字は、ひらがなと英数字が選択できます。」

    という優れものです。

    [追記]2014.4月19日
    上記の方法で掲示板を作るにあたって注意すべきこと

    WordPressをアップグレードするたびに、「wp-comments-post.php」とwp-includesフォルダ内の「comment-template.php」の二つのコアファイルを、変更箇所を探して書き換えなければなりません。
    WordPress3.7からはアップデート(マイナーアップデートのみ)が自動で更新されるようになったため、コアファイルが勝手に上書きされてしまいますから、要注意です。
    やはり、コアファイルをカスタマイズするのはあとあと面倒ですね。

    【追記2】2014年11月21日
    コメント入力フォームの位置について

    コメントの入力フォームを掲示板ページの上位に設置したい場合、使用しているテーマのテンプレートファイルcomments.phpを開いて、<?php comment_form(); ?>タグの記述位置を変更します。

    デフォルトではテンプレートの最後行あたりに書かれていると思いますが、それを上方にある<?php if ( have_comments() ) : ?>タグの、すぐ上に移動させます。

    パーマリンクとスラッグについて少し理解したこと

    wordpressの初期設定にパーマリンク設定というのがあります。
    WordPress Codex 「パーマリンク設定 」によると、

    デフォルトでは、WordPress はクエスチョンマークとたくさんの数字を URI に使いますが、カスタム URI 構造をパーマリンクとアーカイブに作成することができます。この機能は芸術性、利便性、リンクの寿命を改善することができます。

    と書いてありますが、私には何のことだかさっぱりわかりません。
    さらに「パーマリンクの使い方」を読むと、

    パーマリンクとは、ブログの個々の投稿、カテゴリーなどの投稿一覧ページへの恒久的(半永久的)な URL です。パーマリンクは、他のブロガーがあなたの投稿やセクションにリンクを張るときや、投稿へのリンクを Eメールで送ったりするときに使います。個別の投稿への URL は常に存在して決して変らないようにすべきです。そういう訳で、「perma」リンクといいます。
    デフォルトでは、投稿 ID が N のときに
    http://example.com/?p=Nのようになります。全てのサーバ環境で動くように、新規インストール時のデフォルトはこうなっています。しかしながら、他のオプションが付くと見苦しくなるので好ましくありません。

    とあります。

    パーマリンクが個別ページに与えられるURLで、IDのようなものであるというのは理解できますが、何故デフォルトのままでは好ましくないのか、URLに「?」が付いていると見苦しいのか?むしろかわいいんじゃない?と理解不能な問題は先送りすることにして、結局デフォルトの設定のままにしていました。
    でも、どこのサイトを見ても初期設定で必ずパーマリンクの変更をすべきと書いてあるので気になってきたところ、「WordPress インストールガイド」というサイトの「表示URL(パーマリンク)の設定」を読んで初めて、パーマリンクの変更の必要性に納得しました。

    デフォルトのhttp://example.com/?p=Nというような表示では、検索エンジンがこれを動的なページと判断し、検索に不利になる場合があるそうです。

    動的ページと静的ページの違いについては「BIGLOBEなんでも相談室 URLの動的、静的の違いについて。」に分かりやすい説明がありました。
    「動的ページとは、実体となるファイルが通常は存在せず、読者がアクセスしてきたときに初めてファイルが生成されるものなので、検索エンジンが捕らえにくい」というようなことらしいです。
    最近では、動的でも静的でも以前ほど検索結果に顕著な差はないそうですが、それでも静的ページにしておいた方がよいらしい。
    というわけで、遅ればせながらパーマリンクの形式を変更をすることにしました。
    パーマリンクの形式には以下のようなものがありますが、

    img01

    どれを選ぶかはその人のお好み次第ということらしいです。
    「カテゴリー/投稿名」というのを勧めているサイトがあったので真似をして、カスタム構造にチェックを入れ「/%category%/%post_id%/」と記述してみました。
    すると、アドレスの表示が下記のように%の羅列になってしまいました。

    http://art-container.net/wordpress/2010/07/%e3%82%b9%e3%83%91%e3%83%a0%e3%82%b3%e3%83%a1%e3%83%b3%e3%83%88%e5%af%be%e7%ad%96%e7%94%a8%e3%83%97%e3%83%a9%e3%82%b0%e3%82%a4%e3%83%b3akismet/

    これはカテゴリーや投稿名の日本語表記部分が、パーセントコーディング(と言うそうです)されてしまうからだそうです。
    カテゴリーも投稿名も全て英語表記なら何の問題もないので、投稿時に投稿画面の「パーマリンクの編集」で日本語部分を英語表記すれば%は表示されないそうです。

    しかし、非バイリンガルの私には、投稿のたびにいちいち、そんな面倒なことはできません。で、投稿名の表示は諦めて「数字ベース」の設定を選択することにしました。
    これだとアドレス表示は
    http://art-container.net/wordpress/archives/n となります。
    ただ、この設定でもカテゴリーから個別ページを開いたとき、カテゴリー名に日本語が入っていると、その部分が%の羅列になってしまいます。
    そこで必要になるのがカテゴリースラッグの設定です。

    カテゴリーの管理画面には、カテゴリースラッグという項目があります。
    このカテゴリースラッグについても、私は意味も必要性も設定方法も分からず、無視していました。
    カテゴリースラッグに英語表記を入れておくと、カテゴリーから開いた個別ページでも、URLがパーセントコーディングされなくなります。

    スラッグ” は URL 内で使用可能な形式にされた名前です。通常はすべて小文字で構成され、アルファベット、数字、ハイフンを含めることができます。

    という、カテゴリースラッグの説明文も、今読むと「ああ、そういうことか」と理解できますが、、、。初めて目にした時には、パーマリンクの説明同様、なんのことだかさっぱり分らなかったのでした。

    個別ページにもサイドバーを表示させる

    wordpressは膨大な量のテーマが用意されていて、無料で選びたい放題、というところも魅力の一つです。デザインも豊富にありますが、テーマの仕様や機能に、それぞれ微妙な違いがあるので選択に迷います。
    しかし、まあ、どんなにたくさん提供されても、欲を言い出すときりが無く、完璧にそのまんま使えるテーマって意外とないような気がします。

    今私が使っているテーマでは、個別ページを開くとサイドバーが表示されません。wordpressのデフォルトのテーマもそういう仕様になってるので、ま、それが普通なのだろうと思っていたら、個別ページにサイドバーが表示されるテーマも多くありました。
    その違いはどこにあるのか、テンプレートをじっと見比べてみると、どうやらsingle.phpにsidebar.phpを読み込む一行があるかどうかだけの違いのようです。

    single.phpの変更箇所
    最後の行にある<?php get_footer(); ?>の前に<?php get_sidebar(); ?>を追加する。

    single.phpを変更しただけだと、カラム落ちするので、style.cssのシングルページ関連箇所で幅や余白の修正をします。

    カテゴリをクリックしてタイトルリストを表示する

    このブログで言えば「WEB作成」「 読書リスト」「日々のこと」と大きく3つのカテゴリがあり、それをさらに細かく分類しています。サイドバーにあるこのカテゴリをクリックすると、全タイトルがズラーっとリスト表示される方法の覚書です。

    まずプラグイン「Custom Posts Per Page」をインストールします。

    http://rephrase.net/miscellany/05/perpage.phpsにアクセスしてソースをコピー・ペースト。perpage.phpという名前(名前は任意)でwp-content/pluginsフォルダに保存してサーバーにアップします。

    管理画面の「プラグイン・インストール済み」を開いて、プラグイン「Custom Posts Per Page」を”使用する”をクリックして有効化します。

    プラグイン「Custom Posts Per Page」の変更できる箇所は以下の数字部分。$posts_per[‘category’]  = 999;はカテゴリのタイトルが1ページに最大999個表示されるということ。デフォルトのまま使うことにしました。

    • $posts_per[‘home’]      =  5;
      $posts_per[‘day’]       = 10;
      $posts_per[‘month’]     = 10;
      $posts_per[‘search’]    = 10;
      $posts_per[‘year’]      = 999;
      $posts_per[‘author’]    = 999;
      $posts_per[‘category’]  = 999;

    テンプレートのcategory.phpを作成します。

    テーマによってはcategory.phpが存在しない場合がある、ということですが、私が使用しているテーマもcategory.phpがありませんでした。
    category.phpが存在しない場合は、index.phpを利用して新規にcategory.phpを作成します。
    category.phpを作成するには、index.phpを開いて、ループ部分を編集し,名前をcategory.phpに変更し、使用中のテーマのフォルダに保存します。
    編集する部分は</header>の直後から <?php endif; ?>の直前まで。
    そこを以下のように書き換えます。

    <ul> <?php if ($posts) : foreach ($posts as $post) : start_wp(); ?>
    <li id="catpost-<?php the_ID(); ?>"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link: <?php the_title(); ?>"> <?php the_title(); ?></a> &bull;  &bull; <?php the_date(''); ?></li>
    <?php endforeach; else: ?> </ul>
    <p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
    <?php endif; ?>

    編集したらサーバーにアップします。

    と以上二つのファイルの作成だけで、カテゴリ別のリスト表示ができました。

    表示ページのレイアウトはcssやcategory.phpを編集することで変更できます。
    リストのタイトルと年月日の表示については、「WordPressの投稿日時を、好きなフォーマットで表示しよう!日本語&英語のコピペ用サンプル」が分かりやすくて、参考になりました。

    上記までの設定でリスト表示は

    •「泳いで帰れ」奥田 英朗 • • 2010年4月29日

    となります。