Title: Send button style Last modified: August 24, 2016 --- # Send button style * Resolved [stevenschelfhout](https://wordpress.org/support/users/stevenschelfhout/) * (@stevenschelfhout) * [11 years, 2 months ago](https://wordpress.org/support/topic/send-button-style-2/) * Hello, * My send-button just looks like a plain button without any style or format. * How / where can I change this look? Is this theme-related, or plugin-related? I would like it to look like the button on my contact form (comes with theme). Screenshots of both: * [https://www.dropbox.com/sh/n4r7qgph88uuc61/AADs2vxry4WeIHgKOqR–jEFa?dl=0#/](https://www.dropbox.com/sh/n4r7qgph88uuc61/AADs2vxry4WeIHgKOqR–jEFa?dl=0#/) * Thank you so much! * [https://wordpress.org/plugins/restaurant-reservations/](https://wordpress.org/plugins/restaurant-reservations/) Viewing 5 replies - 1 through 5 (of 5 total) * [NateWr](https://wordpress.org/support/users/natewr/) * (@natewr) * [11 years, 2 months ago](https://wordpress.org/support/topic/send-button-style-2/#post-6001477) * This is theme-related. Your theme author should be able to help. If you post a link to your site I’m happy to take a look and make a recommendation. * Thread Starter [stevenschelfhout](https://wordpress.org/support/users/stevenschelfhout/) * (@stevenschelfhout) * [11 years, 2 months ago](https://wordpress.org/support/topic/send-button-style-2/#post-6001496) * Always welcome to take a look if you have the time … * The reservation url: [http://www.madeleine-oudenburg.be/?page_id=3495](http://www.madeleine-oudenburg.be/?page_id=3495) Contact form button: [http://www.madeleine-oudenburg.be/?page_id=3528](http://www.madeleine-oudenburg.be/?page_id=3528) * And as long as you’re making recommendations ;-): how can move the “add a message” field (here “Heb je nog een extra vraag?”) to the left? * Thanks a lot! * [NateWr](https://wordpress.org/support/users/natewr/) * (@natewr) * [11 years, 2 months ago](https://wordpress.org/support/topic/send-button-style-2/#post-6001498) * Hi Steven, * Try the following CSS code: * ``` .rtb-booking-form button { display: inline-block; outline: none; cursor: pointer; text-align: center; text-decoration: none; padding: .4em 1.5em .4em 1.5em; color: #fff; background: #4d917b; border: 2px solid #4d917b; text-transform: uppercase; font-size: 13px; font-weight: 600; font-family: 'Open Sans', 'Helvetica Neue', Arial,Verdana,sans-serif; text-shadow: none; margin-right: 5px; text-shadow: none; -webkit-appearance: none; letter-spacing: 2px; box-shadow: 0 0 0 0 !important; line-height: 1.5 !important; border-radius: 3px; -webkit-transition: color .2s linear, background .1s linear, opacity .2s linear; -moz-transition: color .2s linear, background .1s linear, opacity .2s linear; -ms-transition: color .2s linear, background .1s linear, opacity .2s linear; -o-transition: color .2s linear, background .1s linear, opacity .2s linear; transition: color .2s linear, background .1s linear, opacity .2s linear; } .rtb-booking-form button:hover { opacity: 0.8 !important; } ``` * That’s just some styles copied from the other button. It may need some further tweaking. * Moving the message field over to the left will be more complicated. It looks like you’ve already modified the booking-form.css file to put the two fieldsets into different columns. The Add Message field is part of the second fieldset. To move it out of that fieldset you’d need to modify the `$fields` array with some PHP code like this: * ``` /** * Move the message field into its own fieldset * @since 0.0.1 */ add_filter( 'rtb_booking_form_fields', 'move_message_field', 10, 2 ); function move_message_field( $fields, $request ) { $fields['message-set'] = array( 'fields' => array( 'add-message' => $fields['contact']['fields']['add-message'], 'message' => $fields['contact']['fields']['message'], ) ); unset( $fields['contact']['fields']['add-message'] ); unset( $fields['contact']['fields']['message'] ); return array_filter( $fields ); } ``` * [lauratejerina](https://wordpress.org/support/users/lauratejerina/) * (@lauratejerina) * [10 years, 10 months ago](https://wordpress.org/support/topic/send-button-style-2/#post-6001680) * Hello! * Any solutions on the ‘Send’ button style? I tried doing it inside the theme files but I couldn’t. Where should I do the modifications? * Thank you very much! * [lauratejerina](https://wordpress.org/support/users/lauratejerina/) * (@lauratejerina) * [10 years, 10 months ago](https://wordpress.org/support/topic/send-button-style-2/#post-6001681) * I used the CSS you provided above and changed the color and the font, but it only changed the appeareance of the button in the mobile version. When seeing my website from a computer, the button still shows the old style. Viewing 5 replies - 1 through 5 (of 5 total) The topic ‘Send button style’ is closed to new replies. * ![](https://ps.w.org/restaurant-reservations/assets/icon-128x128.png?rev=2205491) * [Five Star Restaurant Reservations - WordPress Booking Plugin](https://wordpress.org/plugins/restaurant-reservations/) * [Frequently Asked Questions](https://wordpress.org/plugins/restaurant-reservations/#faq) * [Support Threads](https://wordpress.org/support/plugin/restaurant-reservations/) * [Active Topics](https://wordpress.org/support/plugin/restaurant-reservations/active/) * [Unresolved Topics](https://wordpress.org/support/plugin/restaurant-reservations/unresolved/) * [Reviews](https://wordpress.org/support/plugin/restaurant-reservations/reviews/) * 5 replies * 3 participants * Last reply from: [lauratejerina](https://wordpress.org/support/users/lauratejerina/) * Last activity: [10 years, 10 months ago](https://wordpress.org/support/topic/send-button-style-2/#post-6001681) * Status: resolved