• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Customizer – Additional CSS

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › Design Tips and Tricks › Customizer – Additional CSS

This topic is: not resolved

Tagged: css, customizer, ninja forms

  • This topic has 3 replies, 3 voices, and was last updated 2 years, 7 months ago by Brad Dalton.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • January 11, 2020 at 1:28 pm #495892
    danielleB
    Participant

    I want to do a simple color edit in the Ninja form plugin CSS. What is the best way to do it without modifying the plugin files? Can it be done in the customizer's additional CSS? And if so, how do I point to the right CSS file? I tried it by simply copy/pasting the line of code in the plugin CSS file, but it didn't work.

    This is the path to the NINJA FORM PLUGIN CSS: ASSETS/CSS/DISPLAY-OPINIONS-LIGHT.CSS

    This is the code I added to the customizer:

    /*NINJA FORM SUBMIT BUTTON COLOR MODIFICATION*/
    .nf-form-content button, .nf-form-content input[type=button], .nf-form-content input[type=submit]{
    background: #3c2411;
    border: 0;
    color: #f7f7f7;
    transition: all .5s;
    }

    Many thanks,


    Danielle

    http://developing locally
    January 11, 2020 at 3:24 pm #495893
    Anita
    Keymaster

    Ninja Forms has instructions on this - https://ninjaforms.com/blog/add-custom-css-to-wordpress-forms/. The easy way is the Customizer.


    Love coffee, chocolate and my Bella!

    January 11, 2020 at 4:21 pm #495895
    danielleB
    Participant
    This reply has been marked as private.
    January 11, 2020 at 10:04 pm #495900
    Brad Dalton
    Participant

    You can also add the CSS at the end of your child themes style sheet like this.

    #nf-field-298 {
      height: 100px !important;
    }
    

    That should override the CSS loaded by the plugin.


    Recent Client work

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘Design Tips and Tricks’ is closed to new topics and replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2022 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble