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

please any video tutorial on how to customize landing page(login page) | Forum

Topic location: Forum home » Development » Themes
Ola
Ola Aug 1 '16
please any video tutorial on how to customize landing page(login page)
dave Leader
dave Aug 1 '16
Hi, 


no videos on the forum that i know of but if you do a google search for this i found some oxwall posts and maybe a video.. 


search google for  oxwall edit login page   and you will see :)

Ola
Ola Aug 1 '16
Thanks Dave I really appreciate


Ola
Ola Aug 1 '16
@ Dave i dont want to mess up with this i got this from google


https://developers.oxwall.com/forum/topic/9053


and so many option can u help me please?

dave Leader
dave Aug 1 '16
What would you like to do, i can try 
Oxwall Tips
Oxwall Tips Aug 2 '16
Ola, please contact me if you are interested in getting assistance with log in page customization. oxskatips@gmail.com

Wrote this post a while ago: https://skatips.wordpress.com/...efault-sign-in-page/ .

Logic is still the same, though class names might be different.
Ola
Ola Aug 2 '16
@DAVE I JUST WANT TO CUSTOMIZE MY FRONT PAGE TO LOOK LIKE QUORA.COM
Ola
Ola Aug 2 '16
@ OXWALL TIPS I SENT U MAIL
christine
christine Aug 3 '16

Quote from Oxwall Tips Ola, please contact me if you are interested in getting assistance with log in page customization. oxskatips@gmail.com

Wrote this post a while ago: https://skatips.wordpress.com/...efault-sign-in-page/ .

Logic is still the same, though class names might be different.

Thank you for the link!!! I have been wondering too. I learn as I go and really need these explanations that double confirm every step (just like a child) :-)
Thank you
dave Leader
dave Aug 3 '16
Thanks OT for helping...  Ola did you get what you needed ?
christine
christine Aug 3 '16
Okay... it didnt work?

I customied a picture 2500x1556

I opened two admin pages;
-One (the CSS Box) where I copy and paste the code on, from the link provided above.
-The other one where I copy the picture URL in graphics to paste in the now ready CSS box.

So I did this and nothing happened? What did I do wrong?
Ola
Ola Aug 3 '16
@ dave not yet
dave Leader
dave Aug 3 '16
Im not good at the users side but looks like the first thing you need is the FB connect plugin do you have that ?
Darryl B Leader
Darryl B Aug 3 '16
Each theme can vary slightly when adding background images to the sign in page. A site url would be helpful in being able to provide better, and more accurate assistance.
Ola
Ola Aug 4 '16
@ darry B. lukola.com

Darryl B Leader
Darryl B Aug 4 '16
I see you are using the Ethos theme. I've got this part so you can add a background image to the sign in page. You can add this to your custom css for the theme in the admin panel. Not sure why they have the elements off center in the sign in form unless they are making room for the connect buttons to the right.

/*add a background image*/
body.base_sign_in > .ow_page_wrap {
    background-image: url("paste your image url here. leave the quotation marks");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: fixed;
}
The Forum post is edited by Darryl B Aug 4 '16
Ola
Ola Aug 5 '16
@ DERRY B THANKS A LOT I WILL DO THAT ON MY LOCAL SERVER BEFORE I TRY IT ON LUKOLA.COM AM GREATFULL
Darryl B Leader
Darryl B Aug 5 '16
You're welcome.  We can start with that and go from there. 
Ola
Ola Aug 7 '16
@ darryl B pls check my site lukola.com the heading (welcome to lukola) did not align to centre) 

 and is it possible for me to move the login widget to  right hand side and the css code you gave me is not working for simplicity i guess is the best theme. thanks ur a leader

Darryl B Leader
Darryl B Aug 7 '16
Looks like the background image css is working on your Ethos theme. Try the css below to move things around. The Dev, or someone has some custom css in place, so I had to work with that.

.base_sign_in .ow_sign_up {
    display: initial !important;
}
.base_sign_in .ow_sign_in_wrap .clearfix {
    display: initial !important;
}
.ow_sign_in_wrap form {
    padding-left: 100px;
    padding-right: 100px;
}
.ow_sign_in_wrap {
    margin-left: -40px;
}
.base_sign_in .ow_sign_in_wrap {
    top: 20px !important;
}
Pages: 1 2 »