Lightning をアップデートして（OriginIIで）表示が崩れたらここを確認しよう（2019年末版）

12月になりまして、この記事は「WordPress Theme Lightning Advent Calendar 2019」の最初の投稿となります。本題に入る前にAdvent Calendarについて記載します。

Advent Calendarとは

本題に入る前にこの記事を読んでいる方で「アドベントカレンダーって何？」って思う方も多いかと思います。

Adventarの記載を引用すると

Advent Calendarは本来、12月1日から24日までクリスマスを待つまでに1日に1つ、穴が空けられるようになっているカレンダーです。WebでのAdvent Calendarは、その風習に習い、12月1日から25日まで1日に1つ、みんなで記事を投稿していくというイベントです。

AdventarではAdvent Calendarの作成や登録などを行うことができます。

と、記載されています。

もう少し具体的に説明すると、まず最初にカレンダーに自分が『この日に書くよ』って事を登録して、自分のブログに記事を書いて自分が登録した日付で記事を公開。します。

記事の最初にはこの記事がアドベントカレンダーの記事である旨書きます。

この記事は「WordPress Theme Lightning Advent Calendar 2019」の12月1日の記事になります。
前回の◯◯さんの「◯◯さんすてき」の記事に引き続き、◯◯について書きたいと思います。

みたいな感じではじまり、本文を書いて、最後は

次は◯◯さんが◯◯について書いてくれるそうです。

というように書いて読者がアドベントカレンダーの記事を見てくれるように紹介すると良いです。

公開したら、「WordPress Theme Lightning Advent Calendar 2019」にどんなタイトルで書いて、どこで公開してあるかURLを記載します。

まだまだ登録枠が沢山ありますので、LightningやBizVektorの気に入っている所、ここを改善してほしいという所、こんな使い方出来るなど、どんどん書いて貰えるとウレシイです。

ちなみに昨年のアドベントカレンダーはこちらになります。

では本題行ってみましょう！

最近アップデートしたら表示が崩れた！

最近 Lightning をアップデートしたら表示が崩れた！という方がいるかもしれません。そんな方は以下の点を確認してみてください。

外観 > カスタマイズ 画面の Lightning デザイン設定 で、デザインスキンを Origin にすれば従来の状態に戻せますが、今後は Bootstrap4 ベースの スキンで機能追加や保守となっていくので、OriginII または 他のBootstrap4系の有料スキンに移行していく事をおすすめします。

崩れる原因

はい、ずばり、以下の2点が原因の可能性が高いです。

修正方法

header.phpを例にとると以下のように変更されているので、親テーマのファイルと、自分がカスタマイズしている子テーマのファイルを見比べて、class名の出力部分を修正してください。

Lightning Pro 1系 / Lightning 6系以前

<header class="navbar siteHeader">

Lightning Pro 2系 / Lightning 7系以降

<header class="<?php lightning_the_class_name( 'header' ); ?>">

あわせて確認ください

以下の点もあわせてご確認ください。

この記事を書いた人

石川栄和代表取締役

名古屋のウェブ制作会社数社に10年程度務めた後、株式会社ベクトル設立。
企画・運営・コンサルティング〜WordPressを中心としたシステム開発まで幅広く携わる。
[ 著書 ]
・いちばんやさしいWordPressの教本（共著）
・現場でかならず使われているWordPressデザインのメソッド（共著）
[ 最近のWordPressコミュニティでの活動 ]
WordCamp Tokoy 2023 セッションスピーカー
WordCamp Asia 2023 セッションスピーカー（LT）
WordCamp Niigata 2019 セッションスピーカー
WordCamp Haneda 2019 セッションスピーカー
WordCamp Osaka 2018 セッションスピーカー
WordCamp Kyoto 2017 セッションスピーカー
他

最近の投稿

• WordPress2023年12月1日Lightning のヘッダーやフッターをブロックで自由に変更できるよ
• WordPress2023年11月3日WordPress 6.4 で追加された wp_admin_notice() で管理画面に通知を表示してみた
• WordPress2023年11月3日WordPress 6.4 で追加された theme.json でのレイアウトコントロール（ allowEditing ）の無効化設定について
• WordPress2023年11月2日WordPress の theme.json での流体タイポグラフィ（Fluid typography）と 6.4 での 最大・最小 ViewportWidth 指定の覚書

ご好評につきキャンペーン期間延長！
Vektor Passport

を買って

Evergreen を
無料でダウンロードしよう

Lightningで使えるおしゃれなデザインスキン / コンテンツデータを試せるチャンス！

キャンペーンを詳しく見る