{% extends sitewide.template %}
{% load static %}
{% block main %}
                    <h1>Sitewide is Working!</h1>
                    <p class="sw-p">
                        Congratulations! You have successfully installed
                        Sitewide. You are seeing this page because you do not
                        have any other app in your Django Project, or
                        other apps are not rendering pages yet. 
                        If the Sidebar, Header, and Footer are not visible,
                        don't despair. Follow <a 
                            href="https://sitewide-development.readthedocs.io/en/latest/tutorials.html">
                            these steps
                        </a> to achieve the desired behaviour for your project.
                    </p>
                    <p>
                        Thank you for trying Sitewide. We appreciate your
                        feedback.
                    </p><br>
                    <h3>Getting your Views to work with Sitewide</h3>
                    <ol>
                        <li>
                            So, You have done some models, views, urls, and now
                            you want the Views to render pages. Usually, you
                            would assign template paths in the views, then make
                            sure the template files actually exist in those
                            paths. Templates can be in an app's template
                            folder or in the project's template
                            folder. Start with a blank HTML template in your 
                            preferred path below. 
                            <h4 class="sw-h4">
                                Placing the template in your app:
                            </h4>
                            <code class="sw-code term">
                                project/app/templates/app/your_template.html 
                            </code>
                            <h4 class="sw-h4">Placing the template in the
                            your Django Project</h4>
                            <code class="sw-code term">
                                project/templates/your_template.html
                            </code>
                        </li>
                        <li>Copy the following HTML markup into the new template file:
                            <code class="sw-code block">
                                {% verbatim %}{% extends sitewide.template %}{% endverbatim %}<br>
                                {% verbatim %}{% load static %}{% endverbatim %}<br>
                                {% verbatim %}{% block main %}{% endverbatim %}<br>
                                 <em>{% verbatim %}&lt;-- Add your HTML here --!>{% endverbatim %}</em><br>
                                {% verbatim %}{% endblock %}{% endverbatim %}<br>
                            </code>
                        </li>
                        <li>
                            Add custom markups for the page within the <code>{% verbatim %}
                            {% main %}{% endverbatim %}</code> block tags, replacing the 
                            comment with your HTML. <b>Save the template</b>.
                        </li>
                        <li>
                            Doublecheck that the relevant view is pointing to
                            you new template. Open your favourite development
                            Browser and visit the url associated with the view.
                        </li>
                        <li>
                            If you followed the <a href="#">setup guide</a>
                            (hinted above), you should be seeing a rendition of
                            your page (on the browser), all nicely flanked by a 
                            Header, footer and Sidebar (according to your wishes).  
                            Bliss! You can now focus on making more contents.
                            Sitewide will add the rest.
                        </li>
                    </ol>
                    <h3 class="sw-h3">Wait, there's more ...</h3>
                    <p class="sw-p">
                        What if you want to change the color theme or perhaps
                        you would like to adjust margins. Do you want to know how? 
                        See you at the 'Docs'.
                    </p>
                    <p>
                        <b>What are you waiting for?</b>
                    </p>{% endblock %}