Auto-Fill and Hide Purchase Order Field

If your site is made for creating quotes, or similar functionality, where you don't want to require payment from your customers, you can pre-fill the Purchase Order field and hide it so your customers can check out without providing payment or a Purchase Order.

Note: An active FoxyCart subscription is required in order to access and use the Purchase Order option.

Go to your Payment Gateway Settings and turn on the option for Let customers pay with a Purchase Order

• In your Foxy administration, head to the checkout template page
• In the template, after the line

  {% embed 'checkout.inc.twig' %}

  paste the following snippet:

  {% block payment_method %}
      {% set purchase_order = "Quote" %}
          {{ parent() }}
  {% endblock %}

• You can customise the "Quote" string above to match whatever payment method type you're utilising here - for example that could be "Cash On Pickup" or "Bank Transfer" etc.
• Save the template

• Go to the “Configuration” page in the administration and look for the option labelled Add custom header and footer code to your templates. You may need to check the box to see the following custom header textarea.
• In the custom header textarea, paste the following snippet. If there's already code in the box, paste at the bottom of the code already present there:

  <style type="text/css">
  #fc #fc-payment-method-purchase-order .fc-form-group {
       display: none;
  }
  #fc #fc-payment-method-purchase-order .fc-input-group-container--active {
       padding-bottom: 0px;
  }
  #fc #fc-payment-method-purchase-order .fc-input-group-container__title {
       border-radius: 5px;
  }
  </style>

• Save the configuration.

If you then load up your checkout - you should see the purchase order method still displayed - but without the text input section below it when selected.

If you instead want to hide the purchase order option entirely, and not provide any text reference to customers for how they would be paying, then you can simply use this CSS block instead:

<style type="text/css">
#fc #fc-payment-method-purchase-order {
     display: none;
}
</style>

​You can change/remove the image and text for Purchase Order on the checkout by customizing the language strings.

• Go to the language templates customization in your FoxyCart admin.
• Click the show all details button. You'll see custom language fields.
• You can scroll until you see pay with purchase order or use your browser's find feature to locate it. Just change the text to what you desire. If you want to format it, you can use html formatting.
• You may also want to then edit the language string for purchase order. This language string is used on the web and email receipt, and will be the label before whatever value you entered in step 2 (“Quote” in the default example code).
• Scroll to the bottom of the page and click Update Language Customizations to save.

Depending on the type of custom payment option you're needing to allow, you may also need to provide some details for the customer on their receipt to complete their alternative payment method. This would be especially useful for Bank Transfer payment methods.

This step will add a little extra language after the default success message that appears at the top of the web and email receipts.

• Go to the Web Receipt section in the Foxy admin.
• Click the “Custom Template” radio input if it isn't already to show the template
• At the top of the template, paste in the following code:

  {% if purchase_order %}
  {% set custom_purchase_order_message = '<br><br><h4>Bank Transfer Details</h4><p><span style="text-decoration: underline;">BSB</span>: 123 456 | <span style="text-decoration: underline;">Account Number</span>: 9876 54321 | <span style="text-decoration: underline;">Bank</span>: My Bank</p>' %}
  {% set custom_lang = config.lang|merge({ "receipt_message_order": config.lang.receipt_message_order ~ custom_purchase_order_message }) %}
  {% set config = config|merge({"lang": custom_lang }) %}
  {% endif %}

• Edit the code as needed to provide your details, specifically the value set in the custom_purchase_order_message line above. The example code above is formatted for a Bank Transfer type option, but you can add any custom HTML you want.
• Save the updated template

Note: This approach relies on the HTML email template, activated by selecting Send Text and HTML E-mail.

• Go to the Email Receipt section in the Foxy admin.
• Click the “Custom Template” radio input if it isn't already to show the template
• At the top of the template, paste in the following code:

  {% if purchase_order %}
  {% set custom_purchase_order_message = '<br><h2 style="margin:0;padding:0;font-family:Verdana,Helvetica,Arial,sans-serif;color:#666666;font-weight:normal;font-size:18px;margin-bottom:10px">Bank Transfer Details</h2><p style="margin-top:0; margin-bottom:30px"><span style="text-decoration: underline;">BSB</span>: 123 456 | <span style="text-decoration: underline;">Account Number</span>: 9876 54321 | <span style="text-decoration: underline;">Bank</span>: My Bank</p>' %}
  {% set custom_lang = config.lang|merge({ "email_html_message_order": config.lang.email_html_message_order ~ custom_purchase_order_message }) %}
  {% set config = config|merge({"lang": custom_lang }) %}
  {% endif %}

• Edit the code as needed to provide your details, specifically the value set in the custom_purchase_order_message line above. The example code above is formatted for a Bank Transfer type option, but you can add any custom HTML you want.
• Save the updated template