add image to the background of the frontpage

Hello, please excuse my noobie question as am actually a beginner.

Is thier a way to add image to the background of the frontpage/subpages instead of it being white?



Thanks in advance.

Would You like to have one - same image on all pages?

Would You like to have one - same image on all pages?

Yes please and if am not asking for too much, the option for different image per page.

whatever advice you can offer will be appreciated.

Thanks In advance.

1. You would need to create suffixes for pages.
You can read about them here:
http://www.gavick.com/documentation/joo ... -features/
in "Template elements overrides" section (it works same in J2.x).
To get ID of a page - go to menu editor (mainmenu) - the ID's are in last column.
2. While suffixes are set, You can use override.css to add:

Code: Select all

body.SUFFIXNAME1 #gkPageContentWrap {background: #fff url(../img/backgroundimages/image1.jpg) 50% 0 no-repeat;
body.SUFFIXNAME2 #gkPageContentWrap {background: #fff url(../img/backgroundimages/image2.jpg) 50% 0 no-repeat;


SUFFIXNAME1 and SUFFIXNAME2 are the same as You added in step one. Code uses template folder (/templates/creativity/backgroundimages/) to store background images.

This is just a draft how it should be done. Also - backgroun will not work on homepage, as it uses its own styling and doesn't have one background on entire height.

Remember to enable "CSS override" in template settings - advanced section.

Hello Cyberek, thanks for your help and sorry for the late reply. I had to give it a go over a considerable amount of time before running back to you crying" it did not work".

Please find below all what I have done.

"1. You would need to create suffixes for pages."


"2. While suffixes are set, You can use override.css to add:"






Additional setting: CSS override enabled.


Please am I doing something wrong ?

Thanks in advance.

Now it would be the best, if You could PM me with link to your site and create admin (super-admin) user for me and PM that also - Ill check whats wrong then. Everything should work fine, it might be a typo now or something.

PMed. Thanks

Code: Select all

 body.WhatwedoBGimage1 #gkPageContentWrap {background: #fff url(../img/backgroundimages/image1.jpg) 50% 0 no-repeat;
    body.learnmoreBGimage1 #gkPageContentWrap {background: #fff url(../img/backgroundimages/image2.jpg) 50% 0 no-repeat;


this was just a sample
with one of the suffixes that are set code in override.css should look this way:

Code: Select all

body.onepage #gkPageContentWrap {background: #fff url(../img/backgroundimages/image1.jpg) 50% 0 no-repeat;


As You can see You create a line with body.SUFFIXNAMEFORTHATPAGE #gkPageContentWrap at the beginning (replace SUFFIXNAMEFORTHATPAGE with your suffix), and with url to image that is placed in template folder/backgroundimages/ with file name image1.jpg.

Hope this time itc more clear.

Code: Select all

 body.WhatwedoBGimage1 #gkPageContentWrap {background: #fff url(../img/backgroundimages/image1.jpg) 50% 0 no-repeat;
    body.learnmoreBGimage1 #gkPageContentWrap {background: #fff url(../img/backgroundimages/image2.jpg) 50% 0 no-repeat;


this was just a sample
with one of the suffixes that are set code in override.css should look this way:

Code: Select all

body.onepage #gkPageContentWrap {background: #fff url(../img/backgroundimages/image1.jpg) 50% 0 no-repeat;


As You can see You create a line with body.SUFFIXNAMEFORTHATPAGE #gkPageContentWrap at the beginning (replace SUFFIXNAMEFORTHATPAGE with your suffix), and with url to image that is placed in template folder/backgroundimages/ with file name image1.jpg.

Hope this time itc more clear.

Hello, the above is not clear and I still can't have it working.

Please could you spot my error and highlight it? I believe my mistake is visible to you but my novicity blinds my vision in detecting it.

Ok, lets start again, on which pages You would like to have this background? (name them according to menu names from link in PM You have sent to me).

Or perhaps You want to set background under modules on homepage?
You must be more clear about what You would like to do.

Ok, lets start again, on which pages You would like to have this background? (name them according to menu names from link in PM You have sent to me).

Sorry for being impatient. I was desperate.

will PM you.

Thanks in advance.

Ok, lets start again, on which pages You would like to have this background? (name them according to menu names from link in PM You have sent to me).

Sorry for being impatient. I was desperate.

will PM you.

Thanks in advance.

Through the gates

Schools

Are you listening.

Or perhaps You want to set background under modules on homepage?
You must be more clear about what You would like to do.

Actually both instances if possible.

Say I create a custom html module and position it top1. Would it be possible to set an image background stretching from left to right, top to bottom of the whole module position(top1) ?

Same applies to a K2 Item or article.

If it goes to modules on homepage, You can target them with use of (going from bottom, referring to items on Your site):

#gkBottom1-2 - contact form
#gkBottom1-1 - bolded text
#gkPageContent - page content (What we do and text under)
#gkHeader - text under intro and About Us section.

This is just a info. If You would like to set a background for each of those modules, please refer to my previous posts, or read a little bit about css, background images, selectors (ID's and classes), as without this knowledge You will not be able to go any further.

Also You might be interested in setting a module suffixes (each module can be assigned unique suffix so addressing it in css is available) - its a standard Joomla feature.

As it goes to things from PM - I'll write back in monday, as I cant seem to find out whats wrong on your site - page suffixes doesnt show correctly.