In two themes, District and Cafe, the main homepage image is configured to respond to the width of the customer's browser. Due to the nature of this feature, the homepage image cannot be swapped by making on-page edits. Instead, follow the instructions below to change your main homepage image.

Swap the Image Via FTP

If you have already purchased a live store, you can set up an FTP account and use it to change the image.

  1. Upload a new home page image to your FTP.
  2. If you have not already, go to your storefront and select Enable on-page editing from the Edit menu.
  3. Hover over the main image and click Edit to open the Easy Editor.
  4. Click the HTML button in the Easy Editor toolbar.
  5. Between the quote marks in the img src="" portion of the code, insert the new file path where you placed the image. For example, if you placed the image in your store's "images" folder, your can edit the code to display img src="/v/images/newhomepage.jpg"

Replace the Image Without FTP

You may feel more comfortable swapping the image using Volusion's Easy Editor, or you may not have access to your store's FTP.

  1. If you have not already, go to your storefront and select Enable on-page editing from the Edit menu.
  2. Hover over the main image and click Edit to open the Easy Editor.
  3. Click the HTML button in the Easy Editor toolbar, then copy the contents of the window to your clipboard.
  4. Once you have verified that you have the contents copied, delete the code and click Save.
  5. Click Dashboard to view your store's Admin Area.
  6. Go to Design > Site Content.
  7. Scroll to the Home / Welcome Pages section and click to open Article 2 (Default.asp Above_Featured_Products).
  8. Click the HTML button in the Easy Editor toolbar for the Article Body field, then paste the content from your storefront into the field and click Save.
  9. You can now follow the instructions on using the Easy Editor to swap out your homepage image.

Editing CSS in Cafe Theme

In order to fully change your main homepage image without FTP when using the Cafe theme, you must make two minor CSS adjustments.

  1. In your store Admin Area go to Design > File Editor.
  2. In the Shortcuts menu, click to open the Template.css file.
  3. Select homepage.css from the Choose File menu at the top of the page.
  4. Find the #content_area img[src$="FeaturedProducts.gif"] {position: absolute;} line of code.
  5. Remove the position, top, and left lines and click Save.
  6. Find the main #content_area line of code.
  7. Change the padding: 100px 0 40px 0; line to read padding: 0px 0 40px 0;
  8. Click Save.
Did this answer your question?