Question

I have created a multi option attribute so that I show an image for each option but i can not get it to work.

I have used this code from another post on here to get a list of the options to show.

The code I used is:

<?php if($_product->getResource()->getAttribute('suitable_for')->getFrontend()->getValue($_product)): ?>
        <h4>Suitable for:</h4>
        <ul><li><?php
            $_comma = ",";
            $_list = "</li><li>";
            echo str_replace($_comma,$_list,$_product->getResource()->getAttribute('suitable_for')->getFrontend()->getValue($_product))    ?>    
        </li></ul>
        <?php endif; ?>

So this now shows a list of the options, one of on top of each other.

As I said I would like an image to be shown for each option.

I thought the best way would be to have divs and assign an image to each div.

I was hoping that I could get the output to be:

<div class="option1"></div>
<div class="option2"></div>
<div class="option3"></div>
<div class="option3"></div>

instead of the output that the code above has:

<ul>
    <li>option1</li>
    <li>option2</li>
    <li>option3</li>
    <li>option4</li>
</ul>

Answer 1

Change your code to

<?php if($_product->getResource()->getAttribute('suitable_for')->getFrontend()->getValue($_product)): ?>
    <h4>Suitable for:</h4>
    <div class="<?php
        $_comma = ",";
        $_list = "\"></div><div class=\"";
        echo str_replace($_comma,$_list,$_product->getResource()->getAttribute('suitable_for')->getFrontend()->getValue($_product))    ?>    
    </div>
    <?php endif; ?>