WordPress.org

Forums

Firebug shows URL instead of CSS (5 posts)

  1. s47a
    Member
    Posted 1 year ago #

    Using the CF7 plugin I have a sign-up form placed in a page and need to change the font color and size of the text. When I inspect w/ firebug it gives me the page URL for the CSS location.

    1. Page link here
    2. Firebug indicates that the elements are on line 241 of ...sign-up-page/#5
    3. There is no (known) location for this in my file structure.
    4. How do I get to this location to perform the edit?

    Thanks for your help!

    Also, I have found and read the following question but it doesn't appear to be resolved.
    http://wordpress.org/support/topic/firebug-gives-me-page-url-not-css-location

  2. bemdesign
    Member
    Posted 1 year ago #

    That is referring to the "URL" path of the actual contact form - it's on /sign-up-page and it's form #5. For how to actually style this, look at the actual rendered HTML code (view source). You'll notice that the Contact Form 7 elements all have class attributes that start with "wpcf7". In your theme's CSS stylesheet you can use these to style the form. For instance you could use:

    .wpcf7-form-control.wpcf7-textarea{
    /*your style here*/
    }

    to style the text box.

  3. s47a
    Member
    Posted 1 year ago #

    Thanks bemdesign,
    Should this line go somewhere specific? I placed it in my theme style sheet at the bottom. I for got to add that I am also using the Impact Template Builder plug-in for this page. So I also place the same line in default.css for the plug-in. Neither have made a difference.

    the following is the CSS code that I included in both

    .wpcf7-form-control.wpcf7-textarea{
    color: #000000;
    font-family: Arial,Tahoma,Verdana,sans-serif;
    font-size: 12px;
    line-height: 170%;
    }

  4. s47a
    Member
    Posted 1 year ago #

    Ok, found a work around.

    I installed jonradio Multiple Themes plug-in and started attaching themes until I got what I wanted.

    Prolly not the best approach but it worked for what I needed.

  5. Andrew
    Forum moderator
    Posted 1 year ago #

    4. How do I get to this location to perform the edit?

    Are you sure you should be doing that at all? Firebug is meant to expose the CSS applied to HTML elements. Once you know that CSS you should be overriding it rather than editing it.

    Do you have a Custom CSS plugin, or are you using a Child Theme?

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags