Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • November 17, 2016 at 12:06 am #713291
    mleonhard

    Hi
    I have created a little contact form in the footer of my site https://hi-flyfoto.de
    using shortcode. How can I format background clour, padding etc of the form? I tried the CSS of my main contact form,
    just with #footer, like this

    #footer .main_color input[type=”text”],#footer .main_color input[type=”password”],#footer .main_color textarea {
    padding:5px;
    background-color:#F1F1F1;
    color:#000
    }
    #footer .main_color input[type=”submit”] {
    padding:10px;
    margin-top: 5px;
    background-color:#c00000;
    color:#fff;
    font-weight: bold;
    border-radius: 0;
    border-bottom-width: 0;
    min-width: 100px;
    }

    It does not work.
    Would be grateful for some help
    Michael

    November 17, 2016 at 12:07 am #713292
    mleonhard

    PS is it possible not to show the contact form in the footer on the contact page with the main contact form?
    that would be a bonus.

    November 17, 2016 at 12:55 am #713303
    mleonhard

    Ok, I have found it. this works:

    #top .footer_color .input-text, #top .footer_color input[type=”text”], #top .footer_color input[type=”input”], #top .footer_color input[type=”password”], #top .footer_color input[type=”email”], #top .footer_color input[type=”number”], #top .footer_color input[type=”url”], #top .footer_color input[type=”tel”], #top .footer_color input[type=”search”], #top .footer_color textarea, #top .footer_color select {
    border-color: #dedede;
    padding: 5px;
    margin-top: -10px;}

    .avia_ajax_form .button {
    margin: 0;
    padding: 5px;
    margin-top: 5px;
    border-radius: 0px;
    border-bottom-width: 0px;
    border-bottom-style: solid;
    font-weight: normal;
    font-size: 0.92em;
    min-width: 60px;
    outline: none;
    }

    Just the little question of not showing the form on one particular page, any ideas?

    November 17, 2016 at 8:06 am #713424
    Rikard

    Hi,

    Thanks for sharing your solution, much appreciated :-)

    Please try the following CSS to hide the form from your contact page:

    .page-id-261 .avia_ajax_form {
  display:none !important;
}

    Best regards,
    Rikard

    November 17, 2016 at 10:19 am #713475
    mleonhard

    Hi Rikard,
    Thanks, that works. However all too well, because the main contact form on that page is also invisible

    November 17, 2016 at 2:40 pm #713580
    Rikard

    Hi,

    Oh, sorry. You want to hide the contact form in the footer widget, correct? If so please the following CSS:

    .page-id-261 #text-11 {
  display:none !important;
}

    Best regards,
    Rikard

    November 17, 2016 at 4:47 pm #713639
    mleonhard

    Great, thank you that’s it Rikard

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘Formatting Contact Form in Footer’ is closed to new replies.