テーマ作成初心者向け word pressサイト構築のポイントと...
DESCRIPTION
2014.3.29 WordBench東京 WordBench東京3月: 春のデザイナー祭り! 「テーマ作成初心者向けWordPressサイト構築のポイントと便利なプラグイン」TRANSCRIPT
![Page 1: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/1.jpg)
テーマ作成初心者向け WordPressサイト構築のポイントと
便利なプラグインよつばデザイン 後藤賢司
2014.3.29 WordBench 東京 in GMO
![Page 2: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/2.jpg)
自己紹介よつばデザイン 後藤賢司
出版社~デザイン会社~Web制作会社~企画会社~独立
東京と大分の2拠点で活動中(月の半分ずつ)
Webサイトの企画・デザインやメディアサイトやってます
![Page 3: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/3.jpg)
和菓子が好き
![Page 4: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/4.jpg)
WP-D グリーン
CPIエバンジェリスト
ゼロから始めるWordPress勉強会(facebookグループ)
Webクリエイターのための情報交換所(facebookグループ)
すみだクリクラ
活動
![Page 7: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/7.jpg)
今日の内容1. テーマ作成前に知っておきたい事
2. こんな事で困った
3. テンプレートの仕組みについて
4. プラグインの紹介
![Page 8: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/8.jpg)
テーマ作成初心者が対象です。
![Page 9: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/9.jpg)
WordPressのテーマを
作った事ありますか?
![Page 10: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/10.jpg)
テーマを触るには
プログラムの知識が必要になる
![Page 11: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/11.jpg)
テーマを
作成するようになった
きっかけ
![Page 12: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/12.jpg)
イメージに一番近いテーマを
ひたすら探す日々
![Page 13: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/13.jpg)
訴求ポイント重視すると
あてはまるテーマがない
![Page 14: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/14.jpg)
PHPがわからないけど
![Page 15: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/15.jpg)
ちょっとやってみよう…
![Page 16: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/16.jpg)
既存テーマの
カスタマイズからスタート
![Page 17: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/17.jpg)
CSSとかは何とかなるけど
PHP部分はさっぱり
![Page 18: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/18.jpg)
1箇所変えては確認
![Page 19: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/19.jpg)
すごい時間がかかりました
![Page 20: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/20.jpg)
決まり事とかは
理解しておきたい
![Page 21: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/21.jpg)
基礎知識
![Page 22: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/22.jpg)
静的なHTMLと違うところ
![Page 23: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/23.jpg)
PHP
![Page 24: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/24.jpg)
WordPress独自のタグ<?php get_header(); ?>
!
<?php if (is_front_page()): ?>
トップページだけこの部分を表示します。
<?php else: ?>
トップページ以外はこの部分を表示します。
<?php endif; ?>
![Page 25: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/25.jpg)
必要なものから覚えれば良い
![Page 26: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/26.jpg)
データベース
![Page 27: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/27.jpg)
データを置いてるところ
倉庫みたいなもの
![Page 28: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/28.jpg)
「ループ」について
![Page 29: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/29.jpg)
お知らせカテゴリーの記事の
最新5件を表示したい
![Page 30: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/30.jpg)
データベースのイメージ
![Page 31: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/31.jpg)
最新5件の記事を取得
![Page 32: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/32.jpg)
個人的なイメージ
![Page 33: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/33.jpg)
お医者さんで診察して
薬局で必要な薬を出してもらう
ような事が行われてる
![Page 34: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/34.jpg)
テーマの仕組み
![Page 35: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/35.jpg)
最低限必要なもの!
index.php
style.css ※テーマ名
![Page 36: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/36.jpg)
index.php
header.php
sidebar.php
footer.php
style.css
良くあるテーマの構成
![Page 37: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/37.jpg)
テンプレート名と対応順序
![Page 38: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/38.jpg)
参照されるテンプレートには
優先順位があります
![Page 39: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/39.jpg)
http://wpdocs.sourceforge.jp/テンプレート階層
![Page 40: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/40.jpg)
固定ページの場合優先順位
page-$slug.php (page-about.php、page-contact.php)
page-$id.php (page-23.php)
page.php
index.php
![Page 41: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/41.jpg)
テンプレートに必要です。</head>直前に記述
<?php wp_head(); ?>
!
</body>直前に記述
<?php wp_footer(); ?>
プラグインがちゃんと動いてくれなかったり。初めてテーマ自作する時に忘れがちなので注意。
![Page 42: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/42.jpg)
今使用中のテーマで何のファイルを使ってるか知りたい場合は、この
プラグインを入れると確認できます。
http://wordpress.org/plugins/show-current-template/
![Page 43: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/43.jpg)
デザインの落とし込み
![Page 44: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/44.jpg)
![Page 45: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/45.jpg)
お知らせ一覧
個別記事
トップページ
当社について 事業案内 アクセス お問合せ
事業案内1 事業案内2
![Page 46: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/46.jpg)
トップページをしっかり作るindex.php front-page.php
投稿記事や 固定ページを表示 トップページ用
![Page 47: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/47.jpg)
こういうのって
どこを見ればいいの?
![Page 48: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/48.jpg)
Codexに詳しく書いてます
http://wpdocs.sourceforge.jp/テンプレート階層
![Page 49: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/49.jpg)
固定ページの種類を増やしたい見せ方を柔軟に対応したい
![Page 50: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/50.jpg)
固定ページ用のテンプレートを作る固定ページ用のテンプレートを作る。指定は編集画面で出来ます。テンプレートには名前をつける。※テンプレートの最初に記述<?php/*Template Name:wide*/?>
![Page 51: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/51.jpg)
固定ページのテンプレート例例:サイドバーを
表示させないテンプレート
page-wide.php。
色を変える等、個別でアレンジ
しやすくなる。地図を大きく見せたり お問合せフォーム以外は
表示させずに 離脱率の低下を狙ったり
サイドバー無しテンプレート
![Page 52: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/52.jpg)
サイドバーのバリエーションが欲しい
投稿記事 事業案内
![Page 53: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/53.jpg)
sidebar.phpを複数作る通常はこのように使う。
違うレイアウトのサイドバーを
使いたい…。
![Page 54: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/54.jpg)
sidebar.phpを複数作るsidebar-service.phpのように
別のサイドバーを用意する。
ハイフンの後に名前をつけると
このように読み込める。
<?php get_sidebar('service'); ?>
![Page 55: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/55.jpg)
例:トップページだけいろいろ変えたいfront-page.php
header-top.php
sidebar-top.php
footer-top.php
front-page.phpに
全部記述してもOK
<?php get_footer(’top’); ?>
<?php get_header(’top’); ?>
<?php get_sidebar(’top’); ?>
front-page.phpheader-top.php
footer-top.php
sidebar-top.php
![Page 56: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/56.jpg)
バリエーション展開は簡単ヘッダーを状況に応じて使い分けたり。
<?php get_footer(); ?>
<?php get_header(); ?>
<?php get_sidebar(); ?>
index.phpheader.php
footer.php
sidebar.php
<?php get_footer(’top’); ?>
<?php get_header(’top’); ?>
<?php get_sidebar(’top’); ?>
front-page.phpheader-top.php
footer-top.php
sidebar-top.php
![Page 57: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/57.jpg)
ページ毎に作っても良い
<?php get_footer(); ?>
<?php get_header(); ?>
<?php get_sidebar(); ?>
index.phpheader.php
footer.php
sidebar.php
<?php get_footer(’top’); ?>
<?php get_header(’top’); ?>
<?php get_sidebar(’top’); ?>
front-page.phpheader-top.php
footer-top.php
sidebar-top.php
<?php get_footer(); ?>
<?php get_header(); ?>
<?php get_sidebar(); ?>
index.phpheader.php
footer.php
sidebar.php
<?php get_footer(’top’); ?>
<?php get_header(’top’); ?>
<?php get_sidebar(’top’); ?>
front-page.phpheader-top.php
footer-top.php
sidebar-top.php
<?php get_footer(); ?>
<?php get_header(); ?>
<?php get_sidebar(); ?>
index.phpheader.php
footer.php
sidebar.php
<?php get_footer(’top’); ?>
<?php get_header(’top’); ?>
<?php get_sidebar(’top’); ?>
front-page.phpheader-top.php
footer-top.php
sidebar-top.php
<?php get_footer(); ?>
<?php get_header(); ?>
<?php get_sidebar(); ?>
index.phpheader.php
footer.php
sidebar.php
<?php get_footer(’top’); ?>
<?php get_header(’top’); ?>
<?php get_sidebar(’top’); ?>
front-page.phpheader-top.php
footer-top.php
sidebar-top.php
<?php get_footer(); ?>
<?php get_header(); ?>
<?php get_sidebar(); ?>
index.phpheader.php
footer.php
sidebar.php
<?php get_footer(’top’); ?>
<?php get_header(’top’); ?>
<?php get_sidebar(’top’); ?>
front-page.phpheader-top.php
footer-top.php
sidebar-top.php
<?php get_footer(); ?>
<?php get_header(); ?>
<?php get_sidebar(); ?>
index.phpheader.php
footer.php
sidebar.php
<?php get_footer(’top’); ?>
<?php get_header(’top’); ?>
<?php get_sidebar(’top’); ?>
front-page.phpheader-top.php
footer-top.php
sidebar-top.php
<?php get_footer(); ?>
<?php get_header(); ?>
<?php get_sidebar(); ?>
index.phpheader.php
footer.php
sidebar.php
<?php get_footer(’top’); ?>
<?php get_header(’top’); ?>
<?php get_sidebar(’top’); ?>
front-page.phpheader-top.php
footer-top.php
sidebar-top.php
<?php get_footer(); ?>
<?php get_header(); ?>
<?php get_sidebar(); ?>
index.phpheader.php
footer.php
sidebar.php
<?php get_footer(’top’); ?>
<?php get_header(’top’); ?>
<?php get_sidebar(’top’); ?>
front-page.phpheader-top.php
footer-top.php
sidebar-top.php
<?php get_footer(); ?>
<?php get_header(); ?>
<?php get_sidebar(); ?>
index.phpheader.php
footer.php
sidebar.php
<?php get_footer(’top’); ?>
<?php get_header(’top’); ?>
<?php get_sidebar(’top’); ?>
front-page.phpheader-top.php
footer-top.php
sidebar-top.php
![Page 58: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/58.jpg)
事業内容ページの例
![Page 59: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/59.jpg)
事業内容ページの例sidebar-service.phpを読み込んだ固定ページテンプレートpage-service.phpを使用
page-service.php
![Page 60: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/60.jpg)
事業内容ページの例sidebar-service.phpを読み込んだ固定ページテンプレートpage-service.phpを使用
page-service.php
page-wide.php
事業内容のトップはサイドバー無しのテンプレートを適用
![Page 61: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/61.jpg)
お知らせ一覧 index.php
個別記事single.php
トップページ front-page.php
当社について page.php
事業案内 page-wide.php
アクセス page-wide.php
お問合せ page-wide.php
事業案内1 page-service.php
事業案内2 page-service.php
![Page 62: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/62.jpg)
カスタム投稿タイプは
プラグインや
ジェネレーターで対応
![Page 63: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/63.jpg)
ジェネレーターサイトを使うカスタム投稿
カスタムタクソノミー
カスタムメニュー
ウィジェットなど。
必要箇所をいれればコードを生成してくれる。
http://generatewp.com/
![Page 64: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/64.jpg)
index.php
header.php
sidebar.php
content.php
footer.php
style.css
条件分岐多めのテーマもあります
ループ部分が1ファイルに まとめられたテーマもあります。
![Page 65: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/65.jpg)
条件分岐を覚えれば
比較的簡単に出来ます。
![Page 66: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/66.jpg)
アーカイブだったら?<?php if (is_archive()): ?>
アーカイブだったら表示
<?php else: ?>
アーカイブ以外はこの部分を表示します。
<?php endif; ?>
!
「:」コロンに注意
![Page 67: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/67.jpg)
スマホかタブレットだったら?<?php if (wp_is_mobile()): ?>
スマホかタブレットならここを表示
<?php endif; ?>
![Page 68: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/68.jpg)
ちょこっとずつ
やってれば慣れます。
![Page 69: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/69.jpg)
ウィジェットやカスタムメニュー
を使えると幅が広がります。
Codex見てみましょう。
![Page 70: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/70.jpg)
ウィジェットで更新しやすくしたりPC苦手な人でもウィジェットなら更新できる…かもしれない。
![Page 71: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/71.jpg)
テーマフォルダ内の画像を読み込む場合テーマフォルダ内の画像を指定する
<img src="<?php echo get_template_directory_uri(); ?>/img/
logo.png" />
![Page 72: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/72.jpg)
少しずつ覚えれば大丈夫
![Page 73: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/73.jpg)
プラグイン紹介
![Page 74: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/74.jpg)
高機能で便利な Jetpackこれでもかというほど高機能。
ウィジェットの表示条件を
指定できるようになったり、
ソーシャル連携出来たり、
シンプルなアクセス解析を
見る事が出来たり。
https://wordpress.org/plugins/jetpack/
![Page 75: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/75.jpg)
記事を複製できる Duplicate Postほぼ同じ内容で日付だけ変えて
公開したいような場合に便利。
https://wordpress.org/plugins/duplicate-post/
![Page 76: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/76.jpg)
共通で使う要素を管理する Buckets共通パーツをまとめておける。
ショートコードで呼び出し。
営業日とか料金表とか複数のペー
ジで共通で使う場合など。
https://wordpress.org/
plugins/buckets/ショートコードで呼び出し
![Page 77: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/77.jpg)
画像のトリミング指定が出来る Post Thumbnail Editor
画像のトリミング指定が出来る
プラグイン。
個別にトリミング出来るので
微調整したい場合などに便利。
https://wordpress.org/
plugins/post-thumbnail-editor/
![Page 78: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/78.jpg)
ウィジェットにバナーを貼れる Image Widget
HTMLの知識がなくても
ウィジェットエリアにバナーを
貼れるプラグイン。
タイトルを入力しなければ、
画像のみのバナーとして
利用できる。
http://wordpress.org/plugins/image-widget/
![Page 79: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/79.jpg)
アイキャッチ画像を自動で設定してくれる
Auto Post Tumbnail
自動でアイキャッチ画像を設定し
てくれる。サムネイルの設定忘れ
などが無くなる。
クライアントワークの場合、説明
しなくても良い。
http://wordpress.org/plugins/
auto-post-thumbnail/
![Page 80: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/80.jpg)
管理画面の権限を指定出来る Adminimize管理画面のメニューの
表示権限を設定出来る。
https://wordpress.org/
plugins/adminimize/
![Page 81: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/81.jpg)
画像を再生成してくれる Force Regenerate Thumbnails
テーマで定義されてる画像サイズ
を再生成してくれるプラグイン。
不要な画像サイズは削除してくれ
る。
https://wordpress.org/
plugins/force-regenerate-
thumbnails/
![Page 82: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/82.jpg)
表側で編集が出来る WordPress Front-end Editor
フロント側で記事の編集ができる。プレビューして確認などの必要が
なくなる。いずれはデフォルトの機能になるかも。
https://wordpress.org/plugins/wp-front-end-editor/
![Page 83: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/83.jpg)
シンプルにお知らせを表示する Notification-Box
シンプルにメッセージを出すための
ウィジェットプラグイン。
テキストウィジェットよりは
もうすこし目立たせたい場合などに。
!
https://github.com/ytbdken/Notification-Box
![Page 84: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/84.jpg)
設定値をいじれば
下の要素とくっつけたり、
連続で表示して簡易的な
デザインアクセントとしても
利用可能。
![Page 85: テーマ作成初心者向け Word pressサイト構築のポイントと 便利なプラグイン](https://reader034.vdocuments.mx/reader034/viewer/2022052506/556f641cd8b42a9d338b4609/html5/thumbnails/85.jpg)
ありがとうございました