How to change background image on splash page

1. Upload your splash page background image (“YOUR_BG_IMAGE.FORMAT”) over FTP to the folder “Images”, located here: “WEB_DIRECTORY/skin/frontend/memberonly/default/images”.

2. To edit the file “login.phtml”, follow the path “WEB_DIRECTORY/app/design/frontend/memberonly/default/template/customer/form/”.

3. Find the string ‘<img alt=”” src=…’ in div tag with attribute id=”bg”, which is usulally located in line 51, and has the value

<div id="bg">
    <img alt="" src="<?php echo $this->getSkinUrl('images/bg-splash.jpg');?>" />
</div>

Then, edit the src attribute, changing the file name as shown below

<div id="bg">
    <img alt="" src="<?php echo $this->getSkinUrl('images/YOUR_BG_IMAGE.FORMAT');?>" />
</div>

4. Save file changes.

5. Reload splash page in browser.

6. If you still see the old background image, check if the previous steps have been followed properly or clear the browser page cache.

Important Information:

The images used in our script vary in sizes, depending on the website design (template). Still, to avoid possible problems we suggest choosing a definite image format for every website.
For instance, in our Demo Store we used the following parameters:

  • Recommended Splash Page Image size: 2000x1277px.
Was this article helpful?