Once you've got a list of vouchers shown on your show, you'll want to allow your customers to drill-into a single voucher page for more detail. This takes many cues from the single Product page for Commerce.
You'll have access to a voucher variable, which represents the single voucher you're looking at. You can also interchangeably use product if you wish.
{% extends 'shop/_layouts/main' %}
{% block main %}
<div class="row product-details">
    <div class="six columns">
        <h1>{{ voucher.title }}</h1>
    </div>
    <div class="six columns">
        <form method="POST">
            <input type="hidden" name="action" value="commerce/cart/updateCart">
            <input type="hidden" name="redirect" value="shop/cart">
            <input type="hidden" name="qty" value="1">
            {{ getCsrfInput() }}
            <input type="hidden" name="purchasableId" value="{{ voucher.purchasableId }}">
            {# Use custom amounts #}
            {% if voucher.customAmount %}
                <input type="text" name="options[amount]" placeholder="Amount">
            {% endif %}
            <input type="submit" value="{{ "Add to cart"|t }}" class="button"/>
        </form>
        <p><a href="{{ url('shop/vouchers') }}">← Back to all vouchers.</a></p>
    </div>
</div>
{% endblock %}
                        Previous ← Fetching Vouchers Next Displaying Voucher Codes →