Express Entry Detail Template

I am trying to create a Express Entry Detail template and wonder if anyone can help with php code to output a Option List with multi values so I can wrap each value in html code.

i.e. List is 'colour options available for product. SO I want the temple to output whichever colours are selected in separate Div to create sample swatch for each

Product 1 available in Red Green Blue
Product 2 available in Green
I want the template to output each colour as a

and the colour would be the css class for the div. I have tried lots of things without success. I get all colours inline. Any help would be much appreciated. Below how it works at the moment but obviously if the client wanted to add more colours I would have to amend the code rather than it working dynamically when new colours are added in Express

<?php $colours = strtolower($product->getAttribute('colour')); ?>
<?php if (strpos($colours, 'white') !== false ) { ?>
<div class="alert alert-white col-1 m-1" data-bs-toggle="tooltip" data-bs-placement="top" title="White" ></div ><?php } ?>

A lot of magic is happening behind the scenes when dealing with Select attribute.
$product->getAttribute('colour') is actually iterable and it is also “magically” converted to string when being displayed/casted to string (echo method etc.).
You can loop through attribute as it was a normal array, for example:

<?php $colours = $product->getAttribute('colour'); ?>

<?php if (count($colours->getSelectedOptions())): ?>
    <div>
        <?php foreach ($colours as $colour): ?>
            <div class="<?php echo h(strtolower($colour)); ?>">
                <?php echo h($colour); ?>
            </div>
        <?php endforeach; ?>
    </div>
<?php else: ?>
    <div>No options selected</div>
<?php endif; ?>
1 Like

Excellent! Thanks for coming back so quickly. I have spent hours trying work out a solution. Your solution works perfectly thank you very much appreciated. Great way to finish a Friday
Many thanks again

Happy to help.

You can also mark my post as solution:D

Cheers

Hi me again. I was wondering if its possible to separate out values in an option list so that one part is a label and another is a css clas. I have done something similar in, sorry to swear lol, wordpress. I put a value in of “New Product : red” and then get it so when I selected the one option it changed the text on a css ribbon and also changed the colour. Hope that makes sense. I have attached a screenshot which I hope explains a little more.

<div class="ribbon ribbon-top-right **red**">
    <span>**NEW PRODUCT**</span>
</div>

You could just create another Select attribute (which would store colors separately) or just fill Select options the same as in Wordpress New Product : red (with separator).
You would then need to explode that attribute:

$colourItems = explode(':', $colour);
$label = isset($colourItems[0]) ? trim($colourItems[0]) : false;
$cssClass = isset($colourItems[1]) ? trim($colourItems[1]) : false;

if (!empty($label)) {
    echo h($label);
}
if (!empty($cssClass)) {
    echo h($cssClass);
}

where first argument of explode function is your separator (: or | or whatever character you use to divide option).

Thats for that solution. This is how I am trying implement it. I think I must be doing something wrong.

<?php $ribbons = $product->getAttribute('ribbon'); ?>

                  <?php
                  $ribbonItems = explode(':', $ribbon)
                  $label = isset($ribbonItems[0]) ? trim($colourItems[0]) : false;
                  $cssClass = isset($ribbonItems[1]) ? trim($ribbonItems[1]) : false;

                  if (!empty($label)) {
                      echo h($label);
                  }
                  if (!empty($cssClass)) {
                      echo h($cssClass);
                      } ?>
                      <?php if (count($ribbons->getSelectedOptions())): ?>

                      <?php echo h(strtolower($label)); ?>
                      <?php echo h(strtolower($cssClass); ?>

                          <?php endforeach; ?>
                  <?php else: ?>
                      <div>No options selected</div>
                  <?php endif; ?>
                  <div class="ribbon ribbon-top-right <?php echo h(strtolower($cssClass); ?>">
                              <span><?php echo h(strtolower($label)); ?></span>
                          </div>
                        <?php endforeach; ?>
                <?php else: ?>
                    <div></div>
                <?php endif; ?>

I get an error " ParseError syntax error, unexpected ‘$label’ (T_VARIABLE)" (see screenshot). I have called the option list ribbon btw. My first value is "New Product : red

Thanks for your help ver much appreciated

I have missed semicolon at the end of

$ribbonItems = explode(':', $ribbon);

Thanks for that. It doesnt appear to be pulling anything through. I am sure it me being unless. I also want it to have no ribbon if nothing selected in option list. My poor attempt at this below:

                      <?php $ribbonItems = $product->getAttribute('ribbon'); ?>
                      <?php
                          $ribbonItems = explode(':', $ribbon);
                          $label = isset($ribbonItems[0]) ? trim($ribbonItems[0]) : false;
                          $cssClass = isset($ribbonItems[1]) ? trim($ribbonItems[1]) : false;

                          if (!empty($label)) {
                              echo h($label);
                          }
                          if (!empty($cssClass)) {
                              echo h($cssClass);
                              } ?>
                          <?php if ($ribbonItems); { ?>

                          <div class="ribbon ribbon-top-right <?php echo h(strtolower($cssClass)); ?>">
                              <span><?php echo h(strtolower($label)); ?></span>
                          </div>
                        <?php } ?>

Sorry for my lack of coding skill
Thanks you

Is “ribbon” attribute single or multiple option select?

Its single so only one option will be selected, one value i.e. New Product : red

Then first line in your code should look like:

<?php $ribbon = (string) $product->getAttribute('ribbon'); ?>
1 Like

Thanks for all your help, I have almost got it working as I want it. For some reason the code is appearing even when there is no values in the option field. I puts the div and without the class and text label in (see screenshot). I thought the “if” would do the trick

<?php $ribbon = (string) $product->getAttribute('ribbon'); ?>
                        <?php
                            $ribbonItems = explode(':', $ribbon);
                            $label = isset($ribbonItems[0]) ? trim($ribbonItems[0]) : false;
                            $cssClass = isset($ribbonItems[1]) ? trim($ribbonItems[1]) : false; ?>

                          <?php if  ($ribbonItems) {
                            echo ('<div class="ribbon ribbon-top-right '. h(strtolower($cssClass)) .'">
                                <span>'. h($label) .'</span></div>');
                          } ?>


Thanks again for your patience and help very much appreciated

Try replace

<?php if  ($ribbonItems) {

with

<?php if (!empty($label) and !empty($cssClass)) {

Genius! Perfect! all working as it should, I was all sorts of code to make it work. Simple when you know how. Thank you so much for your help, really appreciated. Here is the whole code just incase its usefully to anyone else. Thanks again

<?php $ribbon = (string) $product->getAttribute('ribbon'); ?>
                        <?php
                            $ribbonItems = explode(':', $ribbon);
                            $label = isset($ribbonItems[0]) ? trim($ribbonItems[0]) : false;
                            $cssClass = isset($ribbonItems[1]) ? trim($ribbonItems[1]) : false;
                            ?>

                          <?php if (!empty($label) and !empty($cssClass)) {
                            echo ('<div class="ribbon ribbon-top-right '. h(strtolower($cssClass)) .'">
                                <span>'. h($label) .'</span></div>');
                          } ?>