Django template Syntax Error Invalid block tag-CodePudding

Iam New To Django : i Made a Simple Website Following Python Crash Course Book , iam getting this Error and i can't find The Problem , Here is the error:

Here is the login.html :

{% extends "learning_logs/base.html" %} {% load bootstrap4 %} {% block
page_header %}
<h2>Log in to your account</h2>
{% endblock page_header %} {% block content %}
<form method="post" action="{% url 'users:login' %}" >
{% csrf_token %} {% bootstrap_form form %} {% buttons %}
<button name="submit" >Log in</button>
{% endbuttons %}
<button name="submit">Log in</button>
<input type="hidden" name="next" value="{% url 'learning_logs:index' %}" />
</form>
{% endblock content %}

And here is base.html that login extends:

{% load bootstrap4 %}
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Learning Log</title>
    {% bootstrap_css %} {% bootstrap_javascript jquery='full' %}
  </head>

  <body>
    <nav >
      <a  tag="a" href="{% url 'learning_logs:index' %}">
        Learning Log</a
      >
      <button
        
        type="button"
        data-toggle="collapse"
        data-target="#navbarCollapse"
        aria-controls="navbarCollapse"
        aria-expanded="false"
        aria-label="Toggle navigation"
      >
        <span ></span>
      </button>
      <div  id="navbarCollapse">
        <ul >
          <li >
            <a  href="{% url 'learning_logs:topics' %}"
              >Topics</a
            >
          </li>
        </ul>
        <ul >
          {% if user.is_authenticated %}
          <li >
            <span >Hello,{{user.username}}</span>
          </li>
          <li >
            <a  href="{% url 'users:logout' %}">Log out</a>
          </li>
          {% else %}
          <li >
            <a  href="{% url 'users:register'%}">Register</a>
          </li>
          <li >
            <a  href="{% url 'users:login'%}">Log in</a>
          </li>
          {% endif %}
        </ul>
      </div>
    </nav>
    <main role="main" >
      <div >
        {% block page_header %} {% endblock page_header %}
      </div>
      <div>{% block content %} {% endblock content %}</div>
    </main>
  </body>
</html>

i tried looking for any syntax writing like answered questions here did like leaving epty space between { and % but i couldn't find anything helpful ,

CodePudding user response：

Try to remove the line break in the end of line 1.

I mean, you should replace

{% extends "learning_logs/base.html "%} {% load bootstrap4 %} {% block
page_header %}

with

{% extends "learning_logs/base.html "%} {% load bootstrap4 %} {% block page_header %}

CodePudding user response：

Replace

{% endblock page_header %}

{% endblock %}

And apply this to your other end blocks

CodePudding user response：

it was a Problem with Preetier Code Formatter Every time i save the could would Go wrong , So i Changed To Default Html Formatter, Hope this helps Someone in the Future as it's quite hidden