Announcement

Collapse
No announcement yet.

Can you connect options to images?

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Can you connect options to images?

    Fellow 3dcart users,

    I would like to find a way to connect images to options, so that if "blue" is selected in the dropdown, the image changes to blue, etc. Currently my page looks like this:

    https://www.atomic-moto.com/Klim-Dakar-Pants_p_817.html

    I briefly tried the drop-image feature a while back, but felt that it was too cumbersome to set up site-wide. However, I decided to set it up for some key products.

    After setting it up, learned that it does not rotate the images in the main location. Instead, drop-image displays a thumbnail separately from the display images:

    dropimage.jpg

    Live example:

    https://www.atomic-moto.com/Klim-Dak...st_p_1329.html

    2 questions:

    1. What I would like to know, is it possible to change the template so that it inserts dropimage, without resizing, into the placement where the main image normally resides?

    2. Any other way to connect options to images?


    Thanks all.

    BP

  • #2
    Nobody has connected images to options? Really?

    BP

    Comment


    • #3
      I don't personally use options but there is an old threat that goes into some detail:

      http://forums.3dcart.com/general-con...ge-option.html

      Comment


      • #4
        CBSteven, THANKS for that. Looking into it now.

        Would also like to suggest this as a built-in feature.

        BP

        Comment


        • #5
          Drop Image

          It is a built in feature - Select "Drop Image" From the Type column in the options tab ie Bird Aviary Cage | Breeder Bird Cage | HQ 13221 Bird cage

          Comment


          • #6
            Since this thread is still relevant, I thought I'd take a moment to let you all know I've developed a script to address this very issue.

            3dcart does provide the drop images as a preview for the customer, but the drop image does not update the main image, nor does it have the ability to show each as clickable "swatch" thumbnails.

            I originally developed a barebones version of the script for a recent client on 3dcart. I'll have to get his permission before linking here.

            Although I'm still adding features and the configuration file is not completely done I would like to get your opinions on the plugin itself and what you would like to see from it. I expect to have a working salable version by this upcoming weekend.

            The script currently searches your page for advanced options using the "dropdown" or "dropimage" settings. If the option itself is a dropdown without the image, it makes a clickable region and populates it with the name of the option you provided in the admin panel. I'll use apparel as an example - this would be the equivalent of small, medium, large etc. You most likely wouldnt display an image for that.

            If there are more than one option groups found, the first becomes the "parent" or "master" option and the second set depends on whatever the first selection is. Extending the apparel example - the secondary option would be a color choice small->orange.

            Small orange can (and should) be shown to the customer in an image - so the color would make great use of the "dropimage" option. When the script finds a "dropimage" option group it then takes the paths to the images and loads them as thumbnail swatches. When these swatches are hovered, a preview of the full size image will replace the main product image (something that does not happen by default with 3dcart) but if the customer does not click on the item, it will revert back to the image that matches whatever would be added to cart.

            If the customer clicks on a different color, however, the main image will update (as will magic zoom) and this now becomes the selection that would go to cart if added at any given time.

            The changing on hover can be too much for some people, so theres a configuration to disable that.

            If that wasn't enough, I've taken it a step further. The more option groups that exist, the more chance there may be of a product selling out and being unavailable. As a customer I would expect if I can select it, I can buy it. This generally does not notify the customer the options are unavailable until they try to physically add to cart. Then it becomes a guessing game. What about the combo isn't valid?

            If you leverage quantity on hand by your advanced options, my script is able to leverage whats in stock and what's out of stock. When an item is sold out, the selection will be greyed out and disabled so the customer cannot possibly choose something they cannot buy and become disappointed with your store.

            "But James, what if a size is completely sold out of all colors?"
            - the parent option will be disabled at that point and the first available valid one will be automatically chosen in its place.

            "What if I have default values set for the page and one or both of them happens to be out of stock?"
            - the script is smart enough to know that, and will select the first valid combination of both options. The same goes for when switching parent options. if you have an orange in stock for small, but large is sold out, even though the orange is selected when you click onto large, it will change the selection (and the large image) to a valid salable color when the options re-render.


            I still have a few more options like i said before that i would like to put in. Letting the customer set what options should be considered the parent and what options are dependent is one of them. Support for multiple dependent options is also on the list.

            The only limitation I see currently for the script is that we cannot combine two different drop images out of the box. Updating the template with a custom image with variables from more than one option set IS POSSIBLE but it would take a modified strategy and a modified script to do so.

            If you are still with me on this wall of text (which I apologize for) you can see the script in action here: Advanced options enhancement

            The site was thrown together this weekend (i'm working on my main site as well) and it was only the absolute bare minimum to ensure the script was working. It is currently for showcasing the script and nothing more. Within the next few days the script, the example page, better links to the example, and portions of my new main website will be introduced as well as a ton of other things I have in store. Please take the linked page as a "under construction" mentality.

            I beg of you your feedback and suggestions for improvement/change.

            (yes, the price listed is the price I plan on selling the script for. I will install it on your template - html/css/js that is necessary but i will not do anything with the 3dcart data - that is not covered. Should any changes to the templates be made that 3dcart releases - I will support updating it to full working order again)

            Comment


            • #7
              Very nice script. Good job.

              jeff
              Jeff

              The Wedding Printer

              Comment


              • #8
                Very nice. Will keep that tucked away for future implementation.

                Comment


                • #9
                  Thanks to both of you for the kind words.

                  For anyone reading, how do you generally use 3dcart to handle backorders? What message would you display to the customer? The business models I have worked with have not allowed backorders in the past.

                  Comment


                  • #10
                    I know this thread is from 2013 but jleclair, do you still have this code available?

                    Comment

                    Working...
                    X