-> Go to Admin Panel and open setting-english language (default).
-> Search the string of BASE{text key='base+join_promo'}
-> Insert the html image code something like the following example: <img src="http: // your-image-address "> into the box translation. (You can also inserttexts or certain sentences as you want)
-> Click Save
->See your join page to ensure a successful result
See Live Sample: Join Page
contact me if you have a problem. I am ready to help you for free
We build. You grow.
Get best community software hereStart a social network, a fan-site, an education project with oxwall - free opensource community software
How to add image on the join page (Read this tricks) | Forum
JB TECH
Oct 9 '12
You can actually add videos, photos, colored text, etc to this. Into any key value too, but yes, if you want to fancy up your join form, use this :)
Nirmalya Ghosh
Oct 15 '12
i want to try this stuff too but when i did this, there appeared the image below the "Join our community" dialogue. But i couldn't align the image to the left and the sign up form on the right. Can you please give the full instructions how to do this step by step.
cit27
Oct 26 '12
Add this before image code:
☛ <div style="text-align:center;"> center position
☛ <div style="text-align:left;"> left position
☛ <div style="text-align:center;"> center position
☛ <div style="text-align:left;"> left position
Michael I.
Oct 30 '12
You want me to add this where?
This forum implies you have programming skills. So, image code is something that looks like:
<img src="image source" />
Umair
Feb 21 '15
-> Go to Admin Panel and open setting-english language (default).It only adds image to one side of the join page. How to add a full width image in the background?
-> Search the string of BASE{text key='base+join_promo'}
-> Insert the html image code something like the following example: <img src="http: // your-image-address "> into the box translation. (You can also inserttexts or certain sentences as you want)
-> Click Save
->See your join page to ensure a successful result
See Live Sample: Join Page
contact me if you have a problem. I am ready to help you for free
Wilson
Feb 21 '15
hey Umair,
If you would like to know how css works and find what your looking for go to this web site, its great on teaching you how things work. http://www.w3schools.com/
You can edit the page it self as this is what I did to a few pages like forgot password, join page, login page and so on. Go to ow_system_plugins/base/views/controllers and find join_index.html
I used this css coding from w3school to make my back ground images...but remember when you mod a page, it will be lost when you update the core...so make note of what your doing so you can repeat it again on updating the core.
<style>body { background-image: url('http://mydomain.com/images/back.jpg');
background-attachment: scroll;
background-repeat: no-repeat;
background-size: 100%;
height: 100%;
width: 100%;
background-position: center top }
</style>
Also you can try adding your css code in the admin/theme/css/EDIT CSS section, this will have no effect when you update the core, you changes there will stay.
hope this help,
Wilson
If you would like to know how css works and find what your looking for go to this web site, its great on teaching you how things work. http://www.w3schools.com/
You can edit the page it self as this is what I did to a few pages like forgot password, join page, login page and so on. Go to ow_system_plugins/base/views/controllers and find join_index.html
I used this css coding from w3school to make my back ground images...but remember when you mod a page, it will be lost when you update the core...so make note of what your doing so you can repeat it again on updating the core.
<style>body { background-image: url('http://mydomain.com/images/back.jpg');
background-attachment: scroll;
background-repeat: no-repeat;
background-size: 100%;
height: 100%;
width: 100%;
background-position: center top }
</style>
Also you can try adding your css code in the admin/theme/css/EDIT CSS section, this will have no effect when you update the core, you changes there will stay.
hope this help,
Wilson
The Forum post is edited by Wilson Mar 1 '15
Umair
Feb 21 '15
Thank u for ur reply Wilson. Remeber I want to change bg of join page
How should I put it in admin/theme/css/EDIT CSS section? I mean format like .ow_body or something. Secondly, how to take out signup tab from join page?
FYI, I have tried to change bg image before by reading this http://www.ewtnet.com/2013/04/how-to-add-fixed-background-image-to_5.html but did not cover the whole page.
How should I put it in admin/theme/css/EDIT CSS section? I mean format like .ow_body or something. Secondly, how to take out signup tab from join page?
FYI, I have tried to change bg image before by reading this http://www.ewtnet.com/2013/04/how-to-add-fixed-background-image-to_5.html but did not cover the whole page.
The Forum post is edited by Umair Feb 21 '15
Wilson
Feb 23 '15
hey Umair,
1st ?
To change how things look including the back ground on the "Join" page, go to ow_system_plugins/base/views/controllers and find "join_index.html"
add this css code to the top :>>> back up that file before you change it!
<style>body {background-image: url('http://www.oxwall.org/ow_themes/origin/images/header.jpg');
background-attachment: scroll;
background-repeat: no-repeat;
background-size: 100%;
height: 100%;
width: 100%;
background-position: center top }
</style>
Note: change the url link information (http://www.oxwall.org/ow_themes/origin/images/header.jpg') to your folder where your image is on your server!
If you put that css code in ADMIN/ Settings/Main Setting/Page Settings/
"Custom head code" area and save it. Your image will be in all the pages as your background.
2nd ?
The person that helped me out on that issue has deleted there profile so there information is gone, I look at the code to see what to take out and get back with you on that.
Wilson
1st ?
To change how things look including the back ground on the "Join" page, go to ow_system_plugins/base/views/controllers and find "join_index.html"
add this css code to the top :>>> back up that file before you change it!
<style>body {background-image: url('http://www.oxwall.org/ow_themes/origin/images/header.jpg');
background-attachment: scroll;
background-repeat: no-repeat;
background-size: 100%;
height: 100%;
width: 100%;
background-position: center top }
</style>
Note: change the url link information (http://www.oxwall.org/ow_themes/origin/images/header.jpg') to your folder where your image is on your server!
If you put that css code in ADMIN/ Settings/Main Setting/Page Settings/
"Custom head code" area and save it. Your image will be in all the pages as your background.
2nd ?
The person that helped me out on that issue has deleted there profile so there information is gone, I look at the code to see what to take out and get back with you on that.
Wilson
The Forum post is edited by Wilson Feb 23 '15
Wilson
Feb 24 '15
Got that for you Umair...go here >> http://www.oxwall.org/forum/topic/31869?page=1#post-136966
Wilson
Wilson
Umair
Feb 26 '15
Wilson,
Any idea how can I allow my users to add a cover image like in fb and twitter?
Does hashtags work on oxwall?
Currently my website is on a free hosting with sub-domain and is in a testing stage. So I am trying different things and when it is complete, I will shift it to a paid hosting and make it live.
Any idea how can I allow my users to add a cover image like in fb and twitter?
Does hashtags work on oxwall?
Currently my website is on a free hosting with sub-domain and is in a testing stage. So I am trying different things and when it is complete, I will shift it to a paid hosting and make it live.
Wilson
Feb 26 '15
hey Umar,
Sounds like a good plan...I moved to arvixe about three years ago and have had really no issues. And there support team is rock solid...you need unlimited database connections...that's one reason why I moved to arvixe...free hosting don't give you that option. Maybe 10 users at the most, if you get really busy with your site...you'll have to move to a VPS or Dedicated server, arvixe has them too. But for now I think you should be ok with a shared server. When you get ready to make that move if you could use my link to open an account that would be great...and yes I do get an affiliate referral if you use my link.
http://www.arvixe.com/1387-60-1-63.html
As to your ? about "cover image"....Yes that is possible but that trick is going to cost you! Its a plugin that's in the oxwall store...http://www.oxwall.org/store/item/483 >>>take a look around there, you will find some kool FREE plugins/themes and paid ones too.
glad I could help others here...that's what its all about!
Wilson
p.s. Yes hashtags work on oxwall!
Sounds like a good plan...I moved to arvixe about three years ago and have had really no issues. And there support team is rock solid...you need unlimited database connections...that's one reason why I moved to arvixe...free hosting don't give you that option. Maybe 10 users at the most, if you get really busy with your site...you'll have to move to a VPS or Dedicated server, arvixe has them too. But for now I think you should be ok with a shared server. When you get ready to make that move if you could use my link to open an account that would be great...and yes I do get an affiliate referral if you use my link.
http://www.arvixe.com/1387-60-1-63.html
As to your ? about "cover image"....Yes that is possible but that trick is going to cost you! Its a plugin that's in the oxwall store...http://www.oxwall.org/store/item/483 >>>take a look around there, you will find some kool FREE plugins/themes and paid ones too.
glad I could help others here...that's what its all about!
Wilson
p.s. Yes hashtags work on oxwall!
The Forum post is edited by Wilson Feb 26 '15
Umair
Feb 28 '15
Wilson
This is what I got after adding image to join page. See pic. See below code I am using top of the join page. The bold part is to hide menu
{style}
{literal}
.ow_menu_wrap, .ow_main_menu {
display:none !important;
}
body {background-image: url('http://www.mywebsite.com/...es/theme_image_3.jpg');
background-attachment: scroll;
background-repeat: no-repeat;
background-size: 100%;
height: 100%;
width: 100%;
background-position: center top;
}
{/literal}
{/style}
This is what I got after adding image to join page. See pic. See below code I am using top of the join page. The bold part is to hide menu
{style}
{literal}
.ow_menu_wrap, .ow_main_menu {
display:none !important;
}
body {background-image: url('http://www.mywebsite.com/...es/theme_image_3.jpg');
background-attachment: scroll;
background-repeat: no-repeat;
background-size: 100%;
height: 100%;
width: 100%;
background-position: center top;
}
{/literal}
{/style}
Wilson
Feb 28 '15
Hey Umair,
That looks right, good job!
Here's a good tool to use to inspect each element that you want to delete. Press F12 on your keyboard...see that...that's how you inspect a web site. It's what I just used to find the CSS code that's showing what you want to take out.
.ow_tr_first th >>> SEE MY PICS on how to inspect the page.
Now .ow_tr_first th shows that area you want to take out...so when you want to commit something out using CSS you can by putting this bit of code {display: none} as you did above after the element code..like so:
.ow_tr_first th {display: none} /*takes out BASIC tab area on sign-up page*/
its a good ideal to put a note after your code so you know what its doing...like so
/*takes out BASIC tap area on sign-up page*/
This is how you can take out many thing using this trick. But be carful because something's takes out more then what you want sometimes. A good ideal is to back up your database once your done editing your css stuff. This way when you start to edit it again and LOCK your self out from your site like I did...you can just re-install your backup and get back in...lol
How to apply it!
Go to ADMIN/THEME/CSS and in the "EDIT" area put that code in there and press save. You will have to change your config file from:
define('OW_DEV_MODE', false); to define('OW_DEV_MODE', true); to see the changes.
Once done with all your changes then put define('OW_DEV_MODE', true); back to
define('OW_DEV_MODE', false);
As for the white page covering your background...this is how it works. You have your background right...then you have a table over your background that's white with all your content on it...this how it works. Now if you don't want that table to have color then you have to play with the "base" css page it self and change a few things in that area.
Wilson
The Forum post is edited by Wilson Feb 28 '15
