Customization Guide – Upload Dual Background Images

W Theme Editor

 

 

Guide to Changing the background image to your custom background for Studio Theme

After uploading the DivTag template into your Weebly Editor,  you can now upload your own custom background and content background.

 

Main Background Image

1) Edit Your Main background Image File (bodybg.jpg)
Here we will edit your custom background image to ensure that it fits into the DivTag template.  We will first re-size it to the right size, and save it in the correct image format and name.

Background Image Size
This template supports any size image background. The background image is set to multiply and tile
itself to cover the entire webpage.

Background Image Format
Your background must be in the JPEG image format.  You can tell which format your image file is in by looking at your image files file extension (for example, .png or .jpg).  If your image file is not in the JPEG format (.jpg), you can simply re-save the file as a JPEG format by using image editors such as Photoshop, Microsoft Paint or other free Image Editing Tools.

click to enlarge image

Background Name

Rename your background image file so it is exactly bodybg. This is important to have your background image file named this way otherwise it will not show up in the template.  When you are in your image editor (such as Microsoft Paint), type in “bodybg” in the File Name box, and select “jpg” in the “save as type” box.

So the image file name should be “bodybg” and the file type should be in JPEG format.

 

2) Upload Your Content background Image File (bg.jpg)
In the Files section of Weebly Editor (see Footnote 1 below), upload your background image file created in Step 1 above by clicking on “Add new file(s)”.  Since you have renamed it to exactly “bg“, your background file will replace the default template background file. Remember, you must name your background image file to exactly “bg” and in JPEG format for this to work correctly.

If you have upload the background file and it does not appear on your website, check if thesize, format and name of the background image file is correct.

Footnote 1: Within Weebly Editor mode, click on the “Design” on the top of the screen, then click on “Edit HTML / CSS” tab towards to top right corner of your screen.  The Files section is on the side bar on the left hand side