はじめてのwordpress | 猫好き倶楽部

どうなってる？ディレクトリ構成

wordpressの中身

下図はDLしたWPの中身です。DLしたWPの中には、数々のファイルやらフォルダが存在してますが、使うのは一部です。

下図はwp-contentの中身です。WPに元々あるテーマや他からDLしたテーマはこちら、[ wp-content ＞ themes ] に配置されます。

触るファイルはテーマ(下記の画像では筆者がDLしたテーマ「 businesspress 」です)の中にある、主にstyle.cssやheader.phpやfooter.phpなどのファイルです。

テーマのファイル構成

テーマ [ themes ] の中身ですが、カスタマイズに応じて必要なファイルを触ります。

style.css [ ページデザイン ]
functions.php [ 機能制御 ]
header.php [ ヘッダー ]
footer.php [ フッター ]
page.php [ 固定 ]
single.php [ 投稿 ]
index.php [ フロント ]
archive.php [ アーカイブ ]
category.php [ カテゴリー ]
content.php [ コンテンツ ]
sidebar.php [ サイドバー ]
search.php [ 検索結果表示 ]
comments.php [ コメント ]
screenshot.png [ テーマ画像 ]

テーマ編集

テーマをDLしたら…

まず、テーマをDLしたら、子テーマ作ります。理由は、テーマは度々アップデートします。その影響でレイアウトが崩れる可能性があります。度々のアップデートに影響されないように、子テーマを作成してレイアウト崩れを回避します。

まずはテーマをDL

子テーマの作り方

WPフォルダの中の [ wp-contemt ] ＞ [ themes ]を開きます。

themesフォルダに新規フォルダを作成します。引き継ぐテーマ名に「_child」をつけ、新規フォルダを作成します。

「親」テーマを引き継ぐために、新規で作成した [ _child ] フォルダに [ functions.php ] と [ style.css ]を作成します。親からファイルを_childフォルダへコピペします。

新規で作成した [ _child ] フォルダに作った [ functions.php ] に下記の記述をします。WordPress内にCSSやJavaScriptの機能を追加したり、親テーマの後に子テーマを読み込んだりするための指示を出します。

<?phpadd_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );functiontheme_enqueue_styles() {wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );}

CSSには[ Theme Name ]と[ Template ]の記述が必要です。

/*
Theme Name: businesspress-child
Template: businesspress
Version: 1.6
Description:businesspress専用の子テーマ
*/

Description [ 説明 ]
Theme Name [ 子テーマの名前 ] ※必須
Template [ 親テーマの名前 ] ※必須
Version [ バージョン ]

子テーマのイメージ画像の作り方

イメージ画像を作成して、[ screenshot.png ]にリネームして、下記の階層に入れます。

子テーマのメリットデメリット

メリット

アップデートにレイアウトなどの影響受けないセキュリティーなどの関係でテーマが度々アップデートされます。それによりレイアウトが崩れる恐れがありますが、あらかじめ作成した子テーマには、カスタムしたものが影響を受けません。
万が一の間違い大元の親テーマのファイルを削除、またはコードに取り返しのつかないミスがあり修正できない…なんてことを回避できるように、子テーマで作成していきます。何か間違いがあれば、親テーマを上書きして戻せるのが利点です。
ラクラク作業基本となる親テーマにカスタマイズするので、ラクです。

デメリット

製作期間が長いサイト自体が重くなることもデメリットの1つです。
親テーマに加えて子テーマを読み込む必要があるため、サイトの表示速度が悪化してしまいます。
表示が遅くなる？！サイト自体が重くなることもデメリットの1つです。親テーマに加えて子テーマを読み込む必要があるため、サイトの表示速度が悪化してしまいます。
ラクラク作業基本となる親テーマにカスタマイズするので、ラクです。

子テーマ作り方参考サイト

固定ページで独自のテンプレート追加

ページ設定でプルダウンに自作テンプレートを追加する場合は、テンプレートファイルを子テーマの同じ階層に配置。するとプルダウンに追加され選択できます。

〈　phpをカスタマイズ　〉ソースを編集しカスタマイズ

<?php
/*
* Template Name: widepage
*/
?>

<?php get_header(); ?>

<section class="contentBlock_">
<?php
if ( have_posts() ) :
while ( have_posts() ) : the_post();
?>
<h2><?php the_title();?></h2>
<?php the_content(); ?>
<?php
endwhile;
endif;
?>

</section><!--/contentBlock_-->
<?php get_footer(); ?>