We build. You grow.

Get best community software here

Start a social network, a fan-site, an education project with oxwall - free opensource community software

Setting a background image in the Simplicity sign in page | Forum

Topic location: Forum home » Development » Themes
Darryl B Leader
Darryl B Oct 14 '15
I initially posted how to do this through cpanel, but found that the problem was a couple of elements that covered the page was hiding my background image. I have another post below that tells everything I did in the custom css in the admin panel. The image in that css file is an image from a web address that I was just using to test, so it will show on you site just by copying and pasting the entire code in your custom css. You can play around with the colors. The rgba colors I used use regular rgb colors with an alpha channel at the end to add the opacity. The alpha channels are 0.1 - 1. You will see that at the end of the color.
The Forum post is edited by Darryl B Oct 20 '15
Attachments:
  simplicity background.jpg (106Kb)
Darryl B Leader
Darryl B Oct 14 '15
p.s. Don't forget to set dev mode to true, and refresh your page to see the changes.
Darryl B Leader
Darryl B Oct 19 '15
Found my problem. I can now do this through the admin panel custom css.
.ow.base_sign_in .ow_sign_in_con, and body.ow.base_sign_in both have to be set to transparent. I also got the scroll on the page to go away. The image I used for the background in the attached css file is a web image. I've also attached a screen shot of how this css looks. The problem with the initial post was that if the theme is updated, it would revert back to the original. Now it will hold the sign in page.
Attachments:
  test site sign in.jpg (159Kb)
  simplicity sign in page.txt (1Kb)
Jérémy
Jérémy Jun 11 '16


Hello,


I was trying to do as you explain it, but nothing to do ... I just want to put this image : http://www.thalass-sun-albi.com/style/bg.png


But I can not... How to do? Thank you


http://www.thalass-sun-albi.com/style/bg.png
Quote from Darryl B Found my problem. I can now do this through the admin panel custom css.
.ow.base_sign_in .ow_sign_in_con, and body.ow.base_sign_in both have to be set to transparent. I also got the scroll on the page to go away. The image I used for the background in the attached css file is a web image. I've also attached a screen shot of how this css looks. The problem with the initial post was that if the theme is updated, it would revert back to the original. Now it will hold the sign in page.

Darryl B Leader
Darryl B Jun 11 '16
This should work to add the background image only. I just tried it, and it works. You don't have to use the footer background color. I just use it to see the attribution better if the background clashes with the color of the attribution link. You can add this to the custom css in the admin panel.

.ow.base_sign_in .ow_sign_in_cont {
        background: transparent none repeat scroll 0% 0%;
}
body.ow.base_sign_in {
        background: transparent none repeat scroll 0% 0%;
}
body.base_sign_in > .ow_page_wrap {
        background-image: url("your image");
        background-size: 100% 100%;
        background-attachment:fixed;
}
body.base_sign_in .ow_footer {
        background-color: rgba(0, 0, 0, 0.8);
       
}
The Forum post is edited by Darryl B Jun 11 '16