Order Page Template

Modified on Mon, 7 Oct at 5:57 PM

Order Page Template

What the customer sees once they click the link to the order page to retrieve their files. 


<!DOCTYPE html>
<html lang="en">


<head>
    <title>{{ company.name }} &mdash; Downloads for Order {{ order.number }}</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <meta name="viewport" content="width=device-width">
    <!--[if lte IE 8]>
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
    <![endif]-->


    <!-- BOOTSTRAP -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head>
<body class="bg-dark">
    <!-- START SIMPLE -->
    <div class="container">
        <div class="row">
            <div class="col-lg-6 col-md-8 offset-md-2 offset-lg-3 my-3">
                <h1 class="text-light h5">{{ company.name }}</h1>
                <h2 class="text-light h6">Downloads for Order {{ order.number }}</h2> 
                <div class="alert alert-secondary">
                    <small>
                        <b>
                            Trouble downloading?
                        </b>
                        <br>
                        <span>
                            Right click the link(s) below and 'Save File As...' or 'Save Target As...' or try a different browser like Firefox, Chrome, or Safari.
                        </span>
                    </small>
                </div>           
                {% if company.uses_dropbox %}
                    <div class="my-2">
                        {{ order.dropbox_script }}
                    </div>
                {% endif %}
                {% for product in order.products %}
                    <div class="card mb-3">
                        <div class="card-body">
                            <span  class="product__title">
                                <b>{{ product.name }}</b>
                            </span>
                            <br>
                            <span class="product__key">
                                {{ product.license_key }}
                            </span>        
                        </div>
                        {% if product.files.size > 0 %}
                            <ul class="list-group list-group-flush">
                            {% assign files = product.files | sort %}
                            {% for file in files %}
                                <li class="justify-content-between list-group-item align-items-center">
                                    <span class="mr-1">
                                        <span>
                                            {{ file.filename }} 
                                        </span>
                                        {% if file.filesize %}
                                        <small class="text-secondary">
                                            {% assign filesize = file.filesize | times: 1.0 %}
                                            ({{ filesize | divided_by: 1024.0 | divided_by: 1024.0 | round: 2 }}MB)
                                        </small>
                                        {% endif %}
                                    </span>
                                    <br>
                                    <a href="{{ file.link }}" class="btn btn-sm btn-primary mt-2">
                                        Download
                                    </a>
                                </li>
                            {% endfor %}  
                            </ul>
                        {% endif %}                                     
                    </div>
                {% endfor %}
                <div class="card mt-3">
                    <div class="card-body">
                        <strong>
                            Trouble Downloading?
                        </strong>
                        <br>
                        <small>
                            Right click on the above link (s) and 'Save File As ...' or 'Save Target As ...' or try another browser like Firefox, Chrome, or Safari.
                        </small>
                    </div>
                </div>                
            </div>
        </div>
    </div>
</body>
</html>


Legacy Fetchapp style:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">


<head>
    <title>{{ company.name }} &mdash; Downloads for Order {{ order.number }}</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <!--[if lte IE 8]>
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/><![endif]-->
    <meta name="copyright" content="Fetchapp LLC"/>
    <link href="/stylesheets/admin-source.css" media="screen" rel="stylesheet" type="text/css"/>
    <!--[if lte IE 8]>
    <link href="/stylesheets/ie-source.css" media="screen" rel="stylesheet" type="text/css"/><![endif]-->
    <noscript>
        <link href="/stylesheets/noscript-source.css" media="screen" rel="stylesheet" type="text/css"/>
    </noscript>
    <link href="/stylesheets/print-source.css" media="print" rel="stylesheet" type="text/css"/>
</head>
<body>
<!-- START SIMPLE -->
<div id="simple">
    <div id="container">
        <!-- START BOX -->
        <div id="box">
            <div id="bg">
                <h5>{{ company.name }}</h5>
                <h6>Downloads for Order {{ order.number }}</h6>
  {% if company.uses_dropbox %}<div style="padding-top: 10px; padding-bottom: 20px;">{{ order.dropbox_script }}</div>{% endif %}


                <ul id="order">
                {% for product in order.products %}
                    <li>
                        <p>{{ product.name }}</p>
                        <ul>
                {% if product.license_key %}<li>License Key: {{ product.license_key }}</li>{% endif %}
                            {% for file in product.files %}
                            <li>
                                <a href="{{ file.link }}">{{ file.filename }}</a>{% if file.filesize %} <span>({{ file.filesize}})</span>{% endif %}
                                {% endif %}
                            </li>
                             {% endfor %}
                        </ul>
                    </li>
                 {% endfor %}
                </ul>
                <h6><br/><strong>Trouble downloading?</strong> <br/>Right click the link(s) above and 'Save File As...' or 'Save Target As...' or try a different browser like Firefox, Chrome, or Safari.</h6>
            </div>
        </div>
        <!-- END BOX -->
    </div>
</div>
<!-- END SIMPLE -->
<script src="/javascripts/jquery-1-3-1.js" type="text/javascript"></script>
<script src="/javascripts/jquery-ui-1-8-11.js" type="text/javascript"></script>
</body>
</html>


Note that unchecking/unpublishing will revert to the 2.0 default template and checking/publishing it will override the 2.0 default template.



Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select at least one of the reasons
CAPTCHA verification is required.

Feedback sent

We appreciate your effort and will try to fix the article