Twitter Bootstrap Question posted in

Flask is rendering the head of my html document twice – Twitter bootstrap

I’m having trouble trying to get Flask (along with Flask-Bootstrap) to only produce one head element to my HTML document. The problem I’m having right now is that the head element is correct, but Flask is dropping it into the beginning of the body as well.

/personal_website/app/templates/index.html:

{% extends "bootstrap/base.html" %}
#! I have not changed bootstrap/base.html

{% block head %}
  {{super()}}
  {% block title %}My_Name | Home{% endblock title %}
  {% block styles %}
    {{super()}}
    <link href="{{url_for('static',filename='stylesheets/style.css')}}"
          rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Roboto"
          rel="stylesheet">
  {% endblock styles %}
{% endblock head %}

Console output:

  <head>

    <title>My_Name | Home</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- Bootstrap -->
    <link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
    <link href="/static/stylesheets/style.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">

  </head>
  <body>
    My_Name | Home


    <!-- Bootstrap -->
    <link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
    <link href="/static/stylesheets/style.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    I actually was able to correct this by taking the contents of what was in the header (ex: Title and Styles) out of the block head.

    /personal_website/app/templates/index.html:

    {% extends "bootstrap/base.html" %}

{% block title %}My_Name | Home{% endblock %}

{% block styles %}
  {{super()}}
  <link href="{{url_for('static',filename='stylesheets/style.css')}}"
        rel="stylesheet">
{% endblock styles %}

{% block head %}
  {{ super() }}
{% endblock %}

    This still alowed me to inherit the contents of the head from bootstrap/base.html


  2. 0

    I think you just need to remove this line (probably both times):

    {{super()}}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search