新機能紹介
新機能 1
固定ページ
Landing Page
テンプレート
使い方
固定ページ編集画面右側の
ページ属性 → テンプレート の
プルダウンで「Landing Page」を選択
特徴
- 通常の固定ページと違って上部にタイトルとパンくずリストが入らない。
- Landing Page に設定した固定ページ専用のウィジェットエリアが利用出来るようになります。
用途
特殊な商品情報やイベント情報などのキャンペンページを作るためのテンプレート
利用例
注意点
Lightningの場合 本文欄に何か入ってないとお問い合わせボタンとか表示できない。
新機能 2
Custom Post Type Manager
Custom Post Type Manager ?
WordPress標準では「投稿」と「固定ページ」の2系統だけ(BizVektorの場合は「お知らせ(nfo)」を入れた3系統)だけだが、この系統を管理画面から自由に追加する機能
BizVektorでの有効化の仕方
子テーマの functions.phpなどに
get_template_part('plugins/post-type-manager-config');
Lightningでの有効化の仕方
- プラグイン VK All in One Expansion Unit をインストール
- 管理画面 → VK ExUnit で Post Type Manager を有効化
カスタム投稿タイプを作成
- 管理画面左側のメニューの「カスタム投稿タイプ設定」をクリック
- 新規追加
※ パーマリンク設定を必ず保存する
カスタム分類を作成
カスタム分類とは
投稿でいう所のカテゴリーに該当する部分
■ カスタム分類名(スラッグ)
識別用のIDになります。半角英数字で入力
■ カスタム分類名
「カテゴリー」など、実際にウェブサイトに表示される名称
ウィジェットをセットする
投稿タイプを追加すると、その投稿タイプ用のサイドバーのウィジェットエリアが自動的に表示されます(BizVektorは 1.9以降)。
カスタム分類ウィジェットやアーカイブウィジェットを使用して、投稿タイプにあった項目を表示しましょう。
カスタマイズ
子テーマでのカスタマイズ
テーマをカスタマイズする時は必ず子テーマでカスタマイズするようにしてください。
BizVektorの子テーマ
https://bizvektor.com/setting/customize/
Lightningの子テーマサンプル
http://lightning.vektor-inc.co.jp/ja/setting/customize/child_theme
子テーマのメリット
親テーマでカスタマイズしたいファイルを複製して子テーマのディレクトリに配置しすれば親テーマで更新が入っても上書きされる事はありません。
投稿タイプ用のテンプレートの作成
■ 詳細ページ
single-★投稿タイプ名★.php
■ アーカイブページでの1件分
module_loop_★投稿タイプ名★.php
カスタムフィールドを使う
■カスタムフィールドを簡単に作るプラグイン
https://ja.wordpress.org/plugins/smart-custom-fields/
■簡単なフィールドの値の呼び出し方
$post->フィールド名
■注意
エスケープ処理をしてください。
<?php echo esc_html( $post->フィールド名 ); ?>
詳細ページでの利用例
<p><?php echo wp_get_attachment_image( $post->item_image,'large'); ?></p>
<table>
<tr>
<th>価格</th>
<td><?php echo esc_html($post->item_price); ?>円</td>
</tr>
<tr>
<th>品番</th>
<td><?php echo esc_html($post->item_no); ?>円</td>
</tr>
</table>
画像の表示
wp_get_attachment_image() 関数
プラグイン「Smart Custom Field」の場合は画像のID(番号)を保存するので、「$post->フィールド名」を呼び出しても数字しか返ってきません。これをHTMLで表示するには wp_get_attachment_image() 関数を使用します。
<?php echo wp_get_attachment_image( 画像ID,サイズ); ?>
実際の用例は下記のようになります。
<?php echo wp_get_attachment_image( $post->item_image,'medium'); ?>
画像のサイズ
thumbnail : サムネイル
medium : 中
large : 大
full : オリジナルの画像サイズ
ライトニングのデザインスキン作成用サンプルデータ
プラグイン紹介
著者情報表示プラグイン
投稿のリンク先を変更出来る
参考
静的HTMLからWordPressのテーマを作る
https://github.com/wckansai2016/make-wp-theme