[WP覚書]WordPressで一般的なサイトを作成する時の覚書

2013年5月5日

今までブログはちょこちょこカスタマイズはしてたのですが、一般的なサイトのカスタマイズは初挑戦。色々勝手が違うところもありました。MTでも使ってていくらか慣れてるvicna.excのテンプレートを利用しました。

神参考サイト

概ねこちらのサイトを参考にしました。
最初にざっと読んでおくと、あとから困ったことが出てきたときにこうしたら解決するんじゃ!?というヒントがちりばめられてます~。
WordPressでブログじゃないWebサイトを作るときのいろいろ(サンプル付き)
サンプルはこちら

URLを普通のサイトっぽく見せる設定

一番気になってたのがこの方法。
概ねディレクトリ階層っぽく見せるというのが主流のようです。

こちらのページを参考にしました。
WordPressの固定ページとパーマリンク設定 | Joomla!,Wordpressでサイトを構築するためのヒント

左メニュー「設定」→「パーマリンク設定」
共通設定の「投稿名」を適用
そうするとタイトル下に表示されてる「パーマリンク」の項目の以下の部分がいじれるようになります。
自分のブログを例にしましたが、こんな感じ。
元々入ってるものは、その記事を最初に書いた時にtitleに入力したものが日本語で入るようです。
固定ページをとりあえずコンテンツ分作る時に、これも一緒にやっちゃうとラク。

固定ページを作成する時に順番も一緒に入れてしまう

固定ページの表示順序 – WordPressの使い方
ページ属性の項目の順序に数字を入れると、ナビゲーションがその順番で並ぶようになります。
私はメインナビ以外では、ウィジェットの固定ページのナビをよく使うのですが、デフォルトではページタイトル順(あいうえお順)に並ぶようになっているので、ウィジェットの管理画面で、予め「ページ順序」に変更することが必要です。

テーマがvicna.excで、HOMEに固定ページ記事を利用している場合のナビゲーション処理

特定の固定ページをHOMEにする

WordPressでブログじゃないWebサイトを作るときのいろいろ(サンプル付き)
『3.1トップページに固定ページを使う』をまんま参照しました。

設定→表示設定
「フロントページの表示」項目で、
「固定ページ」にチェック
「フロントページ」に表示したい固定ページを選択します。
これで、選択したページがHomeに表示されるようになります。

しかしこのままだとナビゲーションに、指定した固定ページも表示されてダブってしまうので、もう一設定!

特定の固定ページを非表示にさせる

外観→Vicna設定
「Navigation」項目
「Global Navigation」を
pages display(固定ページのナビゲーションで、Homeを表示する)設定にして、
「除外ページ」 に
固定ページの表示させないページ(Homeに設定した固定ページ)を記入。
※一覧(参考)に書いてある数字もそのまま記入すること

これでダブってたページが表示されなくなります。

vicnaじゃない場合はこちらで設定できるかも

wp_list_pages()タグを使ってナビゲーション表示にし、引数excludeで特定のページを除外するやり方です。

テンプレートタグ/wp list pages – WordPress Codex 日本語版

特定のページを除外する
exclude パラメータを使うと、wp_list_pages が表示するページリストから特定のページを除外することができます。

<ul>
  <?php wp_list_pages('exclude=17,38' ); ?>
</ul>

おまけ:Homeもカレント(反転)表示させる

上の状態だとHomeではカレント(反転)表示しませんが、以下の方法でできそうです。
今回は大元のファイルをいじるのは怖いのでやめときましたが。必要があったら。

WordPress › フォーラム » wp.vicuna.ext ver.1.58 のカスタマイズ【至急】

Homeに指定した固定ページだけパンくずを表示させない方法

[WordPress] ループ外で固定ページのIDで条件分岐する – かちびと.net

上のソースを参考にして、
Homeに指定した固定ページのIDを「1」としたときに、
下のようなソースとしました。
問題なく表示はされてますが、もっと簡単な記述方法はありそうな気がします。

