====== Add a Message Above the Email Field ======

You can use this snippet if you'd like to show your customers a message at the top of the checkout page.

===== Step 1: Get the Snippet =====
Copy this code onto your computer's clipboard: 
<code>
{% block login_register %}
<div class="fc-messages">
    <div class="fc-alert fc-alert--info custom-message">
        <ul><li>Your custom message here.</li></ul>
    </div>
</div>
{{ parent() }}
{% endblock %}
</code>

===== Step 2: Modify the Checkout Template =====
  * Go to your checkout template in your FoxyCart admin [[https://admin.foxycart.com/admin.php?ThisAction=EditTemplate&template=checkout|here]].
  * If you don't see a textarea called "checkout template:", on the setting labeled "or, use a default template:", select the "Custom Template" option to make the textarea box appear.
  * Scroll down in the "checkout template:" box until you see ''{% embed 'checkout.inc.twig' %}''. On the next line, paste the code that you copied in Step 1 above. The line following what you pasted should be ''{% endembed %}'' .
  * Change the "Your custom message here." text in the code to be what you'd like to see on the checkout. 
  * Scroll down until you see the "Update Template" button and click to save.

===== Step 3: Test =====
Add a product to the cart and go to the checkout to ensure that it works as expected.

===== Optional Styling =====
You can change the style of the message by adding styles to your custom header on your [[https://admin.foxycart.com/admin.php?ThisAction=TemplateConfig|configuration settings]]. You may need to click "Add custom header and footer code to your templates" to get the "custom header:" text area.

You can put the styles in between ''<style>'' tags. Example:

**To change the box styling, use:**
<code>
<style>
#fc .fc-messages .custom-message{
    background-color: lavender;
    border-color: pink;
}
</style>
</code>

**To change the text, use:**
<code>
#fc .fc-messages .custom-message ul li {
    color: red;
}
</code>