WordPress.org

Ready to get started?Download WordPress

Forums

Fast Secure Contact Form
:hover and :focus states? (8 posts)

  1. Merlin Mason
    Member
    Posted 3 years ago #

    Thanks for the plug-in, it's functioning great!

    Don't suppose there's any way to create :hover and :active states for the fields?
    I'm trying to get the whole things quite slick and interactive :)

    Thanks for your time, all the best, Merlin

    http://wordpress.org/extend/plugins/si-contact-form/

  2. Mike Challis
    Member
    Plugin Author

    Posted 3 years ago #

    This is not an included feature. Please describe more specifically what this feature would do?

  3. Merlin Mason
    Member
    Posted 3 years ago #

    In my case I'd like to change the background color, something like...

    input {background:#777;}
    input:hover {background:#555;}
    input:focus {background:#333;}

    So it's grey, and darkens as you hover and darker again when you click in.

    Problem is the plugin writes all the css inline which doesn't support :hover or :focus states and also takes priority from anything in an external css file.

    I guess an easy solution could be an option not to use any of the plugins css?

  4. Mike Challis
    Member
    Plugin Author

    Posted 3 years ago #

    Can I use an external style sheet instead of the inline css in advanced
    options?

    External vs. internal it has pros and cons.
    I made it inline because the settings survive plugin upgrades and can be easily tweaked.

    You can bypass the inline style and make your own stylesheet,
    here is how:
    Look in the advanced options where you have the Inline CSS settings.
    Each setting can be changed to a class property if you prefer.
    For example:
    The setting "CSS style for form input fields DIV on the contact form:"
    can be changed from:
    text-align:left;
    to:
    class="input"

    Now you can use the input class of an external stylesheet.

    You can repeat this for each CSS setting if you want.

    Mike

  5. Merlin Mason
    Member
    Posted 3 years ago #

    Ahh brilliant, sorry, completely missed that!

    Clever way of doing it.

    Thanks, got it all working how I wanted now :)

  6. worthdesigning
    Member
    Posted 2 years ago #

    I did this and it still won't behave for me.
    url - http://www.worthdesigning.com.au/pinkcaddy/

    The form in the right navigation.

    Not going to give up!

  7. jimmypader
    Member
    Posted 2 years ago #

    I've almost got this.
    when I change the plugin setting to: class="input"
    where do I store the external css.

    ""Now you can use the input class of an external stylesheet.""
    How?

    Thanks

  8. Merlin Mason
    Member
    Posted 2 years ago #

    Every theme has it's own style.css file so you can add it to there. You should be able to find it on your server at wp-content/themes/THE THEME YOUR USING/style.css

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic