Change style of contact form to mimic other themes

(4 posts) (2 voices)

1. 

   Alex117
   Member

   Hi,

   Is it possible to make the form fields in the Persuasion theme look like the form fields of the Elegance theme?

   I prefer the sharper and more square-like fields of the Elegance theme. I have purchased both themes.

   Can this be done by replacing some image files from one theme to another or by copying the specific CSS of Elegance over to Persuasion?

   Thank you

   Persuasion theme style
   

   Elegance theme style
   

   Attachments

   1. Elegance_-_form_style.png (26.7 KB, 0 downloads) 8 months old
   2. Persuasion_-_form_style.png (13 KB, 1 downloads) 8 months old

   Posted 8 months ago #
2. 

   Ruderic
   Support

   Hi,

   You can remove the rounded corners by adding this code to the "Custom CSS" field, in the theme options panel:

   .contact_form_submit, input[type="text"], textarea {
     border-radius: 0 !important;
     webkit-border-radius: 0 !important;
   }

   Try that and let us know the results.

   Posted 8 months ago #
3. 

   Alex117
   Member

   Thanks,

   It somewhat made it a little similar but it still needs a few touches. Is there any way to replicate the same effect seen on the other themes by just copying the exact CSS code or files over?

   I don't want to make you guys go through too much trouble to complete a patch-up job in the end.

   I'm just looking to clone the style, and I figured since I purchased both themes it wouldn't be too difficult to find the CSS that was responsible for styling the fields and copy it over to the desired theme, seeing as the framework of all your themes seems to be very similar across all of them.

   Any help with that more precise method?

   Thanks

   

   Attachments

   1. Form_field_style.png (26.5 KB, 1 downloads) 8 months old

   Posted 8 months ago #
4. 

   Ruderic
   Support

   Hi,

   You can address those 3 customizations by adding this code to that same "Custom CSS" field:

   select {
     border-radius: 0 !important;
     webkit-border-radius: 0 !important;
   }
   .contact_form_submit {
     border: 2px solid #fff !important;
   }
   input[type="text"], textarea, select {
     background: url("http://themes.mysitemyway.com/elegance/wp-content/themes/elegance/images/textarea.png") repeat-x top left #f9f9f9 !important;
   }

   Posted 8 months ago #

RSS feed for this topic

Reply

You must log in to post.