Django:有没有更好的方法来加粗当前页面链接 [英] Django: Is there a better way to bold the current page link

查看:124
本文介绍了Django:有没有更好的方法来加粗当前页面链接的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个包含链接列表的base.html模板。



示例:

 < div id =sidebar1> 
< ul>
< li>< a href =/title =>索引< / a>< / li>
< li>< a href =/ stuff /title =class =current> Stuff< / a>< / li>
< li>< a href =/ about /title =>关于我< / a>< / li>
< li>< a href =/ contact /title =>与我联系< / a>< / li>
< / div>

然后我在我的views.py中为index.html,stuff.html, about.html和contact.html。每个模板只是从一个base.html模板中派生出来,并设置自己各自的标题和内容。



我的问题是关于上述/我有一个class =current的东西。



我想让我现在的页面具有该类属性。



I可以在每个视图中设置一个不同的变量,如current_page =about,然后在每个链接的每个类元素中的模板中与 {%ifequal%} 进行比较,但这似乎是重复的工作(因为额外的视图变量)。



有更好的方法吗?也许如果有一种方法可以自动获取模板填充的视图函数名称,则不需要设置额外的变量?这也是一个很好的方法。

解决方案

这是一个优雅的方式来做,我从某个地方复制,只希望我能记得在哪里,所以我可以给他们信用。 8 - )



我为每个页面(或部分内的所有页面)分配一个 id 这是:

 在index.html中:< body id ='section-intro'> ... 
在faq.html中:< body id ='section-faq'> ...
在download.html中:< body id ='section-download'> ...

然后,相应链接的 id

 < li id ='nav-intro'>< a href =./>简介< / a>李> 
< li id ='nav-faq'>< a href =./ faq.html> FAQ< / a>< / li>
< li id ='nav-download'>< a href =./ download.html>下载< / a>< / li>

在CSS中我设置了一个这样的规则:

 #section-intro#nav-intro,
#section-faq#nav-faq,
#section-download#nav-
font-weight:bold;
/ *和当前链接应该有的其他样式。 * /
}

所以这个工作原理大部分是以声明的方式来控制链接当前页面所在的位置。您可以在此处看到它: http://entrian.com/source-搜索/



这是一个非常干净和简单的系统,一旦你设置了,因为:




  • 您不需要在链接中弄乱模板标记

  • 您最终不会使用大丑的切换语句或 if / else / else 语句

  • 向页面添加页面Just Works [TM]

  • 改变事情只是改变CSS的方式,而不是标记。



我没有使用Django,但这个系统可以在任何地方工作。在你的情况下,你设置自己的各自的标题和内容你还需要设置 body id ,并且不需要其他Django标记。



这个想法也很容易扩展到其他情况,例如。 我想在每个页面旁边的边栏中下载一个下载链接,除了下载页面本身。你可以这样在CSS中这样做:

 #section-download #sidebar#download-link {
display:没有;
}

而不必在边栏HTML中放置条件模板标记。 >

I have a base.html template that contains a list of links.

Example:

   <div id="sidebar1">
        <ul>
        <li><a href="/" title="">Index</a></li>
        <li><a href="/stuff/" title="" class="current">Stuff</a></li>
        <li><a href="/about/" title="">About Me</a></li>
        <li><a href="/contact/" title="">Contact Me</a></li>
    </div>

Then I have in my views.py a definition for each of index.html, stuff.html, about.html and contact.html. Each of those templates simply derive from a base.html template and set their own respective titles and contents.

My question is about the above /stuff I have a class="current".

I'd like to make the current page that I'm on have that class attribute.

I could set a different variable in each view like current_page="about" and then do a compare in the template with {% ifequal %} in each class element of each link , but that seems like duplicating work (because of the extra view variable).

Is there a better way? Maybe if there is a way to get the view function name that the template was filled from automatically I would not need to set the extra variable? Also it does seem like a lot of ifequals.

解决方案

Here's an elegant way to do this, which I copied from somewhere and I only wish I could remember where, so I could give them the credit. 8-)

I assign an id to each of my pages (or all the pages within a section) like this:

In index.html:    <body id='section-intro'>...
In faq.html:      <body id='section-faq'>...
In download.html: <body id='section-download'>...

And then an id for the corresponding links:

<li id='nav-intro'><a href="./">Introduction</a></li>
<li id='nav-faq'><a href="./faq.html">FAQ</a></li>
<li id='nav-download'><a href="./download.html">Download</a></li>

And the in the CSS I set a rule like this:

#section-intro #nav-intro,
#section-faq #nav-faq,
#section-download #nav-download {
    font-weight: bold;
    /* And whatever other styles the current link should have. */
}

So this works in a mostly declarative way to control the style of the link that the current page belongs in. You can see it in action here: http://entrian.com/source-search/

It's a very clean and simple system once you've set it up, because:

  • You don't need to mess about with template markup in your links
  • You don't end up using big ugly switch statements or if / else / else statements
  • Adding pages to a section Just Works [TM]
  • Changing the way things look only ever means changing the CSS, not the markup.

I'm not using Django, but this system works anywhere. In your case, where you "set their own respective titles and contents" you also need to set the body id, and there's no other Django markup required.

This idea extends easily to other situations as well, eg. "I want a download link in the sidebar on every page except the download pages themselves." You can do that in CSS like this:

#section-download #sidebar #download-link {
    display: none;
}

rather than having to put conditional template markup in the sidebar HTML.

这篇关于Django:有没有更好的方法来加粗当前页面链接的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