You can use this snippet if you'd like to show your customers a message above the shipping rates.

Copy this code onto your computer's clipboard:

{% if context == "cart" or context == "checkout" %}
<script>
FC.client.on("render.done", function() {
    var message = '<p>REPLACE THIS WITH YOUR SHIPPING NOTICE.</p>';

    if ($(".shipping-note").length == 0 && FC.json.shipping_address.shipping_results.length > 0) {
        if (FC.json.context == "checkout") {
            $("div.fc-form-group.fc-shipping-rates").prepend('<div class="row shipping-note"><div class="col-sm-10 col-sm-push-1">' + message + '</div></div>');
        } else {
            $(".fc-shipping-rates").prepend('<div class="fc-input-group--sidebar shipping-note"><br>' + message + '</div>');
        }
    }
});
</script>
{% endif %}

• Go to your Templates configuration in your FoxyCart admin here.
• Scroll down until you see custom footer under Add custom header and footer code to your templates (this may need to be checked to get the custom footer input box to appear). You may see some code already in the text area. You can paste the code that you copied to your clipboard into the top of that box (take care not to remove anything that's already there).
• Change REPLACE THIS WITH YOUR SHIPPING NOTICE. to your desired message.
• Scroll down until you see the “Update” button and click to save.

Add a product to the cart and enter a shipping address to ensure that it works as expected. Also proceed to checkout to ensure that it works there as well.

You can change the style of the message by adding styles to your custom header on your 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:

<style>
#fc .shipping-note {
    background-color: lavender;
    border-color: pink;
}
</style>

To change the text, use:

#fc .shipping-note p {
    color: red;
}