WordPress.org

Ready to get started?Download WordPress

Forums

Transparent Header Area in TwentyEleven Template (13 posts)

  1. jmbyrd1986
    Member
    Posted 1 year ago #

    Click here to view the image that will help answer this question.

    I am using the TwentyEleven template in its default, unmodified state. I am wondering how to make the section that is outlined in red in the image referenced above (basically, the header area) transparent.

    If possible, I would rather receive advice that would direct me to a background color area that I could modify, which is already located in the default code for the Twenty Eleven CSS code, rather than "slap" a piece of code addendum in this same CSS template.

    Referencing a code line number would also be extremely helpful.

    Thanks.

  2. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    You cannot modify the theme files without creating major problems for yourself. Start by creating a child theme or using a custom CSS plug-in.

    http://codex.wordpress.org/Child_Themes

  3. jmbyrd1986
    Member
    Posted 1 year ago #

    Ok, directory for child theme, along with child theme CSS file (including header and @import) have been created.

    What should I add in the style.css file for the child theme that would change the area outlined in red (as seen in the image link in my initial post) to transparent? Sorry, I'm not very savvy with CSS.

  4. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Can't answer without looking at your site -- can you post a link to it? Alternatively, try using Firebug to work with CSS -- it's really helpful in identifying elements to target and testing out CSS changes.

  5. jmbyrd1986
    Member
    Posted 1 year ago #

  6. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    That site does not have a child theme - perhaps you need to activate the child theme you created?

  7. jmbyrd1986
    Member
    Posted 1 year ago #

    The child theme's CSS file has been uploaded to a subdirectory of the parent theme and the necessary header and @import call are inside of the child theme's CSS file. However, it is not showing up for activation under Appearance > Themes.

    I'm a total newbie so I know I'm missing something.

    Does there need to be an actual CSS element defined in the child theme's file for it to show up for activation?

  8. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Child themes don't go inside the parent theme -- but on the same level as all other theme folders...seems illogical, I know :).

  9. jmbyrd1986
    Member
    Posted 1 year ago #

    Ok, now it is showing but it says that it's unreadable.

  10. jmbyrd1986
    Member
    Posted 1 year ago #

    Nevermind, it is fully displayed and has been activated.

  11. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    This line is wrong in your child theme style.css file:

    @import url("../wp-content/themes/twentyeleven/style.css");

    which is why none of the styles are showing up. It should be this:

    @import url("../twentyeleven/style.css");
  12. jmbyrd1986
    Member
    Posted 1 year ago #

    Ok, fixed.

  13. alchymyth
    Forum Moderator
    Posted 1 year ago #

Topic Closed

This topic has been closed to new replies.

About this Topic