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

VWSとは フォーラム Lightning [ 質問者返信待ち ] Lightning G3 Evergreen使用時のボタン形状変更の件

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

  • このトピックには1件の返信、2人の参加者があり、最後にうなこにより8ヶ月、 2週前に更新されました。
2件の投稿を表示中 - 1 - 2件目 (全2件中)
  • 投稿者
    投稿
  • #79860

    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はフォーラムライセンスが有効のユーザーにのみ表示されます

    #79877

    うなこ
    モデレーター

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

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

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

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

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

    ———–

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

    • この返信は8ヶ月、 2週前にうなこが編集しました。
    Attachments:
    You must be logged in to view attached files.
2件の投稿を表示中 - 1 - 2件目 (全2件中)
  • このトピックに返信するにはログインが必要です。