title: How can I use base.html like a regular template, and render to it
body: <p>I have my navbar css in my base.html, and then use {% extend base.html %} to add it into my regular template. However, I want to have a login/register option in my navbar (which is in my base.html), and I want to use cookies to decide whether to put login or register in the navbar. How can I have base.html be able to request cookies, when it doesn't have a view? Also, not every webpage on my site has a view, some are a plain html with {% extend base.html %}</p>
  <p>my base.html:</p>
  <pre><code>&lt;!-- Global site tag (gtag.js) - Google Analytics --&gt;
  &lt;script async src=&quot;https://www.googletagmanager.com/gtag/js?id=UA-175481126-1&quot;&gt;&lt;/script&gt;
  &lt;script&gt;
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());
  
    gtag('config', 'UA-175481126-1');
  &lt;/script&gt;
  
  &lt;style&gt;
  ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  font-family: Tahoma, Geneva, sans-serif;
  background-color: #333;
  }
  li {
  float: left;
  border-right: 1px solid #bbb;
  }
  li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  }
  /* Change the link color to #111 (black) on hover */
   li a:hover {
     background-color: #111;
     color: white;
     text-decoration:none;
   }
  
  /* for buttons*/
  .paging {
  background-color: #333;
  border: none;
  color: white;
  padding: 8px 14px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  font-family: Tahoma, Geneva, sans-serif;
  }
  button:hover {
  background-color: #111;
  }
  
  .register {
    float: right;
  }
  
  .paging {
    background-color: #333;
    border: none;
    color: white;
    padding: 8px 14px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    font-family: Tahoma, Geneva, sans-serif;
  }
  button:hover {
    background-color: #111;
  }
  
  /* title */
  
  .title {
    color: black;
    padding: 10px;
    text-align: center;
    font-size: 40px;
    font-family: Tahoma, Geneva, sans-serif;
    Color: black;
    text-decoration: none;
  }
  
  /* descriptions */
  
  .description {
    color: black;
    padding: 15px;
    font-family: Tahoma, Geneva, sans-serif;
    text-align: left;
    font-size: 13px;
  }
  
  /* embedd url */
  .iframe-container{
    position: relative;
    width: 100%;
    padding-bottom: 56.25%; 
    height: 0;
      margin-left: auto;   /* Automatic margin from left */ 
      margin-right: auto; /* Automatic margin from right */
  }
  .iframe-container iframe{
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  
  /* make columns */
  
  * {
      box-sizing: border-box;
  }
  
  .row {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      flex: 0 0 100%;
      max-width: 100%;
      /* you can just remove these margins all together. Just wanted to emphasize that there should be no margin left or right, to avoid overflow */
      margin-left: 0px;
      margin-right: 0px;
  }
  
  .videos, .ads {
      flex-grow: 0; flex-shrink: 0;
  }
  
  .ads {
      display: block;
      float: right;
      background-color: #c1c4c9;
      width: 25%;
  }
  
  .videos {
      display: block;
      float: left;
      width: 75%;
      padding-right: 10%;
      padding-left: 10%;
  }
  
  .image {
    padding-right: 5%;
    padding-left: 5%;
    padding-top: 5%;
    padding-bottom: 5%;
  }
  
  .logo {
      flex-direction:; row;
      flex:; 0 0 100%;
      max-width 100%;
      justify-content:; center;
  }
  
  .banner {
  /*  float: left;*/
    width: 100%;
    height: 5%;
    background-color: red;
    color: white;
    text-align: center;
  }
  
  img {
      max-width: 100%;
      max-height: 100%;
  }
  
  /* header */
  .header {
    background-color: #F1F1F1;
    text-align: center;
    padding: 20px;
    font-family: Tahoma, Geneva, sans-serif;
  }
  &lt;/style&gt;
  
  &lt;html&gt;
  
  {% load static %}
  
  &lt;link rel=&quot;shortcut icon&quot; type=&quot;image/png&quot; href=&quot;{% static 'images/favicon.ico' %}&quot;/&gt;
  
  &lt;div class=&quot;logo&quot;&gt;
  &lt;div class=&quot;header&quot;&gt;
    &lt;a href=&quot;/&quot;&gt;
    &lt;img src=&quot;https://i.ibb.co/5Rqps7F/logo-black.png&quot; alt=&quot;Computer Man&quot;&gt;
  &lt;/a&gt;
  &lt;/div&gt;
  
  &lt;ul&gt;
    &lt;li class=&quot;all&quot;&gt;&lt;a href=&quot;/&quot;&gt;All videos&lt;/a&gt;&lt;/li&gt;
    &lt;li class=&quot;stam&quot;&gt;&lt;a href=&quot;/stam&quot;&gt;Stam videos&lt;/a&gt;&lt;/li&gt;
    &lt;li class=&quot;music&quot;&gt;&lt;a href=&quot;/music&quot;&gt;Music videos&lt;/a&gt;&lt;/li&gt;
    &lt;li class=&quot;news&quot;&gt;&lt;a href=&quot;/news&quot;&gt;News videos&lt;/a&gt;&lt;/li&gt;
    &lt;li class=&quot;contact&quot;&gt;&lt;a href=&quot;/contact&quot;&gt;Contact&lt;/a&gt;&lt;/li&gt;
    &lt;li class=&quot;register&quot;&gt;&lt;a href=&quot;/register&quot;&gt;Login/Register&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;div class=&quot;banner&quot;&gt;
      &lt;text align=&quot;center&quot;&gt;We are still developing our site, so we may not be able to update videos as often as we want&lt;/text&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;link rel=&quot;stylesheet&quot; href=&quot;https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css&quot; integrity=&quot;sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm&quot; crossorigin=&quot;anonymous&quot;&gt;
  
  &lt;script src=&quot;https://code.jquery.com/jquery-3.2.1.slim.min.js&quot; integrity=&quot;sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN&quot; crossorigin=&quot;anonymous&quot;&gt;&lt;/script&gt;
  &lt;script src=&quot;https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js&quot; integrity=&quot;sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q&quot; crossorigin=&quot;anonymous&quot;&gt;&lt;/script&gt;
  &lt;script src=&quot;https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js&quot; integrity=&quot;sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl&quot; crossorigin=&quot;anonymous&quot;&gt;&lt;/script&gt;
  </code></pre>