Design looks bad

Hi Rebeca,

It’s not very easy to make the plugin to look ok with every existing theme , but if you want you can give me the URL to your site and I can try to give you some custom code to make the form look a little bit better with the theme you are using.

Regards,
Rodica

https://sietede.com/contacto/

Hi Rebeca,

You can try to install https://www.ads-software.com/plugins/simple-custom-css/ and go to Appearance -> Custom CSS and add this:

.pirate_forms_wrap input, .pirate_forms_wrap textarea {
    color: #666;
    border: 1px solid #dedede;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    padding: 10px;
    width: 300px;
}
.pirate_forms_wrap textarea {
    height: auto;
    min-height: 150px;
}
.pirate_forms_wrap input[type="submit"] {
    background-color: #0A0A0A;
    border: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 12px;
    line-height: 1.6;
    border: none;
    padding: 10px 30px 10px 30px;
    color: #ffffff;
    font-weight: bold;
    margin-bottom: 10px;
}
.pirate_forms_wrap input[type="submit"]:hover {
   background-color:#272525;
}

Let me know if it helps.
Best regards,
Rodica

everything fine, unless the send button.

Hi Rebeca,

Could you please give me more details of what is wrong with the send button? Because I can’t see the changes on your site.

Regards,
Rodica

Looks like this https://i.imgur.com/8jbPr7e.png

Hi Rebeca,

Please also add this code:

button#pirate-forms-contact-submit {
 background-color: #0A0A0A;
    border: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 12px;
    line-height: 1.6;
    border: none;
    padding: 10px 30px 10px 30px;
    color: #ffffff;
    font-weight: bold;
    margin-bottom: 10px;
}

Regards,
Rodica

I just installed a theme that recommended Pirate Forms, but I’m having problems with the layout as well. The first three boxes are in a horizontal row above the message box (see screen grab below). How can I align them vertically like most forms?

View post on imgur.com

Thanks.

Hi,

Can you give me your site URL so I can take a look?

Regards,
Rodica

Here’s the link. It’s a test site right now, so it’s a work in progress.

https://www.arossphoto.com/wordpress/contact/

Thanks.

Hi,
You can try to install https://www.ads-software.com/plugins/simple-custom-css/ and go to Appearance -> Custom CSS and add this:

.pirate_forms_wrap .form_field_wrap {
  width: 100% !important;
}
.pirate_forms_wrap .form_field_wrap input {
  width: 100% !important;
}

Let me know how it works.

Regards,
Rodica

Thanks, that worked! I set the width to 90%, which made the top three boxes a little shorter than the message box. It’s a little thing, but I prefer the way it looks.

Cheers.

Hi,

I am really happy to hear everything is ok.
You can always leave us a review here: https://www.ads-software.com/support/view/plugin-reviews/pirate-forms if you wish. It would help us a lot.

Best regards,
Rodica