This is searchable archive of our old support forums, which operated from 2012 - 2016. To find out how to get support for your current theme, please visit our support page.

Need To Increase The Height Of The Text Field In My WooCommerce Checkout Page

  • Creator
    Topic
  • #16300
    benlee2828
    Participant

    Dear Sir or Madam,

    I need to figure out how to increase the height of the text fields where customers enter their information on the WooCommerce Checkout Page. My website is http://www.thinktradethink.com and the best way to reach the checkout page is to go to the website and add a product or service into your cart and then you can reach the checkout page. Thanks for all your help in advance!

    Sincerest Regards,
    Benjamin Lee

Viewing 6 replies - 1 through 6 (of 6 total)
  • Author
    Replies
  • #16301
    Jason Bobich
    Keymaster

    Hello Benjamin,

    You may want to also look into getting your self up to date with the theme, Alyeska 3.1 has a little bit better general styling for form elements, but that’s up to you.

    http://themeblvd.com/changelog/?theme=alyeska

    These kinds of things will be CSS customizations you’ll need to make to the theme.

    For CSS changes, it’s a good idea to use a tool like firebug or Google Chrome’s built-in developer tools to locate them and then put the edits either in your child theme‘s style.css or in the “Custom CSS” option on your theme options page.

    So, for example, but using our inspector, we can quickly see the following selectors by WooCommerce being utilized which you could override from your own custom CSS.

    .woocommerce form .form-row input.input-text, 
    .woocommerce-page form .form-row input.input-text {
    	height: 30px;
    }

    Note: I’m looking at just the login/signup page. I’m not sure if the checkout page past that point is different, but you’d use the same method to locate the things you want to customize with CSS.

    Also, here’s a helpful tutorial on how to use Firebug – http://vimeo.com/20917974. The only thing I’d suggest not doing is actually making edits to the theme’s CSS files, as it shows at the end of that video. However, the video serves as a good introduction to Firebug and how it can be used to find what CSS is effecting certain areas of your site without ever digging around in any files.

    #16302
    benlee2828
    Participant

    Thanks! I got it to work on the Checkout Page. I just realized that there is a Coupon Code text field on the Cart Page that is having the same issues but the previous fix did not take care of it. Any ideas?

    Sincerest Regards,
    Benjamin Lee

    #16303
    Jason Bobich
    Keymaster

    When you inspect this item, what do you see for a selector that you could use to target it?

    #16304
    benlee2828
    Participant

    I hate to be a pain in the ass…but I have absolutely no idea what that means. Would giving you the login and password to the Dashboard help?

    #16305
    benlee2828
    Participant

    I looked at firebug and found the element.

    #16313
    Jason Bobich
    Keymaster

    Great, glad you were able to figure it out. Please remember that support doesn’t include providing code customizations. So, when you ask how to make a customization, my goal is to push you in the right direction without just giving it to you.

    http://support.themeblvd.com/help/#terms

Viewing 6 replies - 1 through 6 (of 6 total)
  • The forum ‘Alyeska Responsive WordPress Theme’ is closed to new topics and replies.