OpenCart Community

Posted: **Tue Dec 26, 2017 8:20 pm**

I was wondering, can I show pictures in the dropdown option?
If not, whats the point of letting us pick an image?

Im working on moving up to OC 3.0.2.0, but I forgot how I added the picture dropdown in my old 2.3 build.

Example here : http://bekerhuislambregts.nl/index.php? ... ct_id=1028

How do I get that back again?

EDIT: Apparently its got to do with some javascript plugin called 'ddSlick', though it seems that old extension hasn't been updated for a long time now..

Posted: **Tue Dec 26, 2017 8:53 pm**

I found the mod code;

Code: Select all

<?xml version="1.0" encoding="utf-8"?>
<modification>
    <name>dd ocmod</name>
    <id>v1.1_dd_ocmod</id>
    <version>v1.1_dd_ocmod</version>
    <author>ocextensions.co.uk for cancer research</author>
    <link>mailto:support@ocextensions.co.uk</link>
    <code>v1.1_dd_ocmod</code>         
    <file path="catalog/controller/product/product.php">
        <operation>
            <search><![CDATA[$this->document->addScript('catalog/view/javascript/jquery/magnific/jquery.magnific-popup.min.js');]]></search>
            <add position="before"><![CDATA[            $this->document->addScript('catalog/view/javascript/jquery/ddslick.js');
            $this->document->addScript('catalog/view/javascript/jquery/selectors.js');]]>
            </add>
        </operation>
        <operation>
            <search><![CDATA[product_option_value_id]]></search>
            <add position="after"><![CDATA[                                                        'imagedd'                 => $this->model_tool_image->resize($option_value['image'], $this->config->get('config_image_cart_width'), $this->config->get('config_image_cart_height')),]]>
            </add>
        </operation>
        <operation>
            <search><![CDATA[$data['images'] = array();]]></search>
            <add position="after"><![CDATA[            $data['imagedd-height'] = $this->config->get('config_image_cart_height');]]>
            </add>
        </operation>
    </file>
    <file path="catalog/view/theme/*/template/product/product.tpl">   
        <operation>
            <search index="2"><![CDATA[ class="form-control"]]></search>
            <add position="replace"><![CDATA[ 
<?php $idents = array(' ', '\'','\\'); ?>
class="<?php echo (str_replace($idents, '', $option['name'])); ?> form-control"]]>
            </add>
        </operation>
        <operation>
            <search><![CDATA[<option value="<?php echo $option_value['product_option_value_id']; ?>">]]></search>
            <add position="replace"><![CDATA[<?php if(!isset($option_value['o_description'])) $option_value['o_description'] = ''; ?>
<option data-description="<?php echo $option_value['o_description'] ?>" data-imagesrc="<?php echo $option_value['imagedd']; ?>" value="<?php echo $option_value['product_option_value_id']; ?>">]]>
            </add>
        </operation>
    </file>
</modification>

I got as far as the last replacement, but apparently the code in the twig file is much different than the old tpl system, so I dont know how to translate that in.. Can someone take a look at it?

Posted: **Tue Dec 26, 2017 9:24 pm**

Simply use the template switcher extension so to avoid on renaming all conventions from old PHP codes into new TWIG codes: https://www.opencart.com/index.php?rout ... n_id=11320

Posted: **Tue Dec 26, 2017 9:36 pm**

.. Not sure what that has to do with anything?
Im not trying to switch to an entirely different theme, I just want different dropdown boxes, ones that show a picture.

Posted: **Tue Dec 26, 2017 9:55 pm**

The link referred was due to your referred code above which uses PHP codes and the default installation of Opencart does not allow PHP codes inside TWIG files unless using an extension. This will avoid spending time on converting each PHP codes into TWIG codes by just using the referred extension.

Posted: **Thu Nov 07, 2019 5:21 am**

In 3.0.3.2 Option dropdown type 'image' is missing, whilst you can assign images to options. See 3.0.3.2 attachment.

The assigned images are not showing however.
Seems product.twig responsible for the output is correct, but I am not sure.
=============
{% if option.type == 'radio' %}
<div class="form-group{% if option.required %} required {% endif %}">
<label class="control-label">{{ option.name }}</label>
<div id="input-option{{ option.product_option_id }}"> {% for option_value in option.product_option_value %}
<div class="radio">
<label>
<input type="radio" name="option[{{ option.product_option_id }}]" value="{{ option_value.product_option_value_id }}" />
{% if option_value.image %} <img src="{{ option_value.image }}" alt="{{ option_value.name }} {% if option_value.price %} {{ option_value.price_prefix }} {{ option_value.price }} {% endif %}" class="img-thumbnail" /> {% endif %}
{{ option_value.name }}
{% if option_value.price %}
({{ option_value.price_prefix }}{{ option_value.price }})
{% endif %} </label>
</div>
{% endfor %} </div>
</div>
{% endif %}
============
In version 1.5.5.1 where it works OK there is a specific check for 'image' type in product.tpl, code starting with:
<?php if ($option['type'] == 'image') { ?>
I can't find it in 3.0.3.2 product.twig.
Seems some code is missing.
Can anyone fix this?

Posted: **Thu Nov 07, 2019 9:43 am**

You thought, "instead of creating my own new topic, let's dig up one from 2017 and bring it back to life".

OpenCart Community

Dropdown option not showing images?

Dropdown option not showing images?

Re: Dropdown option not showing images?

Re: Dropdown option not showing images?

Re: Dropdown option not showing images?

Re: Dropdown option not showing images?

Re: Dropdown option not showing images?

Re: Dropdown option not showing images?