【重要】 Lightning 10系 / Pro 5系の変更点について


  1. 製品更新情報
  2. Lightning
  3. 【重要】 Lightning 10系 / Pro 5系の変更点について

この記事は2年以上前に公開されたものです。最新の情報を参考にしてください。

Lightningのご利用ありがとうございます。2020年6月15日夜頃アップデート予定のLightning 10系 / Lightning Pro 5系 の変更点は以下の通りです。

[ 仕様変更 ] 詳細ページの記事を囲むhtmlタグをdivからarticleに変更

もし article タグに対してcssをカスタマイズしている方は修正ください。

※HTMLタグのマークアップは変更する事があります。cssでカスタマイズする場合はタグ名に対してではなくclass名に対して行ってください。

[ 機能強化 ] カラムレイアウト指定が投稿タイプ毎に可能に

9系まではアーカイブページや記事の詳細ページを2カラムにするか1カラムにするか選択できましたが、全投稿タイプ共通でしか指定できませんでした。

今回のバージョンアップで、例えば投稿タイプpostのアーカイブページは1カラムに設定しつつ、カスタム投稿タイプ「製品情報」のアーカイブページは2カラムにするという運用が可能になります。

レイアウト変更機能

[ 機能強化 ] キャンペーンテキスト機能の強化(Pro版のみ)

以下の設定が可能になりました。

  • キャンペーンテキストの表示位置が「Header Before」「Header After」「Slide and Page Header After」から選択可能になりました。
  • 表示するページを「トップページで表示」「全てのページで表示」が選択可能になりました。

[ 仕様変更 ] テンプレートファイルの変更

9系までは single.php と page.php がありましたが、この2つのファイルを singular.php に統合し、singular.php から
投稿ページの場合は template-parts/post/content.php を、
固定ページの場合は template-parts/post/content-page.php を読み込む方式に変更しています。

9系までのファイル構造
固定ページpage.php
投稿詳細ページsingle.php
カスタム投稿タイプの例
(event)
single-event.php
10系からのファイル構造
固定ページsingular.phptemplate-parts/post/content-page.php
投稿詳細ページsingular.phptemplate-parts/post/content.php
カスタム投稿タイプの例
(event)
singular.phptemplate-parts/post/content-event.php

※template-parts/post/content.phpの内容よりも外側の部分を投稿タイプ毎で変更する場合は従来通り single-event.php などを用意する形になります。

この方式のメリット

カスタム投稿タイプ毎に詳細ページのテンプレートを変更したい場合に、single.phpを複製する形になりますが、実際はヘッダーやページヘッダー、パンくずやサイドバーなどの部分は共通のケースが多いと思います。

それなのに外側も含めたカスタマイズファイルが増えてしまうと、バージョンアップで外側のHTMLに変更が出た場合に、それに合わせて投稿タイプ毎全てのファイルを変更する必要が出てしまいますが、今回の構造では変更するファイル数が少なく済みます。

ただし、既にsingle-***.phpがある場合はそのファイルが優先して読み込まれるので直ちに不具合が出る事はありません。
ただ、今回フック追加したり構造変更してるので、今後弊社ブログなどで紹介する何かしらのカスタマイズコードを貼り付けたけど効かないとかそういうレベルはあるかもしれません。

[ 仕様変更 ] モバイル端末をphp処理ではなくJavaScriptに変更

タッチデバイスかそうでないかをphpで判定して出し分けていましたが、その方式の場合静的HTMLを出力するサービスや、サーバーキャッシュを使った高速化をするサイトで正しく端末判定されないためJavaScriptでの処理に変更しました。

[ その他 ] フックの追加

以下のアクションフックを追加しました

  • lightning_top_slide_before
  • lightning_top_slide_after
  • lightning_additional_section
  • lightning_siteContent_container_apepend
  • lightning_siteContent_apepend
  • lightning_loop_item_after

投稿ループ中に一定件数毎に広告を挿入するためのフックを追加しました。

例えば子テーマのfunctions.phpなどに下記のように書くと3の倍数の記事の後に要素を挿入できます。

// 無料版の表示形式に挿入
function my_add_loop_ads($loop, $options){
	global $vk_posts_loop_item_count;
	if ( ( $vk_posts_loop_item_count % 3 ) == 0 ){
		$loop .= '<div>追加'.$options['layout'].'</div>';
	}
	return $loop;
}
add_filter( 'vk_posts_loop_middle', 'my_add_loop_ads',10, 2 );
// 投稿リストブロックやPro版の表示形式に挿入
function my_lightning_add_loop_ads(){
	global $lightning_loop_item_count;
	if ( ( $lightning_loop_item_count % 3 ) == 0 ){
		echo '<div>追加</div>';
	}
}
add_action( 'lightning_loop_item_after', 'my_lightning_add_loop_ads' );

フルサイト編集に対応したブロックテーマ X-T9

フルサイト編集対応ブロックテーマ

WordPress テーマ X-T9 は、WordPress 5.9 から実装されたフルサイト編集機能に対応した「ブロックテーマ」と呼ばれる新しい形式のテーマです。
ヘッダーやフッターなど、今までのテーマではカスタマイズが難しかったエリアもノーコードで簡単・柔軟にカスタマイズする事ができます。

パターンを使って

よりクオリティの高いサイトに

パターンとは、WordPressのブロックを組み合わせて作ったデザインテンプレートのようなもの。プロのデザイナーが制作したパターンを300以上公開中!コピペしながら高品質なサイトを簡単に作れます。

VK AB Testing は、ABテストを実施するための WordPress 用プラグインです。ブロックエディターでテストパターンを自由に作成でき、ランダム表示とクリック計測が可能です。Webサイトや広告などの施策の改善にぜひご活用ください。

PAGE TOP

このデモサイトは Vektor,Inc. のテーマとプラグインで構築されています。ご購入や詳細情報は下記のリンクもご参考ください。