0
0
Djangoframework~20 mins

Template inheritance with base template in Django - Practice Problems & Coding Challenges

Choose your learning style9 modes available
Challenge - 5 Problems
🎖️
Template Inheritance Master
Get all challenges correct to earn this badge!
Test your skills under time pressure!
component_behavior
intermediate
2:00remaining
What will this Django template render?
Given the base template and child template below, what will be the rendered output when the child template is used?
Django
{% raw %}
<!-- base.html -->
<html>
  <head><title>{% block title %}Base Title{% endblock %}</title></head>
  <body>
    <header>Header Content</header>
    <main>{% block content %}Base Content{% endblock %}</main>
    <footer>Footer Content</footer>
  </body>
</html>

<!-- child.html -->
{% extends "base.html" %}
{% block title %}Child Title{% endblock %}
{% block content %}Child Content{% endblock %}
{% endraw %}
A
&lt;html&gt;
  &lt;head&gt;&lt;title&gt;Base Title&lt;/title&gt;&lt;/head&gt;
  &lt;body&gt;
    &lt;header&gt;Header Content&lt;/header&gt;
    &lt;main&gt;Base Content&lt;/main&gt;
    &lt;footer&gt;Footer Content&lt;/footer&gt;
  &lt;/body&gt;
&lt;/html&gt;
B
&lt;html&gt;
  &lt;head&gt;&lt;title&gt;Child Title&lt;/title&gt;&lt;/head&gt;
  &lt;body&gt;
    &lt;header&gt;Child Content&lt;/header&gt;
    &lt;main&gt;Child Content&lt;/main&gt;
    &lt;footer&gt;Footer Content&lt;/footer&gt;
  &lt;/body&gt;
&lt;/html&gt;
C
&lt;html&gt;
  &lt;head&gt;&lt;title&gt;Child Title&lt;/title&gt;&lt;/head&gt;
  &lt;body&gt;
    &lt;header&gt;Header Content&lt;/header&gt;
    &lt;main&gt;Child Content&lt;/main&gt;
    &lt;footer&gt;Footer Content&lt;/footer&gt;
  &lt;/body&gt;
&lt;/html&gt;
D
&lt;html&gt;
  &lt;head&gt;&lt;title&gt;Base Title&lt;/title&gt;&lt;/head&gt;
  &lt;body&gt;
    &lt;header&gt;Child Content&lt;/header&gt;
    &lt;main&gt;Base Content&lt;/main&gt;
    &lt;footer&gt;Footer Content&lt;/footer&gt;
  &lt;/body&gt;
&lt;/html&gt;
Attempts:
2 left
💡 Hint
Remember that {% block %} tags in the child template replace the corresponding blocks in the base template.
📝 Syntax
intermediate
2:00remaining
Identify the syntax error in this Django template inheritance code
Which option contains a syntax error that will cause Django template rendering to fail?
Django
{% raw %}
<!-- base.html -->
<html>
  <head><title>{% block title %}Base Title{% endblock %}</title></head>
  <body>
    {% block content %}Base Content{% endblock %}
  </body>
</html>

<!-- child.html -->
{% extends "base.html" %}
{% block title %}Child Title{% endblock %}
{% block content %}Child Content
{% endblock %}
{% endraw %}
A
{% extends "base.html" %}
{% block title %}Child Title{% endblock %}
{% block content %}Child Content{% endblock %}
B
{% extends "base.html" %}
{% block title %}Child Title{% endblock %}
{% block content %}Child Content
C
{% extends "base.html" %}
{% block title %}Child Title
{% endblock %}
{% block content %}Child Content{% endblock %}
D
}% kcolbdne %{tnetnoC dlihC}% tnetnoc kcolb %{
}% kcolbdne %{eltiT dlihC}% eltit kcolb %{
}% "lmth.esab" sdnetxe %{
Attempts:
2 left
💡 Hint
Check if all block tags are properly closed.
state_output
advanced
2:00remaining
What is the output of this nested block override?
Consider these templates. What will be the output inside the
tag when rendering 'grandchild.html'?
Django
{% raw %}
<!-- base.html -->
<html>
  <body>
    <main>{% block main_content %}Base Main{% endblock %}</main>
  </body>
</html>

<!-- child.html -->
{% extends "base.html" %}
{% block main_content %}Child Main{% endblock %}

<!-- grandchild.html -->
{% extends "child.html" %}
{% block main_content %}Grandchild Main{% endblock %}
{% endraw %}
A<main>Grandchild Main</main>
B<main>Base Main</main>
C<main>Child Main</main>
D<main>Child MainGrandchild Main</main>
Attempts:
2 left
💡 Hint
The most specific child template's block content replaces the parent's block content.
🔧 Debug
advanced
2:00remaining
Why does this template raise a TemplateSyntaxError?
This child template extends 'base.html' but raises a TemplateSyntaxError. What is the cause?
Django
{% raw %}
{% extends "base.html" %}
{% block title %}Child Title
{% block content %}Child Content{% endblock %}
{% endblock %}
{% endraw %}
AThe base template is missing the 'content' block definition.
BThe 'extends' tag must be the last tag in the template.
CThe 'content' block cannot be nested inside the 'title' block.
DThe 'title' block is not properly closed before starting the 'content' block.
Attempts:
2 left
💡 Hint
Check the order and closure of block tags.
🧠 Conceptual
expert
3:00remaining
How does Django resolve blocks in multiple inheritance?
Given three templates: base.html, intermediate.html (extends base), and final.html (extends intermediate). If all define a block named 'sidebar', which block content will Django render when rendering final.html?
AThe 'sidebar' block from final.html because it overrides all parent blocks.
BThe 'sidebar' block from intermediate.html because it is the immediate parent of final.html.
CThe 'sidebar' block from base.html because it is the original definition.
DA concatenation of all 'sidebar' blocks from base.html, intermediate.html, and final.html.
Attempts:
2 left
💡 Hint
Think about which template is the most specific child in the inheritance chain.