Hi All,
could you help me with little thing,
I would like to add a background image on my totara site, please could you tell me how can I do that , I am doing this Site Admin > Appearance > Theme > Basis > adding in custom css
#page-content {background: url(http://C:/Apache24/totara/theme/basis/pix/doctor.jpg) repeat;}
I am using totara version 11.2 and basis theme.
I am looking forward to hearing from you.
Regards
Rahul
Hi Marek,
Thank you so much for your reply.
I am doing the same as you have mention but on my local server its not showing any image on background and just display the heading on page and If I click on any on the heading it shows "coding erroe detected"
#page-content {background: transparent url('http://localhost/index.php?redirect=0/theme/basis/pix/med.jpg')repeat center center scroll ;}
I am attaching the snap shot my error , please tell me where I am doing wrong.
I am looking forward to hearing from you.
Please find the attachment
Hi Marek
In custom css block in SA>Appearance>Theme>basis>custom css
#page-content {background:transparent url('http://index.php?redirect=0/theme/basis/pix/med.jpg')repeat center center scroll ;}
In config file totara/config.php
$CFG->wwwroot = 'http://index.php?redirect=0';
Thanking you
Regards
Rahul
Hi Marek,
Thank you so much for your reply and help :)
I have manage to set it up background image on home page and log in page on totara site but if I am trying to add a image on different page on my site its not working
body{background-image: url(http://localhost/theme/basis/pix/med.jpg);no-repeat center center fixed;-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;}- this image is showing on every page
#page-login-index { background-image: url(http://localhost/theme/basis/pix/doctor.jpg);
no-repeat center center fixed;-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;}
but to set the the image on danshboard page its not working
/*#page-content{background:transparent url(http://localhost/totara/dashboard/index.php/theme/basis/pix/health.jpg);repeat center center scroll ;}*/
/*#page-content{background-image url(http://localhost/totara/dashboard/index.php/theme/basis/pix/health.jpg) ;}*/
/*#page-content{background-image url(http://totara/dashboard/index.php/theme/basis/pix/health.jpg);repeat center center scroll ;}*/
and my config php file is the same
$CFG->wwwroot = 'http://localhost';
$CFG->wwwroot = 'http://localhost/totara';---> this is not working in config.php file
Please find the attachment
once again thank you so much for your help.
I am looking forward to hearing from you.
Regards
Rahul
Just use only:
body {
background:transparent url('http://localhost/theme/basis/pix/med.jpg') no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
I will kindly advice you to educate more about html+css syntax&value declaration and then try some stuff over Totara :)
Or hire (SOW) somebody/partner when you need specific theme etc
Thanks for your reply.
I guess you have miss understood my question. I am able to set it up image background image, what I was asking how to set up different image on different back ground.
Regards
Rahul
ok, than you have to focus on <body> classes and ID
You can have like default image across all totara :
body { background: ... default.jpg .... }
and add this lines to spefigy image just for dashboard pages
body.pagelayout-dashboard { background: ... dashboard.jpg .... }
or for frontapage/homepage special image add
body.pagelayout-frontpage { background: ... frontpage.jpg .... }
for login page
body.pagelayout-login{ background: ... login.jpg .... }
Is it clear now?
Hi Marek,
Billions thanks to you mate.
now I can set different image on each page.
I was looking for this from a long time and you have help me out a lot.
Still figuring out how to set background on on record of learning in the menu bar page.
Thank you so much :)
Regards
Rahul
If I understand correctly, you want to have different background on record of learning page? Like you have another bg for login / homepage / dashboard page?
Than just try to use:
body.pagelayout-report { background: ... report.jpg .... }
Hi Marek,
That's great mate.
I would like to know to that do you provide personal learning on theme creation and theme customization for totara and how to identify name of the page to set background (body.pagelayout-report { background: ... report.jpg .... })
report - how to find what is the name of the page.
Regards
Rahul
Just inspect (F12 in normal browsers) the html code of current page and focus on body tag.
There is always specific/unique body ID and mutliple classes (mosly unique) which will help you identify current page content in browser.
Look at the screenshot, it should be self explaining.
I really appreciate your help.
Regards
kumar