CSS を使ってカスタマイズなどを行っている記事

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

クエリーループを使ってノーコードで作った投稿リスト + 追加カスタマイズ

日付の部分が特徴的な投稿リストをクエリーループを使ってノーコードで作ってみました。CSS を使った追加カスタマイズも行っています。

カテゴリー
WordPress

オリジナルのモバイル固定ナビ② - ナビゲーションブロックと組み合わせ

この投稿にオリジナルのモバイル固定ナビを実装しました。メニューボタンをタップすると WordPress コアのナビゲーションが開きます。

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

オリジナルのモバイル固定ナビ① - Lightning モバイルナビと組み合わせ

この投稿にオリジナルのモバイル固定ナビを実装しました。メニューボタンをタップすると Lightning のモバイルナビが開きます。

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

VK スライダーで作った左右にゆっくり流れるギャラリー

VK Blocks 1.112.0 の新機能を使って作った動くギャラリーです。

カテゴリー
VK Blocksカスタマイズ

画面遷移せずにクエリーループの投稿リストをカテゴリーで絞り込む

画面遷移をせずに絞り込みを行いたいという需要は一定数あるようで、その需要の多くにはこのカスタマイズで対応できるかもしれないと考えています。

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

上下にジグザグ配置された一定速度でゆっくり動くカルーセル②

VK Blocks のスライダーブロックをカスタマイズしました。お客様に更新していただきやすいようにブロック構成を見直した第2弾です。

カテゴリー
VK Blocksカスタマイズ

上下にジグザグ配置された一定速度でゆっくり動くカルーセル

VK Blocks のスライダーブロックをカスタマイズして作りました。

カテゴリー
VK Blocksカスタマイズ

WordPress コアの RSS ブロックのカスタマイズ例

WordPress コアの RSS ブロックをカスタマイズした例を載せています。

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

画面下部に固定するレスポンシブ対応バナーの制作例

ブロックエディターを使って画像やテキスト、リンク先、背景色の変更を行うことができます。

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

グリッドレイアウトで作った料理レシピのブロックパターン②(CSS で調整)

どの画面幅でもきれいにレイアウトされるように CSS を書いて調整してあります。

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

先頭の文字の背景を白い円にしたカスタマイズ例

どの文字にも適用できるように、汎用性があるやり方にしました。

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

WordPress のギャラリーブロックのカスタマイズ例

デフォルト状態だと使いづらいので、いろいろとカスタマイズしてみました。

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

リストブロックの 数字-丸 と 数字-四角 の番号を小さめにしてみた

単独で使う場合は、「数字が大きくて見やすくていいなぁ...」と喜んで使っていたのですが、複数のスタイルを組み合わせて使ったらアンバランスに感じました。

カテゴリー
VK Blocksカスタマイズ

クエリーループで作った新着投稿に動きを持たせたカスタマイズ例

グラデーションをつけたテキストをゆっくりと動かして、クエリーループで作った投稿リストをカルーセル仕様にしてあります。

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

VK スライダーのカスタマイズ例 - スライドした後で画像がフェードイン

架空のグルメイベントを想定して、登場するシェフの紹介を VK Blocks のスライダーで作ってみました。

カテゴリー
VK Blocksカスタマイズ

スライダーに画像ボタンメニューを重ねたカスタマイズ例② (VK Blocks)

画像ボタンのメニューがスライダーに重なるように CSS でカスタマイズして、工務店サイトをイメージして作ってみました。

カテゴリー
VK Blocksカスタマイズ

開閉するサイドメニューにカスタム投稿タイプを表示するカスタマイズ例

カスタム投稿タイプを表示する仕様になっていますので、WordPress に詳しくない方でもかんたんに表示するコンテンツを切り替えることができます。

カテゴリー
カスタマイズ

ヘッダーに電話番号・お問い合わせボタン・検索窓・ハンバーガーメニューを追加した例

WordPress コアのナビゲーションを使ったオーバーレイメニューと組み合わせてカスタマイズしました。

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

ヘッダーに電話番号とボタンを追加したカスタマイズ例④

VK お問い合わせセクションをウィジェットに配置するやり方を採用していて、WordPress の操作に不慣れな方がコンテンツを変更しても操作ミスでレイアウトがくずれる不安がないので、実案件で使いやすいです。

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

Lightning のサイドバーに背景色を設定してみた

::before 疑似要素を使って背景色を設定してみました。このやり方だと他のところに影響はないはず。

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