ボタンリンクの文字について



  • 0_1646276645162_48420816-80DC-48AA-B62C-D236D00E6394.jpeg

    質問です。
    ボタンリンクを作成した際に、写真のように文字列が2列になってしまうのですが、一列に収める方法はありますか?0_1646276729344_DB8F3020-1778-4113-AAB7-4AEA23783A3D.jpeg


    マニュアル確認済み
    キャッシュクリア済み
    プラグイン全停止済み
    WordPressのバージョン :
    ご利用のサーバー名 :
    PHPのバージョン :
    OS :
    ご利用のブラウザ :
    該当サイトのURL :


  • administrators

    @波乗りfamily さん

    こんにちは!JIN運営チームのRyotaです。

    CSSの修正で対応可能だと思います!
    お手数ではございますが、実際の記事のURLを共有いただけますと幸いです。
    宜しくお願いします。



  • https://naminorifamily.com/
    こちらになります。
    ちなみにトップページ上部になります。
    まだ始めたばかりで、無知な質問で申し訳ありません。


  • administrators

    @波乗りfamily さん

    いえいえとんでもないです!
    全然大丈夫なので気にしないでくださいね٩( 'ω' )و

    #block-16 .color-button02 a {
        padding: 12px 48px;
    }
    

    一度これを追加CSSに追加して確認してみてください...!!
    もしこれでも反映されなければまた仰ってください。。



  • ありがとうございます。試してみます。



  • 先程のもので出来ました。

    ですが、少し文字の大きさを変更したら元に戻ってしまいました。
    文字の大きさが変わったら対応しないのでしょうか?


  • administrators

    @波乗りfamily さん

    大きさを変更するとそうなってしまいますね。。
    今回は改行されてしまう箇所を強制的にCSSで変更しているので、JINの標準機能には対応していないカスタマイズになる特性上どうしてもそういうイレギュラーは出てきてしまいます。。

    ただ文字サイズだけを反映させたいのであれば、それも修正するCSSを書くことで対応できます!
    (他にも大きさに関する変更を行う場合、それに応じてCSSの追加・修正が必要になるので予めご了承ください。。)

    #block-16 .color-button02 a {
        padding: 12px 48px;
    }
    

    横幅が関連しているのでpaddingプロパティの「48px」の数値を小さくしていくことで対応が可能です。
    文字サイズや改行、横幅のバランスは@波乗りfamily さんの方で取って修正していただけるとありがたいです。

    カスタマイズに関してはCSSを追加することで希望通りのデザインはできるものの、テーマの機能によっては正しく反映されなかったり対応しきれなかったりすることがあるので取り扱いには注意が必要かもです...!!
    (これぐらいの修正やカスタマイズであれば全然OKなのですが、カスタマイズは基本的に自己責任という認識で持っていただければ嬉しいです٩( 'ω' )و)



  • 丁寧なご対応ありがとうございました。


  • administrators

    @波乗りfamily さん

    いえいえです!
    また何かあったらトピック立てていただけると嬉しいです!

    今後ともどうぞ宜しくお願いします!
    (ご確認いただけたら、返信は不要です...!!)