<h1><spanclass="section-number">1. </span>Add a simple new web page<aclass="headerlink"href="#add-a-simple-new-web-page"title="Permalink to this headline">¶</a></h1>
<p>Evennia leverages <aclass="reference external"href="https://docs.djangoproject.com">Django</a> which is a web development framework.
<p>We assume you have installed and set up Evennia to run. A webserver and website comes along with the
default Evennia install out of the box. You can view the default website by pointing your web browser
to <codeclass="docutils literal notranslate"><spanclass="pre">http://localhost:4001</span></code>. You will see a generic welcome page with some game statistics and a link
to the Evennia web client.</p>
<p>In this tutorial, we will add a new page that you can visit at <codeclass="docutils literal notranslate"><spanclass="pre">http://localhost:4001/story</span></code>.</p>
in the web browser. Django can do all sorts of cool stuff to a page by using the view function — like
adding dynamic content or making changes to a page on the fly — but, here, we will just have it spit
back raw HTML.</p>
<p>Open <codeclass="docutils literal notranslate"><spanclass="pre">mygame/web/website</span></code> folder and create a new module file there named <codeclass="docutils literal notranslate"><spanclass="pre">story.py</span></code>. (You could also
put it in its own folder if you wanted to be neat but, if you do, don’t forget to add an empty
<codeclass="docutils literal notranslate"><spanclass="pre">__init__.py</span></code> file in the new folfder. Adding the <codeclass="docutils literal notranslate"><spanclass="pre">__init__.py</span></code> file tells Python that modules can be
imported from the new folder. For this tutorial, here’s what the example contents of your new <codeclass="docutils literal notranslate"><spanclass="pre">story.py</span></code>
module should look like:</p>
<divclass="highlight-python notranslate"><divclass="highlight"><pre><span></span><spanclass="c1"># in mygame/web/website/story.py</span>
<p>Next, we need to find the location where Evennia (and Django) looks for HTML files, which are referred
to as <em>templates</em> in Django’s parlance. You can specify such locations in your settings (see the
<codeclass="docutils literal notranslate"><spanclass="pre">TEMPLATES</span></code> variable in <codeclass="docutils literal notranslate"><spanclass="pre">default_settings.py</span></code> for more info) but, here we’ll use an existing one.</p>
<p>Navigate to <codeclass="docutils literal notranslate"><spanclass="pre">mygame/web/templates/website/</span></code> and create a new file there called <codeclass="docutils literal notranslate"><spanclass="pre">story.html</span></code>. This
is not an HTML tutorial, so this file’s content will be simple:</p>
<spanclass="p"><</span><spanclass="nt">h1</span><spanclass="p">></span>A story about a tree<spanclass="p"></</span><spanclass="nt">h1</span><spanclass="p">></span>
<spanclass="p"><</span><spanclass="nt">h1</span><spanclass="p">></span>A story about a tree<spanclass="p"></</span><spanclass="nt">h1</span><spanclass="p">></span>
<p>When you enter the address <codeclass="docutils literal notranslate"><spanclass="pre">http://localhost:4001/story</span></code> in your web browser, Django will parse the
stub following the port — here, <codeclass="docutils literal notranslate"><spanclass="pre">/story</span></code> — to find out to which page you would like displayed. How
does Django know what HTML file <codeclass="docutils literal notranslate"><spanclass="pre">/story</span></code> should link to? You inform Django about what address stub
patterns correspond to what files in the file <codeclass="docutils literal notranslate"><spanclass="pre">mygame/web/website/urls.py</span></code>. Open it in your editor now.</p>
<p>Django looks for the variable <codeclass="docutils literal notranslate"><spanclass="pre">urlpatterns</span></code> in this file. You will want to add your new <codeclass="docutils literal notranslate"><spanclass="pre">story</span></code> pattern
and corresponding path to <codeclass="docutils literal notranslate"><spanclass="pre">urlpatterns</span></code> list — which is then, in turn, merged with the default
<codeclass="docutils literal notranslate"><spanclass="pre">urlpatterns</span></code>. Here’s how it could look:</p>
<p>The above code imports our <codeclass="docutils literal notranslate"><spanclass="pre">story.py</span></code> Python view module from where we created it earlier — in
<codeclass="docutils literal notranslate"><spanclass="pre">mygame/web/website/</span></code> — and then add the corresponding <codeclass="docutils literal notranslate"><spanclass="pre">path</span></code> instance. The first argument to
<codeclass="docutils literal notranslate"><spanclass="pre">path</span></code> is the pattern of the URL that we want to find (<codeclass="docutils literal notranslate"><spanclass="pre">"story"</span></code>) as a regular expression, and
then the view function from <codeclass="docutils literal notranslate"><spanclass="pre">story.py</span></code> that we want to call.</p>
<p>That should be it. Reload Evennia — <codeclass="docutils literal notranslate"><spanclass="pre">evennia</span><spanclass="pre">reload</span></code> — and you should now be able to navigate
your browser to the <codeclass="docutils literal notranslate"><spanclass="pre">http://localhost:4001/story</span></code> location and view your new story page as
