How do I make page content transparent?

  • I am using the Poet Pro Theme, it is the child theme for Author. I want my static page to have transparent content, but I cannot for the life of me figure out how to do it! My site is kieraford.com.

    If that is not possible, I’d like to change the background of the content. Meaning I don’t want the text to be in the white box.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Bill

    (@chubbycrow)

    You’ll probably want something like this in your custom styles:

    .page .entry article {
    background: rgba(255, 255, 255, 0.7) none repeat scroll 0 0;
}

    Change the 0.7 to the level of transparency you want (from 0 to 1). Or even tweak the rgb color values along with it.

    You need to test this to see if the pages affected are the ones you want to be affected, and adjust the classes accordingly.

    Thread Starter fordkj

    (@fordkj)

    It works! Thank you….one more question: Is there a code to make this work for specific pages? When I put in the code, it changed the setting for other pages as well.

    Bill

    (@chubbycrow)

    Sure. The first class above (.page) is pretty generic. You need to decide which pages you want to have this apply to, and then find and use their unique classes.

    For example, your home page <body> element has a unique class of .page-id-108. So let’s say you have two particular pages you want to apply this style to. You could add: (careful, this made-up example is just to illustrate)

    .page-id-108 .entry article,
.page-id-123 .entry article {
    background: rgba(255, 255, 255, 0.7) none repeat scroll 0 0;
}

    You can use the developer tools for the browser you’re using to find these classes, or use the View Source menu item in the same way. Open the page you want to affect, view source, find the <body> tag and look at the element’s classes. A class like the above that has an ID number is ideal. I hope that helps, but let me know if you need more.

    Thread Starter fordkj

    (@fordkj)

    It worked perfectly! Thank you so much, Bill!

    Bill

    (@chubbycrow)

    You’re quite welcome!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘How do I make page content transparent?’ is closed to new replies.