Forum

Thread tagged as: Question, Shop

Swimming Holidays - Perch Shop

Hi there,

We have a client that sell swimming holidays - https://thebigblueswim.com/ Currently they get users to fill out a long form

https://thebigblueswim.com/bookings/book-now.php

I am pretty confident we can use Perch shop to sell these holiday places. But we have a few stumbling blocks that maybe you could help with:

  1. They would need swimmers to be able to pay 20% deposit and then the remaining balance at a later date
  2. Also if a user is booking for two people how could we incorporate this. In terms of getting their Swim fitness and Emergency contact details.
  3. Also we have to give the customer the option of choosing a single room or double room. But if they choose a single its an extra cost. How could I add this onto the final cost?

  4. Also if a customer books 4 places I would like to give them a discount as they are essentially buying in bulk.

    Thanks for the help :-)
Fishtank Creative

Fishtank Creative 2 points

  • 5 years ago
Drew McLellan

Drew McLellan 2638 points
Perch Support

5 years ago

They would need swimmers to be able to pay 20% deposit and then the remaining balance at a later date

You could possibly manage that with two products. Assign a tag when the deposit is purchased, and use that to then make the balance product available.

Also if a user is booking for two people how could we incorporate this. In terms of getting their Swim fitness and Emergency contact details.

That's on the roadmap as a feature - there's not currently direct support for it.

Also we have to give the customer the option of choosing a single room or double room. But if they choose a single its an extra cost. How could I add this onto the final cost?

Those would probably just be variants.

Also if a customer books 4 places I would like to give them a discount as they are essentially buying in bulk.

Would you be selling other products? If not this could just be a promotion.

It sounds like you might be skirting on the edges so it would be worth taking a couple of hours to prototype before committing.
Fishtank Creative

Fishtank Creative 2 points

5 years ago

Regarding this point

Also we have to give the customer the option of choosing a single room or double room. But if they choose a single its an extra cost. How could I add this onto the final cost?

If a customer chooses a single room the total cost would increase by an extra £100 I notice when we generate the variants there is an option to edit the price. But the total doesn't get updated.

Is there a way to update the total based on an option they choose?
Drew McLellan

Drew McLellan 2638 points
Perch Support

5 years ago

What do you mean by the total in this context?
Fishtank Creative

Fishtank Creative 2 points

5 years ago

For example a Swim costs £780 but if they want a single room its a extra cost of £120 so if a customer chooses "Single Room" I need the total cost to be £900
Drew McLellan

Drew McLellan 2638 points
Perch Support

5 years ago

That's correct, yes.
Fishtank Creative

Fishtank Creative 2 points

5 years ago

Ok, but how do I get these options to appear in my cart?

I have added the following to the product.html template

<perch:if exists="has_variants">
  <perch:input id="product" type="select" options="<perch:shop id="_variant_opts" type="hidden" />" placeholder="Please choose" required="true" /> 
</perch:if>

Then when I generate my variants I have edited the price for the single option (See image below)

https://www.awesomescreenshot.com/image/1534873/b104e00b528698b07fc67f1d4e51b65a

So when I view the product and choose the Single Room option and click add to cart the product variant doesnt appear in the cart.
Fishtank Creative

Fishtank Creative 2 points

5 years ago

I am now added the following and its now working

<perch:productopts>
  <fieldset>
    <legend><perch:productopt id="title" /></legend>
    <perch:productvalues>
      <perch:before><ul></perch:before>
      <li>
        <label>
          <perch:input id="options" name="opt-<perch:productvalue id="optionID" />[]" 
            value="<perch:productvalue id="valueID" />" type="radio" required="required" />
          <perch:productvalue id="valueTitle" />
        </label>
      </li>
      <perch:after></ul></perch:after>
    </perch:productvalues>
  </fieldset>
</perch:productopts>
Drew McLellan

Drew McLellan 2638 points
Perch Support

5 years ago

Ok, great.
Fishtank Creative

Fishtank Creative 2 points

5 years ago

last week this was working,

But now all of a sudden it doesn't, when I try to add anything to the cart it brings up the message Your cart is empty..

This only started to happen when I did a dummy checkout to test the result page.

I have added perch_shop_empty_cart(); to try and totally empty the cart but that didn't work.

If I remove the product variants it will work.

On my product.html template I have added the following:

