「CSS」というタグがついている記事

このタグが付いた記事は65あります。

スライドショーの幅をコンテナ幅に合わせるカスタマイズ

Lightning のスライドショーは初期状態では画面幅いっぱいに表示されますが、スライドショーの幅を小さくしたくなることもあると思います。そのようなときのカスタマイズの一例を紹介します。

カテゴリー
Lightning G3カスタマイズ

パソコンで右に、スマホで下にメニューを固定表示するカスタマイズ例

お客様の側でかんたんにメニューの中味を書き換えていただけるようになっています。

カテゴリー
Lightning G3カスタマイズ

グローバルナビの任意の項目を画面の右端に固定表示するカスタマイズ例

HTML / CSS に関する知識をお持ちでないお客様側でも 外観 ⇒ メニュー で右端に固定表示するナビ項目を自由に設定・差し替えできるようになっています。

カテゴリー
Lightning G3カスタマイズ

スクロール時にヘッダーロゴ画像を表示するには - Lightning G3 無料版

このカスタマイズは CSS だけでできます。

カテゴリー
Lightning G3カスタマイズ

グローバルナビの最後の2項目を画面の右端に固定表示するカスタマイズ例

このカスタマイズを行っておくことによって、HTML/CSS をいじらなくてもいいので、誰でもかんたんに 外観 ⇒ メニュー で右端の2項目を設定(差し替えも)できるようになっています。

カテゴリー
Lightning G3カスタマイズ

モバイルナビのカスタマイズ例

Lightning G3 のモバイルナビをモノクロのダークカラーでカスタマイズしてみました。

カテゴリー
Lightning G3カスタマイズ

VK Filter Search カスタマイズ例 - アマゾンっぽい小さい検索ボックス

VK Filter Search ブロックをカスタマイズして、アマゾンの検索ボックスのようなデザインでコンパクトなものにしてみました。

カテゴリー
カスタマイズその他

画像ブロックを下余白なしにするやり方

作業が楽になってきていて、これから CSS のコードを書く機会がだんだん減っていく傾向のように感じています。

カテゴリー
VK Blocks

段落やテーブル内のテキストリンクをボタンにするカスタマイズ

WordPress のブロックエディターで、段落やテーブルの中のテキストリンクをボタンのようなスタイルにするやり方を考えてみました。

カテゴリー
WordPressカスタマイズ

グローバルナビメニューのお問い合わせだけスタイルを変えてみました②

グローバルナビメニューの最後にある お問い合わせ が目立つようにスタイルを変えてみました。※スクロール時 (.header_scrolled) とタブレット (.device-mobile) の表示に対応

カテゴリー
Lightning G3カスタマイズ

グローバルナビメニューのお問い合わせだけスタイルを変えてみました

グローバルナビメニューの最後にある お問い合わせ が目立つようにスタイルを変えてみました。

カテゴリー
Lightning G3カスタマイズ

CSS グリッドレイアウトを使った画像のレイアウト例

CSS グリッドレイアウトを使うと、柔軟で複雑なコンテンツの配置が可能になります。フレックスボックスと使い分けて活用したいですね。

カテゴリー
その他

CSS だけでアコーディオンを実装しました (Lightning 無料版)

JavaScript を使わずに CSS だけでアコーディオンを実装するやり方を紹介します。

カテゴリー
カスタマイズ

外部リンクに Font Awesome アイコンをつけるカスタマイズ

段落内のテキストリンクに自動的に Font Awesome アイコンをつけるやり方を紹介しています。

カテゴリー
Lightning G3カスタマイズ

メディアとテキストブロック (WordPress) のカスタマイズ例

WordPress 標準の「メディアとテキスト」ブロックを CSS でカスタマイズして、テキストをずらしてメディアに重ねたデザインにしてみました。

カテゴリー
WordPressカスタマイズ

CSS で縦中横のスタイルを設定するやり方

text-combine-upright プロパティを使って、CSS で縦中横のスタイルを設定できます。

カテゴリー
その他

アーカイブページでのカテゴリー表示のスタイルを変更しました

カテゴリー名をアイキャッチ画像に重ねて表示していましたが、見づらいので、カードの上にタブ形式で表示するスタイル に変更しました。

カテゴリー
カスタマイズ

投稿や固定ページのページヘッダーの画像を個別に設定するやり方

編集画面で カスタム CSS に行を追加します。Lightning G3 Pro Unit でも投稿の編集画面にはページヘッダー画像設定がありませんので、この記事で紹介したやり方で設定します。

カテゴリー
Lightning G3カスタマイズ

ハンバーガーメニューのボタンを目立たせるカスタマイズ

デフォルトのハンバーガーボタンのままだと控えめなので、ボタンが目立つように CSS で飲食店向けにカスタマイズして、さらにパソコン、タブレットでも使えるようにしました。ペットサロン向け・カットサロン向けのパターンもあります。

カテゴリー
Lightning G3カスタマイズ