PROD page Image Machine javascript needed for Iron and Wool

Collapse
X
 
  • Time
  • Show
Clear All
new posts

  • d2d2d2
    replied
    Et voila! It works!

    I had to log off and on to get the 'Image Type: Main' to appear as an option, but that did the trick. The 'click to closup' field was on. Everything working beautifully now. Thank you, thank you!

    Leave a comment:


  • Matt Zimmermann
    replied
    You're welcome Katie.

    Now that the module is active, are you able to select 'Image Type: Main' in the Custom Fields box in the product display layout? Also, make sure you have 'Enable click to closeup' checked under Product Display Layout Image Dimensions.

    Leave a comment:


  • d2d2d2
    replied
    It was not active. But it is now. Unfotunately, it did not fix the problem. Also, of note, if that module was never active, why did the zoom function work before?

    I did run an update to Miva 9.0067 around the same time the zoom function went missing. But I am more inclined to wonder that in my custom field learning process I might have inadvertently turned something off? I would also mention though that even when I put my product display page back to the default readytheme layout, the zoom still doesn't work.

    Thanks again for you help here, Matt.

    Leave a comment:


  • Matt Zimmermann
    replied
    In the Utilities section of your administration portal, make sure the Product Image Custom Fields module is active.

    Leave a comment:


  • d2d2d2
    replied
    I bet you are right. Miva is not seeing the custom "main" image. But I am not sure where that setting is located to activate it? I am not seeing anything obvious in the PROD page settings/items nor anything in the product display layout. I do see the area to select/deselect custom fields but I thought that was legacy? (other than product flags) and also, I don't see a main image to add there anyways. Can you point me in the right direction?

    I should also add that I was learning how to add custom fields to a page when all this disappeared. I did manage to figure out how to READ a custom field but did I also disable the main image somewhere else?
    Last edited by d2d2d2; 04-19-17, 08:20 AM. Reason: added more text

    Leave a comment:


  • Matt Zimmermann
    replied
    Make sure you have the main image custom field set as active in the product display layout.

    Leave a comment:


  • d2d2d2
    replied
    Thank you, Matt. I do see the span element in my Product Display box but I don't think it is working properly? Is it possible that I forgot to assign an item to the product page or something in javascript call is wrong? What I see is the If/Else functionality ignoring the <mvt:if> and going right to the <mvt:else> and just displaying the default main-image. I DO have custom fields turned on. I DO have my first image assigned as "main". Is there something else I might have missed? Goodness knows, I did a lot of searching around trying to troubleshoot this problem. I do feel that all my settings have been put back to the Ready Theme default but I wouldn't swear to it.

    Here is the code in my Product Display area of the PROD page.

    Code:
    <span class="flag &mvt:product:flag;">
    
                <mvt:if expr="NOT ISNULL l.settings:product:customfield_values:productimagecustomfields:main">
    
                    <span data-icon="&#x54;" id="js-main-image-zoom" class="main-image" data-index="0"><img src="graphics/en-US/cssui/blank.gif" alt="&mvte:product:name;" title="&mvte:product:name;" id="js-main-image" data-image="&mvt:product:customfield_values:productimagecustomfields:main;" /></span>
    
                <mvt:else>
    
                    <span class="main-image" data-index="0"><img src="graphics/en-US/cssui/blank.gif" alt="&mvte:product:name;" title="&mvte:product:name;" id="js-main-image" data-image="&mvt:product:customfield_values:productimagecustomfields:main;" /></span>
    
                </mvt:if>
    
            </span>

    Leave a comment:


  • Matt Zimmermann
    replied
    That error is just saying that the image being called when there is no image has not been uploaded to the server at that location.When I go to your site, I am seeing the images and thumbnails showing. The only part I am not seeing the the zoom image functioning. This is probably due to the fact that the SPAN element surrounding the main image is missing the attribute is="js-main-image-zoom"

    Leave a comment:


  • d2d2d2
    replied
    I actually found that on the Suivant readytheme thread earlier today but didn't think it was correct. So, I just now plugged that in and it still didn't fire. I am getting an error message about thumbnails missing? I think? See linked screenshot (I cannot figure out how to upload anything bigger than a thumbnail!)



    Thanks for quick response!

    Leave a comment:


  • Matt Zimmermann
    replied
    Here is the code for Product Display Layout Image Machine section of the PROD page:
    Code:
    <mvt:assign name="l.settings:clean:product:name" value="glosub(l.settings:product:name, asciichar(39), '&#39;')" />
    <script>
        var gallery = [],
            thumbnailIndex = 0;
    
        ImageMachine.prototype.ImageMachine_Generate_Thumbnail = function (thumbnail_image, main_image, closeup_image, type_code) {
            var thumbnail,
                img;
    
            thumbnail = document.createElement('div');
            thumbnail.className = 'column one-third medium-one-fourth';
            thumbnail.setAttribute('data-index', thumbnailIndex++);
    
            if (typeof(thumbnail_image) == 'string' && thumbnail_image.length > 0) {
                img = document.createElement('img');
                img.src = thumbnail_image;
                thumbnail.appendChild(img);
            };
            if (typeof(closeup_image) == 'string' && closeup_image.length > 0) {
                gallery.push({
                    src: closeup_image,
                    title: '&mvt:clean:product:name;'
                });
            };
            return thumbnail;
        };
    </script>
    As for the settings, make sure both boxes are checked and the following variable names are used:
    • js-main-image
    • js-thumbnails
    • js-closeup-container
    • js-closeup-image
    • js-closeup-close

    Leave a comment:


  • PROD page Image Machine javascript needed for Iron and Wool

    filedata/fetch?id=689682&d=1512275252&type=thumb Looking for some help getting the Iron and Wool javescript for the Product Display Layout Image Machine Head Template text area. Also the default settings. A screen shot would be great.

    Long story, short: I was messing around with creating a custom product page and while looking at assigned items on the default PROD page, I deleted the Image Machine. When I reassigned it, the Iron and wool script was gone and only the default Miva version remained. I have fussed a bit looking at Iron and Wool head tag and seem to have the correct settings in place. I can see my page calling for the script but it's not firing? The image tags remain empty and slick slider remains in a "polite" waiting mode.

    To be clear, I am working on a development sight. It's possible I changed something else in the miva settings, but I have been quite strict about keeping iron and wool js and css files in original status and only creating new files, as suggested here on the forum. I have not been working on anything to do with images or the image machine. And generally, I try to keep away from javascript, as I am not in any way proficient at it.

    Sample page: http://dev.designquest.biz/skovby-sm...mote-link.html

    Thanks for any input or help getting me back on track.

    image uploaded as thumbnail. Not sure why. Here is link to screenshot of PROD page settings:

    You do not have permission to view this gallery.
    This gallery has 1 photos.
    Last edited by d2d2d2; 04-18-17, 12:45 PM.
Working...
X