Archived

This topic is now archived and is closed to further replies.

  • 0

Translucent body background

Question

Posted · Report post

I'm using the Simplicate theme, and I'd like to adjust the opacity of the body background of my page. -- montanaretirementspecialists.com

 

Tips and suggestions?

Share this post


Link to post
Share on other sites

3 answers to this question

Posted · Report post

Hi there, you'll need to do this using some custom css. Affecting the color applied to the .page-canvas selector so it has transparency on the page and saving the new code into the custom code area in Pagelines>site options>custom code. If you're using firebug you'll see when you get the color picker appear there's a slider at the bottom where you can adjust the transparency for the color you select. That code will then be adjusted into the code that you can copy/paste direct into pagelines.

 

If you've not dealt with making amendments using css before please checkout this overview and guide which advises on the tools we suggest you use to find and edit the various elements on the page to make the required changes to the css - http://support.pagelines.me/docs/customization/custom-css/

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks James.

 

Is there a selector other than .page-canvas that can adjust JUST the body background.

Using the .page-canvas selector changes the opacity of all the objects placed on the page-canvas (such as photos and logos).

 

I have experimented with several, but have been unable to find the one that only adjusts the opacity on the background without effecting objects.

Share this post


Link to post
Share on other sites

Posted · Report post

Hi there,

 

Make sure you're just using the .page-canvas selector and no other code. That shouldn't change any other elements on your site, unless there's some other code or prefix in there. It should give the following affect - http://screencast.com/t/vV4LEXKLTx

 

Example code:

.page-canvas {
    background: none repeat scroll 0 0 rgba(255, 255, 255, 0.29);
}

Share this post


Link to post
Share on other sites