WordPressテーマ「Lightning」カスタム

今から10年近く前にワードプレスのテーマをいちから作って制作したサイト「姫路ガハハゲストハウス」

今見てもデザイン的（デザインは母ちゃん）には十分色あせてなくて、気に入っていたんだが、やはりスマホ対応しなければという事で少しだけやり替えた。

さすがに予算的にもゼロからテーマを作り上げるのはもう個人では無理なので、最近はある物（有料・無料の改修可能テーマ）を使うようにしている。

その中でも圧倒的に触りやすいのはやはり「Lightning」だろう。という事で今回もライトニングで改修を行った。

今回行ったいくつかの「Lightningの改修点」

まずトップのスライドショーの全幅1900を小さくした。

「lightning」のスライドショーの幅を変更

これは追加のCSSだけで行える。

.carousel-inner {
  max-width:1140px;
  margin: 0 auto;
}

max-width:1140px;の1140を任意の数字に置き換えることで幅の変更が可能だ。

「lightning」のフッタコピーライト消去

これは以前にも書いたが毎回やるのでもう一度書いておく
追加CSSに以下を追記。

footer .copySection p:nth-child(2) {
display:none !important;
}

「lightning」の固定ページタイトル部分の帯の削除

「Lightning」で固定ページのタイトルやカテゴリー名などのタイトルが入る部分の帯を削除した。

追加CSSに以下を追記

.col-md-12 {
display:none !important;
}

「lightning」のメニューを画像で表示させる。

これはライトニングに限らず全てのWordpressテーマ共通だが、メインのナビメニューを画像表示させた。

このようになる。

これはもうメニュー設定からナビゲーションラベルに
＜img src=https://フォルダ名/フォルダ名/画像.ｇiｆ＞と指定すれば良い。
実際の画面だとこうなる。

「lightning」のヘッダー背景の変更。

後はヘッダーもページ背景と同じ画像を使ったので追加SSに

/* ヘッダー背景 */
.siteHeader {
    background: url(
https://フォルダ名/フォルダ名/背景.gif);
}

 
以上を追記。

とりあえずこんなところだろうか。
まだもう少し改修するのでまた追加で書いていくとする。