<?php
function function_name() {
global $wp_query;
$thePostID = $wp_query->post->ID;
}
$pageid = $post->ID;
if ($pageid == 1) { ?>
<!--何も表示させない-->
<?php } else { ?>
<p class="topicPath"><a href="<?php bloginfo('home'); ?>"><?php _e('Home', 'vicuna'); ?></a><?php
		$parent_pages = get_vicuna_page_navigation('sort_column=menu_order');
		if ($parent_pages) : ?> &gt; <?php echo $parent_pages; ?><?php endif; ?> &gt; <span class="current"><?php the_title(); ?></span></p>
<?php } ?>

ちなみに条件分岐については、基本的な考え方はこちらのページがわかりやすかったです。

もう覚えなくても大丈夫!?WordPressの条件分岐タグの使い方まとめ | Oxy notes

if ( 条件1 ){ 条件1に合う場合の処理 }
else if( 条件2 ){ 条件1に合わないが、条件2に合う場合の処理 }
else { 条件1、条件2共に合わない時の処理 }

ブログページの作成方法

固定ページテンプレート(page.php)を利用(コピペ^^;)して、Blogテンプレート(blog.php)を作成

2.以下の様なループを設定する。

<?php
$args = array(
	'post_type' => 'post', /* 投稿タイプ */
	'paged' => $paged
); ?>
<?php query_posts( $args ); ?>
<?php if (have_posts()) : ?>
	<?php while (have_posts()) : the_post();
	/* ループ開始 */ ?>
<div class="entry">
    		<h2><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h2>
<ul class="info">
				<li class="date"><?php the_time(__('Y-m-d D G:i', 'vicuna')) ?></li>
				<li class="category"><?php the_category(' | ') ?></li>
				<?php /* -- ex cng s -- */
					vicuna_author_displays();
					vicuna_tag_displays(); ?>
				<?php //if (function_exists('the_tags')) : the_tags('<li class="tags">', ' | ', '</li>'); endif; ?>
				<?php /* -- ex cng e -- */ ?>
				<?php edit_post_link(__('Edit'), '<li class="admin">', '</li>'); ?>
			</ul>

<div class="textBody">
    	<?php the_content(); ?>
    </div></div>
	<?php endwhile; ?>
<?php else : ?>
<div class="entry">
    <div class="textBody">
    	<h2>記事がありません</h2>
    	<p>表示する記事はありませんでした</p>
    </div></div>
<?php endif; ?>

3.ブログ用の固定ページを作成する。
これがブログのindexになります。固定ページで入力したテキストがブログのループの上部に表示されます。
右メニューの「ページ属性」のテンプレートで、上記で作成したテンプレートを選択して保存。

vicna周り削除分

固定ページ(page.php)からサイドバーをはずしました。

<?php get_sidebar(); ?>

single.phpからNewerOlderフリップをはずしました。

<ul class="flip" id="flip1">
<?php		if ($newer_post) : ?>
		<li class="newer"><a href="<?php echo get_permalink($newer_post->ID) ?>" title="<?php echo apply_filters('the_title', $newer_post->post_title, $newer_post) ?>" rel="nofollow"><?php _e('Newer'); ?></a></li>
<?php		endif; ?>
<?php		if ( $older_post ) : ?>
		<li class="older"><a href="<?php echo get_permalink($older_post->ID) ?>" title="<?php echo apply_filters('the_title', $older_post->post_title, $older_post); ?>" rel="nofollow"><?php _e('Older'); ?></a></li>
<?php		endif; ?>
		</ul>

その他の参考ページ

WordPress を専用ディレクトリに配置する – WordPress Codex 日本語版

条件分岐 | PHP Labo

WordPressで企業サイトを作る際に押さえておくべき10個のこと – TRANS

WordPressで企業サイトを作る際によく使うプラグイン – TRANS

WordPressで一般的な企業サイトを作るときに参考になる記事まとめ5つ – W3Q

日本の企業サイト向けに作成された高性能でレスポンシブWebデザイン対応の無料WordPressテーマ・BizVektor – かちびと.net

2012年春。wordpressで企業サイト制作時に導入したいプラグイン13選 | DAICHIFIVE blog

WordPress

Posted by ponnao