| View previous topic :: View next topic |
| Author |
Message |
sjcreations
2
Joined: 27 May 2009
Posts: 141
Location: Encinitas, CA
|
 Posted: Wed Sep 01, 2010 6:02 am GMT Post subject: Photo Albums |
 |
|
Hello - Can someone direct me to where I can learn more about the "photo albums" feature? We currently just have one main product image on our detail pages but it would be great to have the ability to have more than one.
Elizabeth
_________________
www.sjcreationsinc.com |
|
| Back to top |
|
 |
ed@searchfit
2
Joined: 27 Sep 2004
Posts: 1309
|
| Posted: Wed Sep 01, 2010 6:14 am GMT Post subject: |
|
|
Here are some resources regarding the "photo albums" feature:
Here is an article that gives a general overview:
http://www.searchfit.com/blog/ecommerce/automated-image-sizing-galleries-for-ecommerce.htm
Here is a page with example code:
http://www.searchfit.us/devcart/public/generated/user2/2002_1_oz._american_1_prd1.htm
Some clients have used #2 from the code examples in the above link.
In order to have "photo albums", you must first add "Extra Images" per product. "Extra Images" can be imported, or added using the SearchFit Control Panel | "Products" tab | "Products" screen | "Edit" a Product | "Images" tab | "Extra Images" section.
Before adding your Extra Images, you should configure the automated image sizing settings for Extra Images, which can be found on the "Products" tab | "Configure Products" screen | "Images" tab | "Extra Images" section. |
|
| Back to top |
|
|
sjcreations
2
Joined: 27 May 2009
Posts: 141
Location: Encinitas, CA
|
| Posted: Wed Sep 01, 2010 6:28 am GMT Post subject: |
|
|
Great, thank you for the info.
We currently have the "hover & zoom" feature - if we were to use the galleries would it have to be one or the other? Or would we be able to have some products with the "extra" images and some that only have one image (that hovers/zooms)?
_________________
www.sjcreationsinc.com |
|
| Back to top |
|
|
ed@searchfit
2
Joined: 27 Sep 2004
Posts: 1309
|
| Posted: Wed Sep 01, 2010 7:45 am GMT Post subject: |
|
|
None of the built-in galleries have the "hover & zoom" feature... also known as jqzoom.
In order to have a gallery that includes jqzoom, you could use the SearchFit "Extra Images Web Service" to create a custom gallery. You would need to know how to write JavaScript code in order to create a custom gallery.
See the section at the bottom of this page titled "Custom Image Galleries":
http://www.searchfit.com/blog/ecommerce/automated-image-sizing-galleries-for-ecommerce.htm |
|
| Back to top |
|
|
sjcreations
2
Joined: 27 May 2009
Posts: 141
Location: Encinitas, CA
|
| Posted: Thu Sep 02, 2010 6:51 am GMT Post subject: |
|
|
Thank you - Not quite answering my question though sorry if I was not clear.
Can we have some products with one image that still has the "hover & zoom" and some products that have multiple images using the gallery feature? Is there a way to make it so if we upload "extra" images the gallery-mode will activate, but if we dont' have "extra" images nothing will change?
_________________
www.sjcreationsinc.com |
|
| Back to top |
|
|
ed@searchfit
2
Joined: 27 Sep 2004
Posts: 1309
|
| Posted: Thu Sep 02, 2010 8:06 am GMT Post subject: |
|
|
| Quote: |
| Can we have some products with one image that still has the "hover & zoom" and some products that have multiple images using the gallery feature? Is there a way to make it so if we upload "extra" images the gallery-mode will activate, but if we dont' have "extra" images nothing will change? |
Warning: The below code is not tested on a live site. There could be minor glitches which cause PHP & JS errors. Please save backups of related files (templates) before starting in case of error.
Yes, you can do that by:
1. Move the jqzoom code from your main template to the top of your detailed product template.
Your jqzoom code is:
| Code: |
<script type="text/javascript">
$(document).ready(function(){
$(function() {
var options =
{
zoomWidth: 250,
zoomHeight: 250
}
$(".jqzoom").jqzoom(options);
});})
</script> |
2. Wrap your jqzoom code in a SearchFit PHP snippet so that it only appears when Extra Emages exist for the given product. This is how the final jqzoom code should look at the top of your product template:
| Code: |
<php>
if (trim($productProperties['extra_images']) != '') {
echo '
<script type="text/javascript">
$(document).ready(function(){
$(function() {
var options =
{
zoomWidth: 250,
zoomHeight: 250
}
$(".jqzoom").jqzoom(options);
});
}); // ready
</script>';
} // if
</php> |
3. On the detailed product template, replace the existing image with: A SearchFit php snippet that adds the existing image OR the gallery, depending on the existence of Extra Images.
Replace this existing code on your detailed product template:
| Code: |
| <a href="AUTO_GENERATED_PRODUCT_IMAGE_LARGE_URL" class="jqzoom" title="AUTO_GENERATED_PRODUCT_NAME">AUTO_GENERATED_PRODUCT_IMAGE_NOALIGN</a> |
... Replace it with this:
| Code: |
<php>
if (trim($productProperties['extra_images']) != '') {
echo '<img id="generatedImgForProductAUTO_GENERATED_PRODUCT_ID" src="AUTO_GENERATED_PRODUCT_IMAGE_URL" alt="AUTO_GENERATED_PRODUCT_NAME_ONLY" title="AUTO_GENERATED_PRODUCT_NAME_ONLY" border="0">
DYNAMIC_INCLUDE(PRODUCT_PHOTO_ALBUM, albumType=smallAndThumbnailsView, targetImgId=generatedImgForProductAUTO_GENERATED_PRODUCT_ID)';
} else {
echo '<a href="AUTO_GENERATED_PRODUCT_IMAGE_LARGE_URL" class="jqzoom" title="AUTO_GENERATED_PRODUCT_NAME">AUTO_GENERATED_PRODUCT_IMAGE_NOALIGN</a>';
}
</php> |
|
|
| Back to top |
|
|
sjcreations
2
Joined: 27 May 2009
Posts: 141
Location: Encinitas, CA
|
| Posted: Thu Sep 02, 2010 8:14 am GMT Post subject: |
|
|
thank you, Ed - I'll give this a try
_________________
www.sjcreationsinc.com |
|
| Back to top |
|
|
sjcreations
2
Joined: 27 May 2009
Posts: 141
Location: Encinitas, CA
|
| Posted: Thu Sep 02, 2010 8:27 am GMT Post subject: |
|
|
Alright, I totally don't know php so don't want to mess anything up - it would be great if you could help out! It looks like our jqzoom is already in the detail template but has this --
| Code: |
<php>if (trim($productProperties['property_01']) != '') { echo '
<div id="dt-product-num"><strong>Size:</strong> '.$productProperties['property_01']; echo '</div>
';}</php>
|
Can you show me how to add in 'extra_images' property also?
Thanks!!
_________________
www.sjcreationsinc.com |
|
| Back to top |
|
|
ed@searchfit
2
Joined: 27 Sep 2004
Posts: 1309
|
| Posted: Thu Sep 02, 2010 8:57 am GMT Post subject: |
|
|
| Quote: |
| It looks like our jqzoom is already in the detail template but has this |
That is not correct. The code snippet you provided is not related to jqzoom.
FYI: the code snippet you provided says "if product property 1 is not blank, then add - Size: [the contents of product property 1]."
So, my original instructions should work.
Modifying your templates is beyond the scope of what I'm allowed to do on the forums. If you would like assistance, I suggest contacting your SearchFit account representative. Otherwise, I will do what I can to help you here. |
|
| Back to top |
|
|
sjcreations
2
Joined: 27 May 2009
Posts: 141
Location: Encinitas, CA
|
| Posted: Thu Sep 02, 2010 8:59 am GMT Post subject: |
|
|
Ok this helps thank you so much
_________________
www.sjcreationsinc.com |
|
| Back to top |
|
|
|
