[Tutorial] How to Add Background Image to Thesis Theme

We have covered many tutorials on thesis theme customization so far. In this tutorial we will see how we can add background image to thesis theme. Its pretty easy to add an image as background to thesis. We will just make use of only CSS in this tutorial.

Thesis is the best theme framework. You can see majority of the blogs using thesis. I also recommend it to all my fellow bloggers, as you can easily change the colors, skins and also can customize it to change the look and feel of your site within minutes. To customize thesis for basic look do not need any knowledge of CSS, HTML or PHP etc., Just you use the “Design Options” to choose and play with colors.

What are we Going to Create?

Our default thesis theme look like this.

Add Background Image to Thesis Theme

This is what our theme looks after adding an background image.

How to Add Background Image to Thesis Theme

How Do I Add Background Image to Thesis Theme?

1. First login to your hosting cPanel or use any FTP to access your site files.

2. Open thesis theme folder and locate “images” folder. Upload an image which you need to set as background. I have uploaded a image named “euts-bg.png” in my thesis images folder.

I am going to use this image for background. You can download this or use your own image.

Download Image Here

3. Login to your wordpress dashboard. Open “Custom File Editor” under “Thesis theme options”. Select custom.css file. Enter the below code.

This will add background image to thesis theme. Replace “etuts-bg.png” with your image name.

I have given a border of 4px to container. If you do not like the border then you can remove or just comment the highlighted line.

That’s it for this tutorial. If you want to know about any other customizations then do let me know. I will cover them. Many more tutorials are yet to come. Keep updated by subscribing to our feeds.

5 Responses to “[Tutorial] How to Add Background Image to Thesis Theme”
  1. hnd March 2, 2012
  2. Unemployment April 5, 2012
  3. allain April 15, 2012
  4. Red May 30, 2012
  5. Priya Chopra December 15, 2012

Leave a Reply

Your email address will not be published. Required fields are marked *