1

I am completely new to Drupal 7 and have searched the web hard for a good tutorial that teaches me how to add a custom background to Drupal sites, but to no avail.

I have a Drupal 7 multi-site set-up and I am just trying to change the background image of the Bartik theme to a custom image.

In my project directory I have the following folders:

mysite/files
mysite/modules
mysite/themes
mysite/tmp
mysite/settings.php
mysite/default.settings.php

Could someone please tell me a way to create a custom background, exclusively, for the site "mysite" without editing any of the core files?

Thanks.

Improve this question

1 Answer 1

Reset to default
2
  1. Create a folder called "myTheme" in sites/all/themes
  2. Create a file in that new folder called "myTheme.info"
  3. Copy the sample .info from below into the info file
  4. Now create a folder in your theme called "css"
  5. Now copy style.css from Bartik's css folder into your css folder
  6. Now change the background using CSS
  7. Any other changes you want to make? Copy from bartik into your theme folder, make the change

Sample info file:

name = My Theme
description = My theme is amazing
core = 7.x
engine = phptemplate
base theme = bartik
Improve this answer
9
  • Hi Jonathan, thanks for the prompt response. I have done what you detailed above and added the following code to style.css in mysite/themes/css/ - "body { background-image:url('../img/globe_connect.jpg); }" However, it is not changing the default Bartik background. Did I do something wrong or miss a step? I assume this file is not being loaded properly when I load up my page. Thanks.
    – czchlong
    Commented Feb 21, 2012 at 21:45
  • Did you change your theme to "myTheme" in the site building, appearance section? This doesn't change bartik, it creates a new theme that's based on bartik.
    – Jonathan Rowny
    Commented Feb 21, 2012 at 21:46
  • Also, I believe it should by in mysite/themes/myTheme/css Your files should all be in mysite/themes/myTheme. That's your new theme.
    – Jonathan Rowny
    Commented Feb 21, 2012 at 21:47
  • I have changed my directory setup to have style.css in /themes/my_theme/css and the image in /themes/my_theme. The css code is now: body { background-image:url('../img/globe_connect.jpg); } but still no background image is showing. I am using drupal on WAMP. Sorry if I am making stupid mistakes, but this is the first time I have been asked to design a website. Thanks a lot for your help.
    – czchlong
    Commented Feb 21, 2012 at 21:55
  • 1
    Hi Jonathan, after some tweaking i was able to it to show. thank you for your patience and help
    – czchlong
    Commented Feb 23, 2012 at 15:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.