[ 質問者返信待ち ] Lightning G3 Evergreen使用時のボタン形状変更の件

[Hisashi Endo]

■ WordPress のバージョン
6.3.1

■ テーマ・プラグインは全て最新版で確認してください。
確認しました。

■ テーマの種類
Lightning ( G3 ) + Lightning G3 Pro Unit

■ テーマのバージョン
Lightningバージョン: 15.12.1

■ Pro Unit のバージョン
Lightning G3 Pro Unit　バージョン0.25.1

■ スキンの種類
Evergreen

■ スキンのバージョン
バージョン 0.2.3

■ 期待する動作
Lightning G3 Evergreen使用時のボタン形状（角丸など）を変更したい。
通常ページに加え、トップページスライドに挿入できるボタンについて、角丸やべた塗りから背景なしに変更したい。

■ 自分で試した事
通常操作においては、各ページのボタンにてブロックより操作したが、角丸の形状変更やトップページスライドにおけるボタンの形状変更ができない。

■ 症状が発生するブラウザ
Chrome

■ 実際の症状
初期値では、角がかなり丸い状態、かつべた塗状態。

---

該当URL : https://*********

※該当URLはフォーラムライセンスが有効のユーザーにのみ表示されます

[うなこ]

Evergreenのスキン自体にVK Blocks のボタンを丸くするcssが書いてありますので、CSSで打ち消す必要があります。

カスタマイズの「追加CSS」などに、以下のCSSを追加してください。5pxの数字はお好みで変更してください。

.btn:not(.header-top-contact-btn a) {
    border-radius: 5px;
}

角丸やべた塗りから背景なしに変更したい。

背景無しに変更するのは、ボタンの設定から変更可能です。ボタンを選択し、右側のボタン設定から「ボタンスタイル」を「背景無し」にしてください。（添付画像参照）

———–

もう一つの案として、WordPress側のボタンブロックを使用するという手もあります。WordPress側のボタンブロックですと、内側の余白や文字の大きさなど自由に変更できます。
ただ、VK BlocksのボタンのようにFontAwesomeアイコンはボタン内に設置できませんので、お好みに応じて試してみてください。

Attachments:

You must be logged in to view attached files.

[投稿者]

投稿