WordPress.org

Forums

Optin Forms
[resolved] Change text color of label 'Enter your email here' (19 posts)

  1. myideasagain
    Member
    Posted 1 year ago #

    Thank you for developing a terrific plugin. I am able to customize the CSS, but do not see how to change the text color of the label 'Enter your email here' from grey to something else, such as white. Please assist.

    https://wordpress.org/plugins/optin-forms/

  2. Boris Beo
    Member
    Plugin Author

    Posted 1 year ago #

    Hi myideasagain,

    you can do so by picking a color. Look for "Input fields color" under the "Style your form" section.

    Let me know if you're able to get it working.

  3. myideasagain
    Member
    Posted 1 year ago #

    Thank you. I tried that, and it indeed effects the color of the text that appears once the user starts typing within the field.

    However, it does not seem to change the color of the label text itself, before the user starts typing.

  4. Boris Beo
    Member
    Plugin Author

    Posted 1 year ago #

    What browser are you using, so I can check?

  5. myideasagain
    Member
    Posted 1 year ago #

    Google Chrome Version 35.0.1916.153 m

  6. Boris Beo
    Member
    Plugin Author

    Posted 1 year ago #

    I see what you mean. The color is visible only once a visitor types something into the input field.

    Unfortunately, the JavaScript used for the labels is acting this way in Chrome (ignoring the CSS value).

    The only way to change that, is to edit the .js file itself.

    The file is /wp-content/plugins/optin-forms/includes/placeholder.js

    Find this line of code:
    placeholderColor: '#000',

    Change the HEX value to whatever you like.

    Save file and upload.

    The problem is that you will need to repeat this step each and every time you update the plugin.

  7. myideasagain
    Member
    Posted 1 year ago #

    Thank you, I do not see the file 'placeholder.js' listed there.

  8. Boris Beo
    Member
    Plugin Author

    Posted 1 year ago #

    My bad, the correct directory is
    /wp-content/plugins/optin-forms/js/placeholder.js ;)

  9. myideasagain
    Member
    Posted 1 year ago #

    I made the change but see no effect on the issue.

  10. Boris Beo
    Member
    Plugin Author

    Posted 1 year ago #

    Did you empty your browser cache?

  11. myideasagain
    Member
    Posted 1 year ago #

    Yes. The problem persists.

  12. myideasagain
    Member
    Posted 1 year ago #

    Please assist, Boris. The problem occurs on Firefox too.

  13. Boris Beo
    Member
    Plugin Author

    Posted 1 year ago #

    Hi myideasagain,

    it sounds like your theme's CSS is overriding the values set it in plugin's CSS and JS file. Can you share the URL where your form is included so I can take a look?

  14. myideasagain
    Member
    Posted 1 year ago #

    It's a PW-protected Dev site. How can I PM you access credentials?

  15. Boris Beo
    Member
    Plugin Author

    Posted 1 year ago #

    Send me an email through this link: http://www.codeleon.com/contact/

  16. myideasagain
    Member
    Posted 1 year ago #

    Sent. Any assistance, Boris?

  17. Boris Beo
    Member
    Plugin Author

    Posted 12 months ago #

    You can add the following code to your Custom CSS field, under Form Options in Optin Forms:

    ::-webkit-input-placeholder { /* WebKit browsers */
        color:    #dd3333;
    }
    :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
        color:    #dd3333;
    }
    ::-moz-placeholder { /* Mozilla Firefox 19+ */
        color:    #dd3333;
    }
    :-ms-input-placeholder { /* Internet Explorer 10+ */
        color:    #dd3333;
    }

    Make sure you change the HEX values.

    I've tested it and it works ;)

  18. myideasagain
    Member
    Posted 12 months ago #

    Terrific! Works. Thank you, Boris!

  19. Boris Beo
    Member
    Plugin Author

    Posted 12 months ago #

    You're welcome ;)

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • Optin Forms
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic

Tags

No tags yet.