• Resolved deborav

    (@deborav)


    Good Afternoon. First of all, thank you for the plugin it’s very good but I’m having some difficulties with the customization thought the css code.

    I want to move the title “Contact Form” to the middle of the page (centered) and also to change the height of my message field. I try to look in the css editor but I’m having some problems. I don’t know if it’s because of the theme I’m using or not since I don’t have the Form Customizer.

    Thank you!

    • This topic was modified 9 years, 7 months ago by deborav.
Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Contributor Tracy Levesque

    (@liljimmi)

    🏳️‍🌈 YIKES, Inc. Co-Owner

    Greetings Deborav,

    May we please have a link to your form?

    Thank you!
    -Tracy

    Thread Starter deborav

    (@deborav)

    Now I have to forms, the first one is the one I’m trying to do similar (used Divi theme), and the other one is the one using the easy forms. Here is the link to the website: http://www.xobaedi.ch/

    Thank you for the quick response.

    Plugin Contributor Tracy Levesque

    (@liljimmi)

    🏳️‍🌈 YIKES, Inc. Co-Owner

    Do you want our form to look just like the first one?

    Thread Starter deborav

    (@deborav)

    Yes, I was trying to do it the most similar possible.

    Plugin Contributor Tracy Levesque

    (@liljimmi)

    🏳️‍🌈 YIKES, Inc. Co-Owner

    Hi Deborav,

    There is quite a bit of styling you need to do to get the 2 forms to look alike

    We can start with the title. This should get it looking like the other form. I copied the exact styles the first form is using.

    h3.yikes-mailchimp-form-title.yikes-mailchimp-form-title-1 {
        font-family: 'Crete Round', Georgia, "Times New Roman", serif !important;
        font-weight: bold !important;
        text-transform: uppercase !important;
        font-size: 49px !important;
        color: #e27616 !important;
        line-height: 1.6em !important;
    }

    The next step would be to set the labels as placeholders.

    Click on a field in the Form Builder to expand it. In the Placeholder field enter the placeholder text you wish to use then click the Hide Label checkbox.

    Do this for each text field.

    Thank you!
    -Tracy

    Thread Starter deborav

    (@deborav)

    It really helped, I’m very thankful for your quick response.

    Thank you.

    Plugin Contributor Tracy Levesque

    (@liljimmi)

    🏳️‍🌈 YIKES, Inc. Co-Owner

    Excellent!

    Have a good day!
    -Tracy

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘Costumize CSS’ is closed to new replies.