Home  Elements Background Transparency

Body Background With Transparency

To force a background image to display with transparency without impacting the opacity of other text, you can apply the pseudo element ::before to the container (html or body) using CSS

The CSS

html::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 100%; background-image: url("/images/background.jpg"); background-attachment: fixed; background-position: bottom; opacity: .5; z-index: -1; }

Sticky Side Column

If you're using our PHP Website Template, this is the optional side bar column you can add to some or all of your pages. It can be useful for adding advertisements such as Adsense ads to be displayed on multiple pages.
When you include the side column, your main content will automatically adjust its width to accommodate it.
The side bar is 'sticky'; it will scroll down and remain in view.
You can turn on/off the side bar column per page by defining the $showSide option located at the top of each file.