Lightningのハンバーガーメニューをカスタマイズする方法!
Lightningのハンバーガーメニューをカスタマイズする方法!

Lightningのハンバーガーメニューをカスタマイズする方法!

WordPressのテーマであるLightningのハンバーガーメニューは、cssコードを追加することでカスタマイズすることが出来ます。

Lightningのハンバーガーメニューの位置を変更する方法を紹介! Lightningのハンバーガーメニューの位置を変更したい この記事では上記の課題を解決します。 WordPressでwebサイトを制作する際、Lightningのテーマを使用する方が多い.

Lightningのハンバーガーメニューをカスタマイズする方法

Lightningのハンバーガーメニューは画像で出来ている

そのため、ハンバーガーメニューをカスタマイズする際は新たに画像を作成する必要があります。

ハンバーガーメニュー画像を変更する方法 .vk-mobile-nav-menu-btn < border: none; background-image: url("ハンバーガーメニューの画像"); background-size: cover; >.vk-mobile-nav-menu-btn.menu-open

url()の中に画像のリンクを入力することで、その画像がハンバーガーメニューに反映されます。

画像リンクの取得方法
  • WordPressに画像をアップロードする
  • アップロードされた画像のリンクを取得する
WordPressに画像をアップロードする

WordPressに画像をアップロードするには、「管理画面」→「メディア」→「新規追加」から出来ます。

アップロードされた画像のリンクを取得する

アップロードされた画像のリンクを取得するには、「管理画面」→「ライブラリ」から画像を選択し、「URLをクリップボードにコピー」を選択すると取得することが出来ます。

取得したリンクは先ほどのurl()の中にコピペします。

コードの追加場所

外観」→「テーマファイルエディター」→「スタイルシート」で入力することが出来ます。

WordPressからテーマをインストールしたものは基本的に親テーマに値します。

詳しくは「Lightningの子テーマを設定する簡単な方法をわかりやすく紹介!」記事を読んでください。

Lightningの子テーマを設定する方法を紹介! この記事では「子テーマを導入する理由」と「Lightningの子テーマを設定する方法」を紹介します。 子テーマとは何か? まず始めに子テーマについて説明します。 子テー.

Lightningのハンバーガーメニューを非表示にする方法

.admin-bar .vk-mobile-nav-menu-btn

ハンバーガーメニュー画像の作成方法

そのため、デザインを変更する際はハンバーガーメニューの画像を新たに作成する必要があります。

ハンバーガーメニュー画像の作り方

どちらのソフトも有料ですが、無料で使用できる期間が設けられています。