Merx – Product variants with gallery from default variant

Plugins Kirby 3 plugin 🧩
1

Hi all,

I’m trying to customize Merx Starterkit to my needs and am running into issues, probably just due to my php-ignorance. Could you help me anyway?

I only need products with variants (prints in different sizes) and made a simple gallery instead of only the thumb for the default variant with this code in the product-variants.php

    <div data-width="1/2">
      <?php
      $images =  $page->defaultVariant()->gallery()->toFiles();
      foreach($images as $image): ?>
        <img src="<?= $image->url() ?>" alt="<?= $image->alt() ?>">
      <?php endforeach ?>
    </div>

and want to show the same gallery for all of the variants.

I thought I would need to adapt the select field accordingly and just delete the image-references here

        <select data-action="update-variant" id="color">
          <?php foreach ($page->variants() as $variant) : ?>
            <option
              value="<?= $variant->id() ?>"
              <?= $page->defaultVariant() === $variant ? 'selected' : '' ?>
              data-uid="<?= $variant->uid() ?>"
              data-image="<?= $variant->thumb()->toFile()->thumb('default')->url() ?>"
              data-image-width="<?= $variant->thumb()->toFile()->thumb('default')->width() ?>"
              data-image-height="<?= $variant->thumb()->toFile()->thumb('default')->height() ?>"
              data-image-alt="<?= $variant->thumb()->toFile()->alt() ?>"
              data-price="<?= $variant->price()->toFormattedPrice() ?>"
              data-stock-info="<?= $variant->stockInfo() ?>"
            >
              <?= $variant->variantName() ?>
            </option>
          <?php endforeach; ?>
        </select>

but it results in an error with an ‘undefined’ image.

Or is there a better way to implement sizes anyway?

Thank you!
Carola