カテゴリー「VK Blocks」の記事

ビジネスサイトの構築に役立つさまざまなブロックとスタイルおよび機能を追加するブロックライブラリです。

このカテゴリーには22の記事があります。

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

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

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

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

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

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

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

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

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

スライダーブロックの背景に動画を使用したカスタマイズ例 - VK Blocks

VK Blocks のスライダーブロックの背景に動画を使用して、人物をクリップ加工した背景透過画像をスライダーで表示したカスタマイズ例です。

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

ステキな新機能が追加されました!! - VK Blocks スライダーブロック

スライダー専用のプラグインよりも多用途・柔軟に使えて、使いやすくて頼りになる VK スライダー、ますます魅力的になりました。

カテゴリー
VK Blocks

スライダーブロックを使ったカルーセルバナーの作成例 - VK Blocks

HTML や CSS などの専門的な知識がない方でも、バナー画像の差し替えやバナーの追加・削除・順番の入れ替えなどの作業をブロックエディター画面でかんたんに行っていただけます。

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

スライダーブロックをサムネイル表示で編集できるようにカスタマイズ

さまざまなブロックを組み合わせて高度で柔軟なレイアウトやデザインを実現できるスライダーブロックをさらに無敵にするカスタマイズです。

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

吹き出しブロックのアイコンを大きくしたカスタマイズ例 - VK Blocks

VK Blocks の吹き出しブロックのアイコンのサイズはやや控えめなので、大きめになるようにカスタマイズしてみました。

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

上下左右に余白を持たせた全画面スライドショー - VK Blocks スライダー

「あ、これいいデザインだな...」と思ったスライドショーがあって、VK Blocks のスライダーブロックをカスタマイズして同じように作ってみました。

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

スライダーで作ったスライドショーにサムネイルを表示 - VK Blocks

VK Blocks のスライダーブロックで作ったスライドショーにサムネイルを表示したカスタマイズ例です。

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

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

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

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

スライダーとクエリーループで新着記事をカルーセル表示 - VK Blocks

有料版の VK Blocks Pro を使わなくても、組み合わせのアイディア次第でここまでできるんです。

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

全画面表示のスライドショー例 - VK Blocks スライダーを使用

カバーブロックと組み合わせて、CSS でカスタマイズしました。

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

スライダーの前後ボタンとページネーションを外に出してみた - VK Blocks

前後ボタンは画面幅が1200px以上のときだけ外側に表示するようにメディアクエリで調整してあります。

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

全幅のスライダーブロックの最大幅を指定したカスタマイズ例 - VK Blocks

スライドショーやスライダーを全幅で表示すると、フルHDやそれ以上の大きな画面で見たときに「大き過ぎる」と感じてしまう方もいらっしゃると思います。

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

VK Blocks 無料版でスライダーブロックが使えるようになった

従来は Pro版 だけで使える機能だったスライダーブロックが 無料版 VK Blocks でも使えるようになりました。

カテゴリー
VK Blocks

Hover.css を使って VK ボタンをカスタマイズしてみた

VK ボタンと Hover.css のスタイルがバッティングしたり相性が悪かったりするので調整が必要ですが、調整してしまえば使いやすいです。

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

VK ボタンでアイコンとインライン文字のサイズ変更ができるようになった

VK Blocks 1.40.* にアップデートすると、VK ボタン ブロックのアイコンとインライン文字のサイズ変更ができるようになります。

カテゴリー
VK Blocks

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

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

カテゴリー
VK Blocks

VK ボタンのカスタマイズ例 - マウスホバーでアイコンがアニメーション②

VK Blocks のボタンをカスタマイズして、マウスホバー時にアイコンがアニメーション動作するようにしてみました。【続編】

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