CINXE.COM

<!DOCTYPE html><html lang="en" itemscope itemtype="http://schema.org/Article"><head><script>window.yaContextCb=window.yaContextCb||[]</script><script src="https://yandex.ru/ads/system/context.js" async></script><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="apple-touch-icon-precomposed" sizes="57x57" href="/static/images/favicons/apple-touch-icon-57x57.png" /><link rel="apple-touch-icon-precomposed" sizes="72x72" href="/static/images/favicons/apple-touch-icon-72x72.png" /><link rel="apple-touch-icon-precomposed" sizes="114x114" href="/static/images/favicons/apple-touch-icon-114x114.png" /><link rel="apple-touch-icon-precomposed" sizes="120x120" href="/static/images/favicons/apple-touch-icon-120x120.png" /><link rel="apple-touch-icon-precomposed" sizes="144x144" href="/static/images/favicons/apple-touch-icon-144x144.png" /><link rel="apple-touch-icon-precomposed" sizes="152x152" href="/static/images/favicons/apple-touch-icon-152x152.png" /><link title="EVILEG - Social network of programmers" rel="alternate" type="application/rss+xml" href="/en/feed/" /><link title="EVILEG - Forum" rel="alternate" type="application/rss+xml" href="/en/forum/feed/" /><title>Django - Lesson 062. How to write a block-template tabbar tag like the blocktranslate tag</title><meta property="og:title" content="Django - Lesson 062. How to write a block-template tabbar tag like the blocktranslate tag" /><meta property="og:type" content="website" /><meta property="og:url" content="https://evileg.com/en/post/709/" /><meta property="og:image" content="https://evileg.com/static/images/favicons/favicon.ico" /><meta property="og:site_name" content="EVILEG" /><meta name="google-site-verification" content="vVTpO8SvQTo0QU2hU-zDTBHgHzqr2CGx7ACdQHPlLes" /><meta name="yandex-verification" content="c58ddaad8c500539" /><meta name="wot-verification" content="5e851b19f7a76433f3dc"/><meta name="description" content="Django - Lesson 062. How to write a block-template tabbar tag like the blocktranslate tag. In this article, I'll show you exactly how you can write a simple block template tag, like the blocktranslate tag in Django . These block template tags have an opening"/><link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous"><link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" rel="stylesheet" ><link href="/static/css/custom.css?9" rel="stylesheet"><script src="/static/js/jquery-3.3.1.min.js"></script><script src="https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script><script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js" integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r" crossorigin="anonymous"></script><script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script><script src="/static/js/global.js?27"></script><script type="application/ld+json">{"@context": "http://schema.org", "@type": "ItemList", "itemListElement": [{"@type": "SiteNavigationElement", "position": 1, "name": "EVILEG", "url": "/en/"}, {"@type": "SiteNavigationElement", "position": 2, "name": "Articles", "url": "/en/knowledge/"}, {"@type": "SiteNavigationElement", "position": 3, "name": "Forum", "url": "/en/forum/"}, {"@type": "SiteNavigationElement", "position": 4, "name": "Tests", "url": "/en/tests/"}, {"@type": "SiteNavigationElement", "position": 5, "name": "Share code", "url": "/en/sharecode/"}, {"@type": "SiteNavigationElement", "position": 6, "name": "Share code", "url": "/en/sharecode/create/"}, {"@type": "SiteNavigationElement", "position": 7, "name": "Write article", "url": "/en/knowledge/article/add/"}, {"@type": "SiteNavigationElement", "position": 8, "name": "Ask a question", "url": "/en/forum/create_topic/"}]}</script></head><body class="bg-light"><nav class="navbar navbar-expand-lg navbar-dark fixed-top bg-dark"><div class="container-xxl"><button class="navbar-toggler collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#mainNavbar" aria-controls="mainNavbar" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button><a class="navbar-brand ms-3 ms-lg-0" href="/en/">EVILEG</a><button class="btn btn-outline-secondary ms-auto d-block d-lg-none" type="button" data-bs-toggle="modal" data-bs-target="#menuModal" aria-controls="menuModal" title="Menu"><span class="bi bi-grid-3x3-gap-fill"></span></button><a class="btn btn-outline-secondary ms-2 d-block d-lg-none" href="/en/accounts/login/" title="Login"> Login </a><div class="navbar-collapse collapse" id="mainNavbar"><form role="search" action="/en/search/" method="get" class="mt-3 mt-lg-0"><input id="search" name="search" type="search" class="form-control" placeholder="Search..." title="Search"></form><ul class="navbar-nav ms-2 mb-2 mb-lg-0"><li class="nav-item"><a class="nav-link" href="/en/knowledge/">Articles</a></li><li class="nav-item"><a class="nav-link" href="/en/forum/">Forum</a></li><li class="nav-item"><a class="nav-link" href="/en/tests/">Tests</a></li><li class="nav-item"><a class="nav-link" href="/en/sharecode/">Share code</a></li><li class="nav-item dropdown"><a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" aria-expanded="false">EN</a><ul class="dropdown-menu"><a class="dropdown-item" href="/lang/ru/">Русский</a><a class="dropdown-item" href="/lang/uk/">Українська</a><a class="dropdown-item" href="/lang/en/">English</a><a class="dropdown-item" href="/lang/kk/">Қазақ</a><a class="dropdown-item" href="/lang/de/">Deutsch</a></ul></li></ul></div><button class="btn btn-outline-secondary ms-2 d-none d-lg-block" type="button" data-bs-toggle="modal" data-bs-target="#menuModal" aria-controls="menuModal" title="Menu"><span class="bi bi-grid-3x3-gap-fill"></span></button><a class="btn btn-outline-secondary ms-2 d-none d-lg-block" href="/en/accounts/login/" title="Login"> Login </a></div></nav><main class="container-xxl"><div class="row"><div class="col-12 col-lg overflow-hidden"><ul class="breadcrumb bg-light"><li class="breadcrumb-item"><a href="/en/"><i class="bi bi-house"><span class="d-none">EVILEG</span></i></a></li><li class="breadcrumb-item"><a href="/en/knowledge/">Articles</a></li><li class="breadcrumb-item"><a href="/en/knowledge/django/">Django</a></li><li class="breadcrumb-item active">Django - Lesson 062. How to write a block-template tabbar tag like the blocktranslate tag</li></ul><script type="application/ld+json">{"@context": "http://schema.org", "@type": "BreadcrumbList", "itemListElement": [{"@type": "ListItem", "position": 1, "item": {"@type": "Thing", "@id": "/en/", "name": "EVILEG"}}, {"@type": "ListItem", "position": 2, "item": {"@type": "Thing", "@id": "/en/knowledge/", "name": "Articles"}}, {"@type": "ListItem", "position": 3, "item": {"@type": "Thing", "@id": "/en/knowledge/django/", "name": "Django"}}, {"@type": "ListItem", "position": 4, "item": {"@type": "Thing", "@id": "/en/post/709/", "name": "Django - Lesson 062. How to write a block-template tabbar tag like the blocktranslate tag"}}]}</script><div ><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8160668332851230" crossorigin="anonymous"></script><ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-8160668332851230" data-ad-slot="6001381692" data-ad-format="auto" data-full-width-responsive="true"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><article><div itemprop="publisher" itemscope itemtype="https://schema.org/Organization"><div itemprop="logo" itemscope itemtype="https://schema.org/ImageObject"><link itemprop="image" href="/static/images/favicons/apple-touch-icon-152x152.png"><link itemprop="url" href="/static/images/favicons/apple-touch-icon-152x152.png"><meta itemprop="width" content="152"><meta itemprop="height" content="152"></div><meta itemprop="name" content="EVILEG"><meta itemprop="address" content="EVILEG"><meta itemprop="telephone" content="-"><link itemprop="url" href="https://evileg.com"></div><link itemprop="mainEntityOfPage" itemscope href="/en/post/709/" /><meta itemprop="commentCount" content="3"><meta itemprop="articleSection" content="Django"><div itemscope itemprop="author" itemtype="https://schema.org/Person"><meta itemprop="name" content="Evgenii Legotckoi"><link itemprop="url" content="/en/users/2/"></div><meta itemprop="url" content="/en/post/709/"><meta itemprop="accessMode" content="textual"><meta itemprop="wordCount" content="989"><meta itemprop="datePublished" content="March 21, 2023, 4:17 a.m."><meta itemprop="dateModified" content="May 17, 2023, 1:20 p.m."><div itemprop="interactionStatistic" itemscope itemtype="https://schema.org/InteractionCounter"><meta itemprop="interactionType" content="https://schema.org/BookmarkAction"><meta itemprop="userInteractionCount" content="0"></div><div itemprop="interactionStatistic" itemscope itemtype="https://schema.org/InteractionCounter"><meta itemprop="interactionType" content="https://schema.org/LikeAction"><meta itemprop="userInteractionCount" content="2"></div><div itemprop="interactionStatistic" itemscope itemtype="https://schema.org/InteractionCounter"><meta itemprop="interactionType" content="https://schema.org/DislikeAction"><meta itemprop="userInteractionCount" content="0"></div><meta itemprop="keywords" content="tag,templatetags,Django,Django 3,Django 4,template"><div class="card mb-3"><div class="card-header d-flex py-2"><a href=/en/users/2/><img loading="lazy" alt="Evgenii Legotckoi" class="bg-secondary bg-opacity-10 rounded avatar-initials avatar-48" src="/media/cache/7a/08/7a0837c6eb199ca9af1a03ea5ccbfcbf.webp"></a><div class="ms-3"><div><a href="/en/users/2/" class="text-decoration-none">Evgenii Legotckoi</a></div><small class="text-secondary">March 21, 2023, 4:17 a.m.</small></div></div><div class="card-body"><h1 itemprop="headline">Django - Lesson 062. How to write a block-template tabbar tag like the blocktranslate tag</h1><div><p><a href="/en/search/?search=%23tag">tag</a>, <a href="/en/search/?search=%23templatetags">templatetags</a>, <a href="/en/search/?search=%23Django">Django</a>, <a href="/en/search/?search=%23Django%203">Django 3</a>, <a href="/en/search/?search=%23Django%204">Django 4</a>, <a href="/en/search/?search=%23template">template</a></p></div><div itemprop="articleBody"><div class="card border mb-3"><div class="card-header">Content</div><div class="card-body"><ol class="list-unstyled mb-0"><li><span>1. </span><span><a href="#header_Application_structure">Application structure</a></span></li><li><span>2. </span><span><a href="#header_tabbar_tag_in_myapp.py_file">tabbar tag in myapp.py file</a></span></li><li><span>3. </span><span><a href="#header_tabbar.html">tabbar.html</a></span></li><li><span>4. </span><span><a href="#header_tab_item_tag_in_myapp.py_file">tab_item tag in myapp.py file</a></span></li><li><span>5. </span><span><a href="#header_tab_item.html">tab_item.html</a></span></li><li><span>6. </span><span><a href="#header_Conclusion">Conclusion</a></span></li></ol></div></div><p> In this article, I'll show you exactly how you can write a simple block template tag, like the <strong> blocktranslate </strong> tag in <strong> Django </strong> . </p><p> These block template tags have an opening tag and a closing tag, and the most common one I would call the <strong> blocktranslate </strong> tag, which allows you to translate entire pieces of html code, not just individual sentences. The tag will look like this: </p><pre><pre class="lang-html prettyprint linenums">{% blocktranslate %}This string will have {{ value }} inside.{% endblocktranslate %} </pre></pre><p> In this case, the tag has a <strong> blocktranslate </strong> opening tag and an <strong> endblocktranslate </strong> closing tag, and the content inside is being manipulated. </p><p> Personally, I wrote a few simple tags for myself to simplify writing template code on the site. One such tag is the <strong> tabber </strong> tag inside which I also use <strong> tab_item </strong> tags. </p><p> This reduces coding in templates and makes the template friendlier and easier to maintain. </p><p> As a result, my template code may look like this. </p><pre><pre class="lang-html prettyprint linenums">{% load tabbar tab_item from myapp %} {% url 'myapp:settings_main' as the_settings_main_url %} {% url 'myapp:settings_notification' as the_settings_notification_url %} {% tabbar %} {% tab_item _('Main') the_settings_main_url True %} {% tab_item _('Notifications') the_settings_notification_url %} {% end_tabbar %} </pre></pre><p> As a result, these template tags generate the following html code </p><pre><pre class="lang-html prettyprint linenums"><div class="overflow-hidden"> <div class="nav nav-tabs border-bottom flex-nowrap"> <a class="text-nowrap nav-item nav-link active" href="/ru/myapp/settings/main/">Основное</a> <a class="text-nowrap nav-item nav-link" href="/ru/myapp/settings/notification/">Уведомления</a> </div> </div> </pre></pre><p> As you can see, quite standard <a href="https://evileg.com/post/10/"> bootstrap </a> Tab Bar code is generated here. </p><p> And if this particular case may not be something that may require writing such a tag, then knowing how to write such a tag can come in handy in more complex layouts, or where there are many places on the site where such tabs are used. Which will be very useful, since in order to change the layout in all parts of the site, it will be enough to change only the code of these template tags. </p><p> Now let's start learning how to write such a template tag. </p><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8160668332851230" crossorigin="anonymous"></script><ins class="adsbygoogle" style="display:block; text-align:center;" data-ad-layout="in-article" data-ad-format="fluid" data-ad-client="ca-pub-8160668332851230" data-ad-slot="5700035342"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><h2><a class="anchor" id="header_Application_structure"></a> Application structure </h2><p> Let's say we have an application <strong> myapp </strong> that will contain these template tags. This requires that directories and files with the following structure be created in this application (in addition to those that are created by default) </p><ul><li> myapp <ul><li> templates <ul><li> myapp <ul><li> tabbar.html </li><li> tab_item.html </li></ul></li></ul></li><li> templatetages <ul><li> __init__.py </li><li> myapp.py </li></ul></li></ul></li></ul><h2><a class="anchor" id="header_tabbar_tag_in_myapp.py_file"></a> tabbar tag in myapp.py file </h2><p> This file will contain the python code for processing the tag in the template, and next to it is the <strong> init </strong> .py file, which initializes myapp in the templatetags directory as a tag library. By default, this file is empty, but it is needed there. </p><p> Let's start by adding the necessary imports. </p><pre><pre class="lang-py prettyprint linenums"># -*- coding: utf-8 -*- import random from django import template from django.template.loader import render_to_string from django.utils.translation import ugettext_lazy as _ register = template.Library() </pre></pre><p> Then we will register the template tag. The important point is that usually functions that are registered as a block template tag start with the <strong> do_ </strong> prefix. As you can see in the code below, as soon as the Django parser finds the {% tabbar %} tag, it immediately starts parsing the template in the form of a list of nodes, then the closing tag, which in this case is named <strong> end_tabbar </strong> , while the first token from the parser is removed. As I understand it, the node inside which the tabbar tag was found is deleted, as a result, it is no longer processed. The list of nodes is passed to the custom node class ( <strong> TabBarNode </strong> ) for further processing. </p><pre><pre class="lang-py prettyprint linenums"> @register.tag("tabbar") def do_tabbar(parser, token): tag_name, args, kwargs = parse_tag(token, parser) nodelist = parser.parse(('end_tabbar',)) parser.delete_first_token() return TabBarNode(nodelist) </pre></pre><p> Further, the <strong> TabBarNode </strong> class is taken for processing, which is initialized with a list of nodes (nodelist), which is rendered into the <strong> tabbar_content </strong> variable. The render method causes further parsing of all other nodes until all nodes are parsed and rendered to the state of a regular string, which can be inserted as a tabbar_content variable in the template and rendered using the <strong> render_to_string </strong> function in the <strong> render </strong> method. Have you noticed that <br/> nodelist also has a <strong> render </strong> method? </p><pre><pre class="lang-py prettyprint linenums">class TabBarNode(template.Node): def __init__(self, nodelist): self.nodelist = nodelist def render(self, context): context.update({'tabbar_content': self.nodelist.render(context)}) return render_to_string( template_name='myapp/tabbar.html', context=context.flatten() ) </pre></pre><h2><a class="anchor" id="header_tabbar.html"></a> tabbar.html </h2><p> The template in this case looks rather trivial. </p><pre><pre class="lang-html prettyprint linenums"><div class="overflow-hidden"> <div class="nav nav-tabs border-bottom flex-nowrap"> {{ tabbar_content }} </div> </div> </pre></pre><h2><a class="anchor" id="header_tab_item_tag_in_myapp.py_file"></a> tab_item tag in myapp.py file </h2><p> But <strong> tab_item </strong> is already registered as <a href="https://evileg.com/post/449/"> inclusion_tag </a> , and for understanding it is already simpler. </p><p> There are input arguments that are responsible for: </p><ul><li> Text </li><li> Link </li><li> Indicate css link activity </li></ul><pre><pre class="lang-py prettyprint linenums">@register.inclusion_tag('myapp/tab_item.html', takes_context=True) def tab_item(context, title, url='#', active=False): return { 'title': title, 'url': url, 'active': active, } </pre></pre><h2><a class="anchor" id="header_tab_item.html"></a> tab_item.html </h2><p> And take a look at the tag template </p><pre><pre class="lang-html prettyprint linenums"><a class="text-nowrap nav-item nav-link{% if active %} active{% endif %}" href="{{ url }}">{{ title }}</a> </pre></pre><h2><a class="anchor" id="header_Conclusion"></a> Conclusion </h2><p> The result is a little simplified way to write a TabBar on a website using block tags. </p></div><div class="mt-3"><a href="https://timeweb.com/ru/?i=27415&utm_source=evileg&utm_medium=after_article&utm_campaign=base" rel="nofollow" target="_blank"><div class="d-flex"><div class="me-3"><img src="/media/technical_storage/timeweb-120-90.jpg" alt="We recommend hosting TIMEWEB"></div><div><h5 class="mt-0">We recommend hosting TIMEWEB</h5> Stable hosting, on which the social network EVILEG is located. For projects on Django we recommend VDS hosting. </div></div></a></div></div><div class="card-body border-top"><p><strong>Recommended articles on this topic</strong></p><ul><li><a href="/en/post/714/">Django - Lesson 063. Full text site search for multiple models with multilingual support</a></li><li><a href="/en/post/707/">Django - Lesson 060. Speeding up a website with caching templates</a></li><li><a href="/en/post/5/">Django - Tutorial 003. Model, Template, View on Django</a></li></ul><p><strong class="me-1">By article asked</strong><a href="/en/forum/?search=article:709">0<span class="ms-1">question(s)</span></a></p><div class="form-check form-switch d-flex justify-content-between align-items-center"><input class="form-check-input me-3" type="checkbox" role="switch" disabled><label class="form-check-label mt-1">Subscribe to the discussion</label><span class="badge text-bg-primary ms-auto">2</span></div><div class="form-check form-switch d-flex justify-content-between align-items-center"><input class="form-check-input me-3" type="checkbox" role="switch" disabled><label class="form-check-label mt-1"><a href="/en/knowledge/django/">Section subscription</a></label><span class="badge text-bg-primary ms-auto">180</span></div></div><div class="m-3 p-3 bg-light rounded text-center"><p>Do you like it? Share on social networks!</p><script async src="https://yastatic.net/share2/share.js"></script><div class="ya-share2" data-curtain data-size="l" data-shape="round" data-lang="en" data-services="telegram,vkontakte,twitter,linkedin,reddit,odnoklassniki,whatsapp,skype,tumblr,lj,pocket,surfingbird"></div></div><div class="card-footer"><div class="btn btn-sm" title="Views"><i class="bi bi-eye me-1"></i>3.2K</div><a class="btn btn-sm btn-light" title="Comments" href="/en/post/709/#comments"><i class="bi bi-chat-left me-1"></i>3</a><div class="btn btn-sm btn-light" onclick="Global.nonlogin()" title="Only registered users can add to favorites"><i class="bi bi-bookmark me-1"></i>0</div><div class="btn btn-sm btn-light" onclick="Global.nonlogin()" title="Only registered users can rate"><i class="bi bi-hand-thumbs-up-fill me-1"></i>2</div><div class="btn btn-sm btn-light" onclick="Global.nonlogin()" title="Only registered users can rate"><i class="bi bi-hand-thumbs-down-fill me-1"></i>0</div></div></div></article><a class="anchor" id="comments"></a><div id="comments-feed"><a class="anchor" name="comment-2667"></a><div id="2667" class="card mb-3"><div class="card-header d-flex py-2"><a href=/en/users/10408/><img loading="lazy" alt="NSProject" class="bg-secondary bg-opacity-10 rounded avatar-initials avatar-48" src="/media/cache/6e/8b/6e8baa0e660589d5198b5d368187f394.webp"></a><div class="ms-3"><ul class="list-inline mb-0"><li class="list-inline-item"><a rel="author" href="/en/users/10408/">NSProject</a></li><li class="list-inline-item"><a href="/en/post/709/#comment-2667" title="Link to comment">#</a></li></ul><ul class="list-inline mb-0"><li class="list-inline-item me-2"><small class="text-secondary">March 24, 2023, 7:15 p.m.</small></li></ul></div></div><div class="card-body"><div class="mb-3"><p> Хорошая статья. И тут я подумал что на её основе можно отлично сформировать "хлебные крошки". Самое простое распарсить адрес. Так и поступил бы но лень </p></div></div><div class="card-footer"><div class="btn btn-sm btn-light" onclick="Global.nonlogin()" title="Only registered users can add to favorites"><i class="bi bi-bookmark me-1"></i>0</div><div class="btn btn-sm btn-light" onclick="Global.nonlogin()" title="Only registered users can rate"><i class="bi bi-hand-thumbs-up-fill me-1"></i>0</div><div class="btn btn-sm btn-light" onclick="Global.nonlogin()" title="Only registered users can rate"><i class="bi bi-hand-thumbs-down-fill me-1"></i>0</div></div><script type="application/ld+json">{"@context": "http://schema.org", "@type": "Comment", "author": "NSProject", "url": "/en/post/709/#comment-2667", "name": "Django - Lesson 062. How to write a block-template tabbar tag like the blocktranslate tag", "headline": "Django - Lesson 062. How to write a block-template tabbar tag like the blocktranslate tag", "description": "\n \n Хорошая статья. И тут я подумал что на её основе можно отлично сформировать \"хлебные крошки\". Самое простое распарсить адрес. Так и поступил бы но лень\n \n", "datePublished": "2023-03-24T13:15:32.326448+00:00", "interactionStatistic": [{"@type": "InteractionCounter", "interactionType": "BookmarkAction", "userInteractionCount": 0}, {"@type": "InteractionCounter", "interactionType": "LikeAction", "userInteractionCount": 0}, {"@type": "InteractionCounter", "interactionType": "DislikeAction", "userInteractionCount": 0}]}</script></div><a class="anchor" name="comment-2668"></a><div id="2668" class="card mb-3"><div class="card-header d-flex py-2"><a href=/en/users/2/><img loading="lazy" alt="Evgenii Legotckoi" class="bg-secondary bg-opacity-10 rounded avatar-initials avatar-48" src="/media/cache/7a/08/7a0837c6eb199ca9af1a03ea5ccbfcbf.webp"></a><div class="ms-3"><ul class="list-inline mb-0"><li class="list-inline-item"><a rel="author" href="/en/users/2/">Evgenii Legotckoi</a> → <a class="text-muted" href="#comment-2667">NSProject</a></li><li class="list-inline-item"><a href="/en/post/709/#comment-2668" title="Link to comment">#</a></li></ul><ul class="list-inline mb-0"><li class="list-inline-item me-2"><small class="text-secondary">March 24, 2023, 8:09 p.m.</small></li></ul></div></div><div class="card-body"><div class="mb-3"><p> Почитайте эту статью про <a href="https://evileg.com/post/449/"> "хлебные крошки" </a></p></div></div><div class="card-footer"><div class="btn btn-sm btn-light" onclick="Global.nonlogin()" title="Only registered users can add to favorites"><i class="bi bi-bookmark me-1"></i>0</div><div class="btn btn-sm btn-light" onclick="Global.nonlogin()" title="Only registered users can rate"><i class="bi bi-hand-thumbs-up-fill me-1"></i>0</div><div class="btn btn-sm btn-light" onclick="Global.nonlogin()" title="Only registered users can rate"><i class="bi bi-hand-thumbs-down-fill me-1"></i>0</div></div><script type="application/ld+json">{"@context": "http://schema.org", "@type": "Comment", "author": "Evgenii Legotckoi", "url": "/en/post/709/#comment-2668", "name": "Django - Lesson 062. How to write a block-template tabbar tag like the blocktranslate tag", "headline": "Django - Lesson 062. How to write a block-template tabbar tag like the blocktranslate tag", "description": "\n \n Почитайте эту статью про\n \n \"хлебные крошки\"\n \n \n", "datePublished": "2023-03-24T14:09:55.731144+00:00", "interactionStatistic": [{"@type": "InteractionCounter", "interactionType": "BookmarkAction", "userInteractionCount": 0}, {"@type": "InteractionCounter", "interactionType": "LikeAction", "userInteractionCount": 0}, {"@type": "InteractionCounter", "interactionType": "DislikeAction", "userInteractionCount": 0}]}</script></div><a class="anchor" name="comment-2669"></a><div id="2669" class="card mb-3"><div class="card-header d-flex py-2"><a href=/en/users/10408/><img loading="lazy" alt="NSProject" class="bg-secondary bg-opacity-10 rounded avatar-initials avatar-48" src="/media/cache/6e/8b/6e8baa0e660589d5198b5d368187f394.webp"></a><div class="ms-3"><ul class="list-inline mb-0"><li class="list-inline-item"><a rel="author" href="/en/users/10408/">NSProject</a> → <a class="text-muted" href="#comment-2668">Evgenii Legotckoi</a></li><li class="list-inline-item"><a href="/en/post/709/#comment-2669" title="Link to comment">#</a></li></ul><ul class="list-inline mb-0"><li class="list-inline-item me-2"><small class="text-secondary">March 25, 2023, 12:35 a.m.</small></li></ul></div></div><div class="card-body"><div class="mb-3"><p> Да не я так к примеру просто написал. </p></div></div><div class="card-footer"><div class="btn btn-sm btn-light" onclick="Global.nonlogin()" title="Only registered users can add to favorites"><i class="bi bi-bookmark me-1"></i>0</div><div class="btn btn-sm btn-light" onclick="Global.nonlogin()" title="Only registered users can rate"><i class="bi bi-hand-thumbs-up-fill me-1"></i>0</div><div class="btn btn-sm btn-light" onclick="Global.nonlogin()" title="Only registered users can rate"><i class="bi bi-hand-thumbs-down-fill me-1"></i>0</div></div><script type="application/ld+json">{"@context": "http://schema.org", "@type": "Comment", "author": "NSProject", "url": "/en/post/709/#comment-2669", "name": "Django - Lesson 062. How to write a block-template tabbar tag like the blocktranslate tag", "headline": "Django - Lesson 062. How to write a block-template tabbar tag like the blocktranslate tag", "description": "\n \n Да не я так к примеру просто написал.\n \n", "datePublished": "2023-03-24T18:35:39.677268+00:00", "interactionStatistic": [{"@type": "InteractionCounter", "interactionType": "BookmarkAction", "userInteractionCount": 0}, {"@type": "InteractionCounter", "interactionType": "LikeAction", "userInteractionCount": 0}, {"@type": "InteractionCounter", "interactionType": "DislikeAction", "userInteractionCount": 0}]}</script></div></div><div class="card card-warning m-3 "><div class="card-header bg-warning"><h3 class="card-title mb-0">Comments</h3></div><div class="card-body"> Only authorized users can post comments.<br/>Please, <a href="/en/accounts/login/">Log in</a> or <a href="/en/accounts/register/">Sign up</a></div></div></div></div><div class="col-12 col-lg-auto"><div class="sidebar sidebar-lg sticky-lg-top mb-3"><div class="list-group mb-3"><div class="list-group-item list-group-item-primary"><strong>Actions</strong></div><a None href="/en/knowledge/article/add/" class="list-group-item list-group-item-action"><span>Write article</span></a><a None href="/en/forum/create_topic/" class="list-group-item list-group-item-action"><span>Ask a question</span></a><a None href="/en/forum/create_topic/" class="list-group-item list-group-item-action"><span>Take the test</span></a><a None href="/en/sharecode/create/" class="list-group-item list-group-item-action"><span>Share code</span></a></div><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8160668332851230" crossorigin="anonymous"></script><ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-8160668332851230" data-ad-slot="8743063287" data-ad-format="auto" data-full-width-responsive="true"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script></div></div></div><div class="row"><div class="col-12 col-lg overflow-hidden"><ul class="list-group mb-3"><li class="list-group-item list-group-item-primary"><strong>Last passed tests</strong></li><li class="list-group-item"><div class="d-flex py-2"><a class="bg-secondary bg-opacity-10 rounded avatar-initials avatar-48" href=/en/users/18523/>КБ</a><div class="ms-3"><div><a href="/en/users/18523/" class="text-decoration-none">Кирилл Бородин</a></div><small class="text-secondary">April 7, 2025, 11:09 a.m.</small></div></div><div class="mb-3"><div><a href="/en/tests/t/8/">C++ - Test 006. Enumerations</a></div><div><strong>Result:</strong> 70 points</div><div><span class="text-success">Test passed</span></div></div></li><li class="list-group-item"><div class="d-flex py-2"><a class="bg-secondary bg-opacity-10 rounded avatar-initials avatar-48" href=/en/users/18523/>КБ</a><div class="ms-3"><div><a href="/en/users/18523/" class="text-decoration-none">Кирилл Бородин</a></div><small class="text-secondary">April 6, 2025, 3:29 p.m.</small></div></div><div class="mb-3"><div><a href="/en/tests/t/7/">C++ - Test 005. Structures and Classes</a></div><div><strong>Result:</strong> 66 points</div><div><span class="text-danger">Test is not passed</span></div></div></li><li class="list-group-item"><div class="d-flex py-2"><a class="bg-secondary bg-opacity-10 rounded avatar-initials avatar-48" href=/en/users/18523/>КБ</a><div class="ms-3"><div><a href="/en/users/18523/" class="text-decoration-none">Кирилл Бородин</a></div><small class="text-secondary">April 6, 2025, 3:20 p.m.</small></div></div><div class="mb-3"><div><a href="/en/tests/t/6/">C ++ - Test 004. Pointers, Arrays and Loops</a></div><div><strong>Result:</strong> 80 points</div><div><span class="text-success">Test passed</span></div></div></li></ul><ul class="list-group mb-3"><li class="list-group-item list-group-item-primary"><strong>Last comments</strong></li><li class="list-group-item"><div class="py-2"><div class="d-flex py-2"><a class="bg-secondary bg-opacity-10 rounded avatar-initials avatar-48" href=/en/users/18515/>AK</a><div class="ms-3"><div><a href="/en/users/18515/" class="text-decoration-none">Arseniy Khomchenko</a></div><small class="text-secondary">April 1, 2025, 11:41 a.m.</small></div></div><div><a href="/en/post/155/#comment-2845">Qt/C++ - Lesson 051. QMediaPlayer – simple audio player</a></div><div class="text-break"> Добрый день. В данный момент работаю над проектом, где необходимо выводить звук из программы в определенное аудиоустройство (колонки, наушники, виртуальный кабель и т.д). Пишу на Qt5.12.12 поско…</div></div></li><li class="list-group-item"><div class="py-2"><div class="d-flex py-2"><a href=/en/users/2/><img loading="lazy" alt="Evgenii Legotckoi" class="bg-secondary bg-opacity-10 rounded avatar-initials avatar-48" src="/media/cache/7a/08/7a0837c6eb199ca9af1a03ea5ccbfcbf.webp"></a><div class="ms-3"><div><a href="/en/users/2/" class="text-decoration-none">Evgenii Legotckoi</a></div><small class="text-secondary">March 9, 2025, 9:02 p.m.</small></div></div><div><a href="/en/post/193/#comment-2844">QML - Lesson 020. Introduction to Android Manifest in Qt Creator</a></div><div class="text-break"> К сожалению, я этого подсказать не могу, поскольку у меня нет необходимости в обходе блокировок и т.д. Поэтому я и не задавался решением этой проблемы. Ну выглядит так, что вам действитель…</div></div></li><li class="list-group-item"><div class="py-2"><div class="d-flex py-2"><a class="bg-secondary bg-opacity-10 rounded avatar-initials avatar-48" href=/en/users/15549/>VP</a><div class="ms-3"><div><a href="/en/users/15549/" class="text-decoration-none">Viktor Pathfinder</a></div><small class="text-secondary">March 9, 2025, 4:14 p.m.</small></div></div><div><a href="/en/post/193/#comment-2843">QML - Lesson 020. Introduction to Android Manifest in Qt Creator</a></div><div class="text-break"> Здравствуйте! Я устанавливал Qt6 из исходников а также Qt Creator по отдельности. Все компоненты, связанные с разработкой для Android, установлены. Кроме одного... Когда пытаюсь скомпилиров…</div></div></li><li class="list-group-item"><div class="py-2"><div class="d-flex py-2"><a class="bg-secondary bg-opacity-10 rounded avatar-initials avatar-48" href=/en/users/1217/>ИМ</a><div class="ms-3"><div><a href="/en/users/1217/" class="text-decoration-none">Игорь Максимов</a></div><small class="text-secondary">Nov. 22, 2024, 9:51 p.m.</small></div></div><div><a href="/en/post/203/#comment-2842">Django - Tutorial 017. Customize the login page to Django</a></div><div class="text-break"> Добрый вечер Евгений! Я сделал себе авторизацию аналогичную вашей, все работает, кроме возврата к предидущей странице. Редеректит всегда на главную, хотя в логах сервера вижу запросы на правильн…</div></div></li><li class="list-group-item"><div class="py-2"><div class="d-flex py-2"><a href=/en/users/2/><img loading="lazy" alt="Evgenii Legotckoi" class="bg-secondary bg-opacity-10 rounded avatar-initials avatar-48" src="/media/cache/7a/08/7a0837c6eb199ca9af1a03ea5ccbfcbf.webp"></a><div class="ms-3"><div><a href="/en/users/2/" class="text-decoration-none">Evgenii Legotckoi</a></div><small class="text-secondary">Oct. 31, 2024, 11:37 p.m.</small></div></div><div><a href="/en/post/729/#comment-2751">Django - Lesson 064. How to write a Python Markdown extension</a></div><div class="text-break"> Добрый день. Да, можно. Либо через такие же плагины, либо с постобработкой через python библиотеку Beautiful Soup </div></div></li></ul><ul class="list-group mb-3"><li class="list-group-item list-group-item-primary"><strong>Now discuss on the forum</strong></li><li class="list-group-item"><div class="py-2"><div class="d-flex py-2"><a class="bg-secondary bg-opacity-10 rounded avatar-initials avatar-48" href=/en/users/18263/>f</a><div class="ms-3"><div><a href="/en/users/18263/" class="text-decoration-none">firstlunoxod</a></div><small class="text-secondary">Feb. 15, 2025, 1:46 p.m.</small></div></div><div><a href="/en/forum/topic/218/#post-9885">Рисование на QGraphicsScene при зажатой кнопке мыши</a></div><div class="text-break"> Подскажите, пожалуйста! Как данный класс можно дополнить, чтобы созданные объекты можно было перемещать мышкой по сцене? </div></div></li><li class="list-group-item"><div class="py-2"><div class="d-flex py-2"><a href=/en/users/2417/><img loading="lazy" alt="Дмитрий" class="bg-secondary bg-opacity-10 rounded avatar-initials avatar-48" src="/media/cache/7f/2a/7f2a7c6416eb74fb21e8506c0ed78532.webp"></a><div class="ms-3"><div><a href="/en/users/2417/" class="text-decoration-none">Дмитрий</a></div><small class="text-secondary">Feb. 3, 2025, 4:24 p.m.</small></div></div><div><a href="/en/forum/topic/1920/">Создание deb-пакета. Как создать ярлык на рабочем столе после установки собственного deb-пакета?</a></div><div class="text-break"> Всем привет. Сделал свой deb-пакет с программой. Всё устанавливается и работает. Ставлю по пути /usr/bin/my_application. Как для пользователя при установке пакета сразу создать ярлык на раб…</div></div></li><li class="list-group-item"><div class="py-2"><div class="d-flex py-2"><a class="bg-secondary bg-opacity-10 rounded avatar-initials avatar-48" href=/en/users/18202/>NW</a><div class="ms-3"><div><a href="/en/users/18202/" class="text-decoration-none">Nayo Wai</a></div><small class="text-secondary">Jan. 30, 2025, 7:22 p.m.</small></div></div><div><a href="/en/forum/topic/1919/">не запускается компьютер!!!</a></div><div class="text-break"> Не запускается компьютер (точнее работает блок , но сам монитор вообще жесть)В общем я ничего с интернета не скачивала в последнее время. На компе никаких левых пр…</div></div></li><li class="list-group-item"><div class="py-2"><div class="d-flex py-2"><a class="bg-secondary bg-opacity-10 rounded avatar-initials avatar-48" href=/en/users/12748/>n</a><div class="ms-3"><div><a href="/en/users/12748/" class="text-decoration-none">nkly</a></div><small class="text-secondary">Jan. 3, 2025, 12:52 p.m.</small></div></div><div><a href="/en/forum/topic/1909/#post-9884">Нужно запретить перемещение только некоторых итемов, остальные перемещать можно.</a></div><div class="text-break"> Вопрос решен. Узнать QModelIndex элемента на который мы перетаскиваем другой элемент, можно с помощью функции indexAt(event->position().toPoint()) представления QTreeViev вызываемой в переопр…</div></div></li><li class="list-group-item"><div class="py-2"><div class="d-flex py-2"><a class="bg-secondary bg-opacity-10 rounded avatar-initials avatar-48" href=/en/users/15590/>M</a><div class="ms-3"><div><a href="/en/users/15590/" class="text-decoration-none">Marsel</a></div><small class="text-secondary">Aug. 17, 2023, 12:26 a.m.</small></div></div><div><a href="/en/forum/topic/1850/#post-9711">OAuth2.0 через VK, получение email</a></div><div class="text-break"> Спасибо большое за помощь и простите за то что отнял время своей невнимательностью. </div></div></li></ul></div><div class="col-12 col-lg-auto"><div class="sidebar sidebar-lg sticky-lg-top mb-3"><div class="sidebar sidebar-lg sticky-top"><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8160668332851230" crossorigin="anonymous"></script><ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-8160668332851230" data-ad-slot="3079673067" data-ad-format="auto" data-full-width-responsive="true"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script></div></div></div></div></main><div class="container-xxl"><footer class="py-5"><div class="row"><div class="col-6 col-md-3 mb-3"><h5>About us</h5><ul class="nav flex-column"><li class="nav-item mb-2"><a class="nav-link p-0 text-body-secondary" href="/en/pages/">About us</a></li><li class="nav-item mb-2"><a class="nav-link p-0 text-body-secondary" href="/en/pages/rules/privacy-policy/">Privacy Policy</a></li><li class="nav-item mb-2"><a class="nav-link p-0 text-body-secondary" href="/en/pages/contacts/">Contacts</a></li><li class="nav-item mb-2"><a class="nav-link p-0 text-body-secondary" href="/en/pages/donate/">Donate</a></li><li class="nav-item mb-2"><a class="nav-link p-0 text-body-secondary" href="/en/pages/for-advertisers/">For advertisers</a></li></ul></div><div class="col-6 col-md-3 mb-3"><h5>Follow us in social networks</h5><ul class="nav flex-column"><li class="nav-item mb-2"><a class="nav-link p-0 text-body-secondary" href="https://vk.com/evileg" target="_blank" rel="noindex nofollow">VKontakte</a></li><li class="nav-item mb-2"><a class="nav-link p-0 text-body-secondary" href="https://t.me/evileg_ru" target="_blank" rel="noindex nofollow">Telegram</a></li><li class="nav-item mb-2"><a class="nav-link p-0 text-body-secondary" href="https://www.reddit.com/r/Evileg/" target="_blank" rel="noindex nofollow">Reddit</a></li></ul></div><div class="col-6 mb-3"><ul class="nav flex-column"><li class="nav-item mb-2">We recommend VSD hosting <a class="nav-link p-0" href="http://timeweb.com/ru/?i=27415&utm_source=evileg&utm_medium=footer&utm_campaign=timeweb" target="_blank" rel="noindex nofollow">Timeweb</a></li></ul></div></div><div class="d-flex flex-column flex-sm-row justify-content-between py-4 my-4 border-top"><p>© 2015-2025, Evgenii Legotckoi</p><ul class="list-unstyled d-flex"><li class="ms-3"><a class="link-body-emphasis" href="https://t.me/evileg_ru" target="_blank" rel="noindex nofollow"><i class="bi bi-telegram" style="font-size: 2rem;"></i></a></li><li class="ms-3"><a class="link-body-emphasis" href="https://www.reddit.com/r/Evileg/" target="_blank" rel="noindex nofollow"><i class="bi bi-reddit" style="font-size: 2rem;"></i></a></li></ul></div></footer></div><div id="menuModal" class="modal" tabindex="-1"><div class="modal-dialog modal-dialog-scrollable"><div class="modal-content"><div class="modal-header"><h5 class="modal-title">Actions</h5><button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button></div><div class="modal-body m-0 p-0"><div class="list-group list-group-flush"><a None href="/en/knowledge/article/add/" class="list-group-item list-group-item-action"><span>Write article</span></a><a None href="/en/forum/create_topic/" class="list-group-item list-group-item-action"><span>Ask a question</span></a><a None href="/en/forum/create_topic/" class="list-group-item list-group-item-action"><span>Take the test</span></a><a None href="/en/sharecode/create/" class="list-group-item list-group-item-action"><span>Share code</span></a></div></div></div></div></div><script async src="/static/js/run_prettify.js"></script><script type="text/javascript" > (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)}; m[i].l=1*new Date(); for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }} k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)}) (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym"); ym(39565770, "init", { clickmap:true, trackLinks:true, accurateTrackBounce:true }); </script><noscript><div><img src="https://mc.yandex.ru/watch/39565770" style="position:absolute; left:-9999px;" alt="" /></div></noscript><script> window.addEventListener("load", () => { const render = (imageId) => { window.yaContextCb.push(() => { Ya.Context.AdvManager.render({ "renderTo": imageId, "blockId": "R-A-218837-50", "type": "inImage" }) }) } const renderInImage = (images) => { if (!images.length) { return } const image = images.shift() image.id = `yandex_rtb_R-A-218837-50-${Math.random().toString(16).slice(2)}` if (image.tagName === "IMG" && !image.complete) { image.addEventListener("load", () => { render(image.id) }, { once: true }) } else { render(image.id) } renderInImage(images) } renderInImage(Array.from(document.querySelectorAll("img"))) }, { once: true }) </script></body></html>