Wanting fixed button size in Shoreditch Theme

  • Unknown's avatar
    williamantonlee · Member ·

    Is there short code I can use to get fixed size buttons when using the Shoreditch Theme? Thank you in advance for your help.

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    musicdoc1 · Member ·

    Hi,

    In the Extras section of the Shoreditch theme guide, under Buttons, you’ll find the HTML codes for two different button sizes, called “button” and “button minimal” respectively. The codes: 

    <a href="https://shoreditchdemo.wordpress.com/" class="button">Button</a>

<a href="https://shoreditchdemo.wordpress.com/" class="button minimal">Button Minimal</a>

    Is that what you were asking for, or did you mean something else? The vertical width of the button will vary depending upon the number and types of characters included in the button text.

  • Unknown's avatar
    williamantonlee · Member ·

    Thank you for your response. I’ve been using the code you noted. It works as advertised. Nice feature. What I was hoping to do was set a minimum width; trying to get the buttons to have a uniform width. I’m beginning to understand that built in CSS may or may not allow for this. Learning as I go. Not doing too bad for an old guy. ;-)

    Best Regards.

  • Unknown's avatar
    musicdoc1 · Member ·

    Your welcome, William

    I’m beginning to understand that built in CSS may or may not allow for this.

    Yes, I thought you might be referring to CSS code. Staff normally responds to topics in the Themes forum, though on weekends that’s less likely to happen. If no staff member responds here by Monday morning I’d suggest you either add a “modlook” tag to the sidebar of the topic, or submit the request separately to the CSS Customization forum. You may also take either step immediately.

    Regards,
    doc : -)

  • Unknown's avatar
    williamantonlee · Member ·

    Thank you Doc.

  • Unknown's avatar
    musicdoc1 · Member ·

    You’re welcome, William.

  • staff-loquaciousloon · Staff ·

    Hey @williamantonlee!

    There are two ways to set the width of a button. You can do it in-line, on each button by modifying the HTML:

    <a class="button" style="width: 400px;" href="https://shoreditchdemo.wordpress.com/" >Button</a>

    Or, if you have access to Custom CSS through a Premium Plan or Business Plan, you can open My Site > Customize > CSS and add the following:

    .button {
    min-width: 400px;
}

    One thing to keep in mind is that you may have visitors using different screen sizes – so if you make really wide buttons, they might not look right on phones. If that happens, a Media Query in your CSS can help make your CSS only apply to larger screens :)

  • Unknown's avatar
    williamantonlee · Member ·

    Thank you Chad. Great advice. I appreciate the heads up. I’ll give your solution on inline change a go.

  • Unknown's avatar
    williamantonlee · Member ·

    Thank you Chad. Great advice. I appreciate the heads up. I’ll give your solution on inline change a go.

  • staff-loquaciousloon · Staff ·

    You’re welcome!

  • The topic ‘Wanting fixed button size in Shoreditch Theme’ is closed to new replies.