17
Aug

Find your product

First of all, you’ll need to log into your ProStores Store Administraor. Click on the Product link located on the left column. Browse through your catalog and open up the product that you want to edit. Once you find the product you can click the UPDATE button.

tutorialimages1

Edit Images Section

After you click on the UPDATE button you will notice that each of the product sections are editable. Open up the images section.

Remove the current Search Result Image.  One you can see that it is gone, click on the ADD NEW IMAGE button for the Search Results Image section.

tutorialimages1

Browsing Your Computer

A small pop window will appear. Hear you are going to click on the BROWSE button that is available.

tutorialimages1

Find Your Image

Simply find the image that you want to use for your product thumbnail. Click on the image that you want and then click on the OPEN button.

tutorialimages1

Upload Your New Image

After you click on the open button, you will notice that the browse bar will show some text indicating that you have successfully chosen an image to upload. After this is done, click on the SAVE button.

tutorialimages1

Product Detail Image

We are not going to use the Product Detail Image section. If you see an image here, click the REMOVE THIS IMAGE link located below the image preview.

tutorialimages1

Detail Image Cleared

Once it is cleared you will notice the thumbnail is now gone and the field is also empty. When you’re done with this step, go ahead and save all your edits. It’s always good practice to save your work once in awhile. You are not done with editing the product yet. So do not close this window.

tutorialimages1

Getting Ready To FTP

First thing we are going to do is to make sure that we have our images ready for our Details page and the image that will zoom out.

I made two images:

  1. art_gal_des_lrg.jpg    (Zoom Image: This image can be as large as you want. Just make sure the filesize is not over 500mb. )
  2. art_gal_des_med.jpg      (Details Page Image: The maximum width should not go over 300 px. The height can fluctuate if needed. )

The image being used in this example is a vertical rectangle. If you were using something that was more of a horizontal rectangle, the DETAILS PAGE image width still cannot go over 300 px. Try not to leave any spaces in your filenames. Use _ underscores or – hyphens if you want to visually seperate words.

tutorialimages1

Open Fire FTP

In your firefox browser, go to the TOOLS menu and open Fire FTP. Log into your FTP account.

The left side of Fire FTP shows your computer. Find your two new images that we just discussed above on your computer.

The right side shows your server.Click on the “Store” folder and then click on the “Catalog” folder. PLEASE DO NOT NAVIGATE ANYWHERE ELSE. Be very careful when you are on your server.

tutorialimages1

Transfer Your Files

There are two ways to transfer your files.

  1. Select the two files. Then click on the arrow circled in red. Notice that the arrow points to your server meaning that the files will be transfered to the right side.
  2. Or, you can click and drag the files over to the server side. The green arrow illustrates you dragging your mouse to the server side then releasing your mouse to start the transfer.

I suggest using the first method. It’s easier. The bottom of your Fire FTP program will let you know when the transfer is complete.

tutorialimages1

Edit the Long Description

Go back into your product editor and copy and past this code into your Long Description section.

<a href=”http://www.enhancingyourhabitat.com/catalog/filename_lrg.jpg”><img alt=”" src=”http://www.enhancingyourhabitat.com/catalog/filename_med.jpg” /></a><br /><br />Description:<br />
<ul>
<li>Bullet 1</li>
<li>Bullet 2</li>
</ul>
Another paragraph can continue here.

All you need to do is change the filename_med.jpg and filename_lrg.jpg text to your actual filenames that were uploaded. In this tutorial I changed them to art_gal_des_lrg.jpg   &  art_gal_des_med.jpg  .

tutorialimages1

Edit Your Description Text

I have started your description text with generic info. You can edit this text however you want using the basic tools in Prostores.

tutorialimages1

View Your Product

And we are done. View your info and make sure that are appearing properly.

tutorialimages1

Test the Zoom Feature

Click on your image to text your zoom feature. That is it, your are done. The first time is the worst but it will get easier.

tutorialimages1

SUGGESTIONS AND TIPS:

I would create all my medium and large images first

Then I would ftp all my images to the website server.

When I edit my products all I need to do now is make new thumbnails and paste the generic text above into my Long Description field.

Category : News

2 Responses to “How to update products in ProStores”


Beth September 27, 2009

Hello,

I was so happy when I found this info. Unfortunately I have been trying to implement this for two days and it is not working.

What I have done is create my photos and uploaded them to my catalog folder on the server. I have entered the following code in the description area:
Description:

Bullet 1
Bullet 2

If you could offer some assistance I would really really appreciate it. I’ve left everything in case you want to follow the link and see the result.

Much thanks,
Beth

admin October 2, 2009

I’m sorry. The instructions are for a theme that I have built only. It is totally custom. You can see it at http://www.enhancingyourhabitat.com. Check it out.