Más contenido relacionado
La actualidad más candente (20)
Similar a ノンプログラマーのためのカンタンWordPressテーマ作成入門 〜子テーマでテーマ作成&カスタマイズ〜 (20)
ノンプログラマーのためのカンタンWordPressテーマ作成入門 〜子テーマでテーマ作成&カスタマイズ〜
- 50. style.css
/*
Theme Name: Twenty Fifteen Child
Template: twentyfifteen
*/
@import url( '../twentyfifteen/style.css' );
親テーマのスタイルシートを読み込みます
スタイルシートの読込3
@import で親テーマの
スタイルシートを読み込み
- 51. style.css
/*
Theme Name: Twenty Fifteen Child
Template: twentyfifteen
*/
@import url( '../twentyfifteen/style.css' );
親テーマのスタイルシートを読み込みます
スタイルシートの読込3
@import で親テーマの
スタイルシートを読み込み
この書き方は
今は
非推奨です
- 59. 管理画面の 外観 > テーマ > 新規追加
「 テーマのアップロード 」で zipファイルを選択
今すぐ
インストール
zip
ファイルを
選択
親テーマがインストールされていないときは
自動的にインストールされる
- 63. 難易度 ★ ☆ ☆ ☆ ☆
リンクの色や
背景の色を
変えたい!
CSSのカスタマイズ
1
- 72. 難易度 ★ ★ ★ ☆ ☆
投稿日を
削除したい!
テンプレートファイルの
カスタマイズ 1
2
- 74. Twenty Fifteen の 投稿日を削除する場合
①
Firebugで
編集したい箇所の
class名を確認
<span class="posted-on">
- 80. 難易度 ★ ★ ★ ★ ★
投稿日の
表示位置を
変更したい!
テンプレートファイルの
カスタマイズ 2
3
- 90. よく使うテンプレートタグ
WordPress Codex 日本語版 https://wpdocs.osdn.jp/テンプレートタグ
サイトのタイトルを表示
<?php bloginfo( 'name' ); ?>
サイトのキャッチフレーズを表示
<?php bloginfo( 'description' ); ?>
投稿のタイトルを表示
<?php the_title(); ?>
投稿日を表示
<?php echo get_the_date(); ?>
投稿のカテゴリーを表示
<?php the_category(); ?>
投稿のタグを表示
<?php the_tags(); ?>
投稿のパーマリンクを出力
<?php the_permalink(); ?>
サイトのURLを出力
<?php echo home_url(); ?>
投稿の内容を表示
<?php the_content(); ?>
投稿の抜粋を表示
<?php the_excerpt(); ?>
投稿のアイキャッチを表示
<?php the_post_thumbnail(); ?>
テーマディレクトリのURLを出力
<?php echo get_template_directory_uri(); ?>
- 94. テーマを構成するテンプレートファイル
WordPress Codex 日本語版 https://wpdocs.osdn.jp/テーマの作成
style.css
index.php
single.php
page.php
header.php
footer.php
sidebar.php
comments.php
screenshot.png
functions.php
スタイルシート
メインのテンプレート
投稿ページのテンプレート
固定ページのテンプレート
ヘッダーのテンプレート( get_header()で読み込み )
フッターのテンプレート( get_footer()で読み込み )
サイドバーのテンプレート( get_sidebar()で読み込み )
コメント欄のテンプレート( comment_form()で読み込み )
テーマのスクリーンショット( 1200px × 900px以内 )
関数( PHPの命令文 )用のファイル
必須
必須
- 95. 読み込まれるテンプレートファイルの順番
WordPress Codex 日本語版 https://wpdocs.osdn.jp/テンプレート階層
ページの種類
404ページ
検索結果ページ
カテゴリーアーカイブ
タグアーカイブ
作成者アーカイブ
日付アーカイブ
投稿ページ
固定ページ
フロントページ
category-
$slug.php
tag-$slug.php
author-
$nicename.php
index.php
category.php
tag.php
author.php
date.php
single-post.php
page-$id.php
front-page.php
category-$id.php
tag-$id.php
author-$id.php
page-$slug.php
404.php
search.php
archive.php
single.php
page.php
home.php
優先順位高 い 低 い
- 100. 1200px × 900px 以内
テーマを有効化したときのキャプチャ
screenshot.pngを追加1
1200px
900px
screenshot.png
- 102. style.css
style.cssの記述を追加4
/*
Theme Name: Twenty Fifteen Child
Template: twentyfifteen
Theme URI: テーマのサイトURI
Author: テーマの作者名
Author URI: テーマ作者のサイトURI
Description: テーマの説明
Version: テーマのバージョン
License: ライセンス
License URI: ライセンスのURI
Tags: テーマのタグ
*/
追加