Change style of contact form to mimic other themes

pending (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 #

Reply

You must log in to post.

Construct WordPress Theme
Construct wordpress theme
Myriad WordPress Theme
Myriad wordpress theme
Method WordPress Theme
Method wordpress theme
Fusion WordPress Theme
Fusion wordpress theme
Elegance WordPress Theme
Elegance wordpress theme
Echelon WordPress Theme
Echelon wordpress theme
Dejavu WordPress Theme
Dejavu wordpress theme
Modular WordPress Theme
Modular wordpress theme