<perch:productopts>
<fieldset>
    <legend><perch:productopt id="title" /></legend>
    <perch:productvalues>
        <perch:before><ul></perch:before>
        <li>
            <label>
                <perch:input id="options" name="opt-<perch:productvalue id="optionID" />[]"
                    value="<perch:productvalue id="valueID" />" type="radio" required="required" />
                <perch:productvalue id="valueTitle" />
            </label>
        </li>
        <perch:after></ul></perch:after>
    </perch:productvalues>
</fieldset>
</perch:productopts>

If I change this to the select box option

<perch:if exists="has_variants">
    <perch:input id="product" type="select" options="<perch:shop id="_variant_opts" type="hidden" />" placeholder="Please choose" required="true" class="form-control" />
<perch:else />
    <perch:input id="product" type="hidden" value="<perch:shop id="productID" type="hidden" env-autofill="false" />" />
</perch:if>

it will work to a point where I can see the cart but the product variant isn't being displayed and the price hasn't updated.

This is my full product.html template

<perch:shop id="sku" type="text" label="SKU" required="true" order="1" />
<perch:shop id="title" type="text" label="Title" required="true" order="2" />
<perch:shop id="slug" type="slug" editable="true" indelible="true" label="Slug" for="title sku" order="10" divider-before="Meta data" />
<perch:shop id="description" type="textarea" label="Description" editor="markitup" order="3" markdown="true" size="s" />
<perch:shop id="image" type="image" label="Main product image" order="4" width="800" />
<perch:shop id="image" type="image" width="80" height="80" density="1.6" crop="true" />
<perch:shop id="status" type="shop_status" label="Status" />

<perch:shop id="brand" type="shop_brand" label="Brand" allowempty="true" />

<perch:categories id="category" set="products" label="Category">
    <perch:category id="catTitle" />
</perch:categories>

<perch:shop id="catalog_only" type="shop_catalog_only" label="Catalog only" />
<perch:shop id="price" type="shop_currency_value" label="Price" divider-before="Pricing" size="m" min="0" step="any" />
<perch:shop id="sale_price" type="shop_currency_value" label="Sale price" size="m" min="0" step="any" />
<perch:shop id="trade_price" type="shop_currency_value" label="Trade price" size="m" min="0" step="any" runway="true" />
<perch:shop id="on_sale" type="checkbox" value="1" label="Use sale price" />
<perch:shop id="tax_group" type="shop_tax_group" label="Tax group" required="true" />


<perch:shop id="stock_status" type="shop_stock_status" label="Stock status" divider-before="Stock" required="true" />
<perch:shop id="stock_level" type="number" label="Stock level" size="s" />
<perch:shop id="stock_location" type="shop_stock_location" label="Count stock" />
<perch:shop id="max_in_cart" type="number" label="Max quantity in cart" size="s" />

<perch:shop id="requires_shipping" type="shop_requires_shipping" label="Requires shipping" divider-before="Shipping" />
<perch:shop id="weight" type="number" label="Shipping weight" size="s" />
<perch:shop id="width" type="number" label="Width" size="s" />
<perch:shop id="height" type="number" label="Height" size="s" />
<perch:shop id="depth" type="number" label="Depth" size="s" />

<perch:form id="add_to_cart" app="perch_shop" action="/shop/cart">

<perch:productopts>
<fieldset>
    <legend><perch:productopt id="title" /></legend>
    <perch:productvalues>
        <perch:before><ul></perch:before>
        <li>
            <label>
                <perch:input id="options" name="opt-<perch:productvalue id="optionID" />[]"
                    value="<perch:productvalue id="valueID" />" type="radio" required="required" />
                <perch:productvalue id="valueTitle" />
            </label>
        </li>
        <perch:after></ul></perch:after>
    </perch:productvalues>
</fieldset>
</perch:productopts>


    <perch:input id="product" type="hidden" env-autofill="false" value="<perch:shop id="productID" type="hidden" env-autofill="false" />" />
    <perch:input type="submit" value="Add to cart" />
</perch:form>

Any ideas? I think its product variant related.

Thanks
Drew McLellan

Drew McLellan 2638 points
Perch Support

5 years ago

"All of a sudden" is always a red flag - something has changed. Either data, code or environment. What's different between when it was working and now?
Fishtank Creative

Fishtank Creative 2 points

5 years ago

The difference is, I actually completed a full checkout to test the success page.

But, I stripped everything back (basically started again) took the code from your demo site (Nest) instead of the code from the documentation and it works brilliantly, did the full checkout a few times.

This is my first shop build and literally copy and pasted the code from the docs. But from copying the code from the demo site works much better (IMO).