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

Sign In Screen edit | Forum

Thomas Crown
Thomas Crown Nov 7 '15
Does anyone know how or were to edit the welcome/sign in screen? See attached file. The theme was not programmed to add a logo to the login screen and now I need to know how to add one. OWVisuals is trying to extort me for more money because I voiced my concern on the matter.
Attachments:
  signinlogo.png (500Kb)
Darryl B Leader
Darryl B Nov 7 '15
Have you tried using Inspect Element? Looks like you could use it to find the css for the "Site Name", and replace that with an image.
Thomas Crown
Thomas Crown Nov 7 '15
I did, and I know where in the base.css file to edit the color and size. So I tried to insert and image url there, hoping it would overwrite it in it's place and that didn't work.
Darryl B Leader
Darryl B Nov 7 '15
You shouldn't have to do it in the base.css. You should be able to just add it to your custom css in the admin panel. Without seeing it myself, it should be something like
.ow_sign_in_logo_wrap, and maybe an .ow_sign_in_logo_wrap a. Do you have a url?
Darryl B Leader
Darryl B Nov 7 '15
Origin has something similar to you screenshot. There was no logo wrap. Just the site name above the login box.
I was able to change the site name to a logo image with a little trickery. This is the element I used. I added a background-image, and set the font size to 0px to hide the text. I changed other settings to be able to move things around, Mostly in the element below.

ow_sign_in_wrap h2
Darryl B Leader
Darryl B Nov 7 '15
Here's a screen shot to show where I changed the "Site Name" h2 tag above the login box to an image. I set position:relative on both the h2 tag, and the sign in wrap to be able to move them around because the image pushed the sign in box down when I sized it.
Attachments:
  h2 to image.jpg (68Kb)
Thomas Crown
Thomas Crown Nov 7 '15
And if you wouldn't object to phone support, I would happily give you my number.
Thomas Crown
Thomas Crown Nov 7 '15
Any coding to me has always been through hard files. So using a wizard through an admin panel is although the same in nature, different for me. Can you write out the code as you would put it in, so that I don't screw anything up.
Darryl B Leader
Darryl B Nov 7 '15

This should get you. I used an image from the web that was the same size as the one you have. Go to the admin panel/appearance/customize. Upload your image in the "Graphics" section, and copy the url that it is assigned. Open the css tab, and scroll down below the base css to the edit css box. Copy the code below, and paste it there.Paste your image url into the background-image tag. Click on Save and your done.

.ow_sign_in_wrap form
{
    position: relative;  

    top: -126px;

}
.ow_sign_in_wrap h2 {  

    background-image: url("Put the url to your image here");  

    background-size: contain;

    background-repeat:no-repeat;

    position: relative; 

    top: -126px;
    font-size:0px;

    height: 146px;

}

The Forum post is edited by Darryl B Nov 8 '15
Attachments:
  Brai.jpg (183Kb)