スライダ/ギャラリーの各画像に数値を追加するにはどうすればよいですか？

Question

OpenCart 3.0.2.0では、Journal2テーマで、製品ページに大きなメイン画像と追加画像を表示するギャラリーがあります。

は、ここで追加の画像のためのコードです：

である私は何をする必要が

{% for image in images %} 
    <a class="swiper-slide" {% if journal2.settings.get('product_page_gallery_carousel') %} style="width: {{ 100/journal2.settings.get('product_page_additional_width', 5) }}%" {% endif %} href="{{ image.popup }}" title="{{ heading_title }}"> 
     <img src="{{ image.thumb }}" title="{{ heading_title }}" alt="{{ heading_title }}" itemprop="image"/> 
    </a> 
{% endfor %} 

、各サムネイルに数を追加します。したがって、1番目の追加のサムネイルには「1」、2番目のサムネイルには「2」などがあります。

後でCSSで外観をフォーマットしますが、最初にこれらの数値を作成する方法を理解するのに十分なPHPは分かりません。

私はコード例を見ることができますが、そこから理解することができます。前もって感謝します！

Answer 1

PHP Twigを使用していますか？もしそうなら、あなたはTwig loop variableを使うことができます。

最初のサムネイルに1を設定する場合は、loop.indexを使用できます。あなたがあなたのイメージの前に番号を入れたい場合は、この試すことができます：

{% for image in images %} 
    <a class="swiper-slide" {% if journal2.settings.get('product_page_gallery_carousel') %} style="width: {{ 100/journal2.settings.get('product_page_additional_width', 5) }}%" {% endif %} href="{{ image.popup }}" title="{{ heading_title }}"> 
     {{ loop.index }}. <img src="{{ image.thumb }}" title="{{ heading_title }}" alt="{{ heading_title }}" itemprop="image"/> 
    </a> 
{% endfor %} 

を、私はあなたが数字の後にピリオドをしたいと仮定していますので、私は、インデックス番号の後にピリオドを追加しました。明らかに、期間は必要ではありません。

こちらがお役に立てば幸いです。