Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Python Flask with SQLAlchemy Basics Creating a Basic Website with Flask Template Inheritance

Zinia Khondoker
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Zinia Khondoker
Python Development Techdegree Graduate 10,451 Points

Stuck on this block question

Check out layout.html. It has a block named 'link'. Inside of index.html, you need to create this link. Below the extend, add the syntax for block link. Inside of the block, create a link/anchor tag <a href=""></a>. The text inside of the link tags should be Contact.

index.html
{% extends 'layout.html' %}

{% block button %}
  <a href="{{ url_for('link') }}">Contact</a>
{% endblock %}
layout.html
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="description" content="Treehouse code chalenge practice.">
        <meta name="viewport" content="width=device-width, initial-scale=1">
    </head>
    <body>
        <h1>Practice Template Inheritance</h1>
        {% block link %}{% endblock %}
    </body>
</html>

1 Answer

Asher Orr
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Asher Orr
Python Development Techdegree Graduate 9,410 Points

Hi Zinia!

You should check out the Flask documentation on templates.

As you know, layout.html is a template.

The challenge asks for index.html to use the layout.html template. That's why you extended it at the top.

When you extend the layout.html file, you can override specific sections. That's what the block sections are for.

Here's an example:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="description" content="Treehouse code chalenge practice.">
        <meta name="viewport" content="width=device-width, initial-scale=1">
    </head>
    <body>
        <h1>Practice Template Inheritance</h1>
        {% block link %}{% endblock %}
       #if we extend the layout.html file to another file, we can specify what we want in this block/section.
    </body>
</html>

Instead of copying this over to index.html, you can simply extend the layout.html file and specify what goes inside the link block.

Like this:

{% extends 'layout.html' %}

{% block link %}
  link/anchor tag goes here.
{% endblock %}

I hope this helps. Let me know if you have questions!