隐藏Tumblr主题索引页面中具有特定标记的帖子

时间:2017-01-23 19:14:58

标签: html css tumblr tumblr-themes

我想在博客的索引页面中隐藏任何带有特定标记的帖子。

有问题的主题是Pation by Zen Themes

<!DOCTYPE html>
<!--[if IE 8]><html class="lt-ie10 lt-ie9"> <![endif]-->
<!--[if IE 9]><html class="lt-ie10"> <![endif]-->
<!--[if gt IE 9]><!--><html><!--<![endif]-->
<head>


{MobileAppHeaders}
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">

<!--

    Pation | Zen Themes

    Release Date: Dec 7th, 2016
    Last Update: Apr 23rd, 2016

-->

<title>{Title}{block:SearchPage} ({lang:Search results for SecarchQuery}){/block:SearchPage}{block:PermalinkPage}{block:PostSummary} — {PostSummary}{/block:PostSummary}{/block:PermalinkPage}</title>{block:Description}<meta name=description content="{MetaDescription}">{/block:Description}<link rel=alternate type=application/rss+xml href={RSS}><link rel="shortcut icon" href={Favicon}><link rel=apple-touch-icon-precomposed href={PortraitURL-128}>

{block:Hidden}
<meta name=image:Logo content="">
<meta name=image:Background content="">

<meta name=color:Background content=#ffffff>
<meta name=color:Title content=#111111>
<meta name=color:Text content=#555555>
<meta name=color:Accent content=#0040ff>

<meta name="if:Repeat Background Image" content=0>
<meta name="if:Stick Title" content=1>
<meta name="if:Retina Logo Image" content=1>
<meta name="if:Enable Archive Link" content=1>
<meta name="if:Enable Random Link" content=1>
<meta name="if:Enable RSS Link" content=0>
<meta name="if:Inline Social Links" content=1>
<meta name="if:Icon Social Links" content=0>
<meta name="if:Infinite Scrolling" content=1>
<meta name="if:Randomize Post Size" content=1>
<meta name="if:Photo Hover Style 1" content=1>
<meta name="if:Photo Hover Style 2" content=1>
<meta name="if:Photo Hover Style 3" content=0>
<meta name="if:2000 and Late" content=0>
<meta name=if:Ragtime content=0>
<meta name=if:Cerean content=0>
<meta name="if:TV Static" content=0>

<meta name="text:Follow Link Label" content=Follow>
<meta name="text:Ask Link Label" content=Ask>
<meta name="text:Submit Link Label" content=Submit>
<meta name="text:Archive Link Label" content=Archive>
<meta name="text:Random Link Label" content=Random>

<meta name="text:Post Width" content=240>
<meta name="text:Post Margin" content=60>
<meta name="text:Randomized Post Width Minimum" content=180>
<meta name="text:Randomized Post Width Maximum" content=270>

<meta name="text:Behance URL" content="">
<meta name="text:Dribbble URL" content="">
<meta name="text:Facebook URL" content="">
<meta name="text:Flickr URL" content="">
<meta name="text:Linkedin URL" content="">
<meta name="text:Instagram URL" content="">
<meta name="text:Pinterest URL" content="">
<meta name="text:SoundCloud URL" content="">
<meta name="text:Twitter URL" content="">
<meta name="text:Vimeo URL" content="">
<meta name="text:Youtube URL" content="">

<meta name="text:Custom Link 1" content=""/>
<meta name="text:Custom Link 1 Title" content=""/>
<meta name="text:Custom Link 2" content=""/>
<meta name="text:Custom Link 2 Title" content=""/>
<meta name="text:Custom Link 3" content=""/>
<meta name="text:Custom Link 3 Title" content=""/>
<meta name="text:Custom Link 4" content=""/>
<meta name="text:Custom Link 4 Title" content=""/>
<meta name="text:Custom Link 5" content=""/>
<meta name="text:Custom Link 5 Title" content=""/>

<meta name=select:Font content="Helvetica Neue" title="Helvetica Neue"/><meta name=select:Font content=Arial title=Arial /><meta name=select:Font content=Arimo title=Arimo /><meta name=select:Font content=Arvo title=Arvo /><meta name=select:Font content=Abel title=Abel /><meta name=select:Font content=Bitter title=Bitter /><meta name=select:Font content="courier new" title=Courier /><meta name=select:Font content=Domine title=Domine /><meta name=select:Font content="Droid Sans" title="Droid Sans"/><meta name=select:Font content="Droid Serif" title="Droid Serif"/><meta name=select:Font content=Georgia title=Georgia /><meta name=select:Font content=Helvetica title=Helvetica /><meta name=select:Font content=Karla Title=Karla /><meta name=select:Font content=Lato title=Lato /><meta name=select:Font content="Libre Baskerville" title="Libre Baskerville"/><meta name=select:Font content=Lora title=Lora /><meta name=select:Font content=Mako title=Mako /><meta name=select:Font content=Merriweather title=Merriweather /><meta name=select:Font content=Muli title=Muli /><meta name=select:Font content=Montserrat title=Montserrat /><meta name=select:Font content="Noto Sans" title="Noto Sans"/><meta name=select:Font content=Oswald title=Oswald /><meta name=select:Font content="Playfair Display" title="Playfair Display"/><meta name=select:Font content="PT Mono" title="PT Mono"/><meta name=select:Font content="PT Sans" title="PT Sans"/><meta name=select:Font content="PT Serif" title="PT Serif"/><meta name=select:Font content=Raleway title=Raleway /><meta name=select:Font content=Roboto title=Roboto /><meta name=select:Font content="Roboto Condensed" title="Roboto Condensed"/><meta name=select:Font content="Roboto Slab" title="Roboto Slab"/><meta name=select:Font content="Ropa Sans" title="Ropa Sans"/><meta name=select:Font content=Rokkitt title=Rokkitt /><meta name=select:Font content=Signika title=Signika /><meta name=select:Font content="Source Sans Pro" title="Source Sans Pro"/><meta name=select:Font content="Times New Roman" title="Times New Roman"/><meta name=select:Font content=Questrial title=Questrial />
{/block:Hidden}

<link rel=stylesheet href="http://fonts.googleapis.com/css?family={select:Font}:400,400italic,700,700italic"><link rel=stylesheet href=http://static.tumblr.com/j6tha7z/rrQohtn99/s.css><style>body{font:13px/1.8em "{select:Font}",Helvetica,sans-serif;color:{color:Text};background:{color:background} url({image:Background}){block:ifrepeatbackgroundimage} repeat fixed;{/block:ifrepeatbackgroundimage}{block:ifnotrepeatbackgroundimage}no-repeat center fixed;background-size:cover;-webkit-background-size:cover{/block:ifnotrepeatbackgroundimage}}h1,h2,h3,h4,h5,h6{font:700 13px/1.5em "{select:Font}",Helvetica,sans-serif;color:{color:Title}}a{color:{color:accent}}#title a{color:{color:Title}}#links.responsive ul{background:{color:Title}}#links.responsive ul li a{color:{color:background}!important}.action a{font-family:"{select:Font}",Helvetica Neue,Helvetica,sans-serif;color:{color:title}}.action a:hover{border-bottom:2px solid{color:Title}}#links #social{display:none;{block:ifBehanceURL}display:inline-block;{/block:ifBehanceURL}{block:ifDribbbleURL}display:inline-block;{/block:ifDribbbleURL}{block:ifFacebookURL}display:inline-block;{/block:ifFacebookURL}{block:ifFlickrURL}display:inline-block;{/block:ifFlickrURL}{block:ifLinkedinURL}display:inline-block;{/block:ifLinkedinURL}{block:ifInstagramURL}display:inline-block;{/block:ifInstagramURL}{block:ifPinterestURL}display:inline-block;{/block:ifPinterestURL}{block:ifSoundCloudURL}display:inline-block;{/block:ifSoundCloudURL}{block:ifTwitterURL}display:inline-block;{/block:ifTwitterURL}{block:ifVimeoURL}display:inline-block;{/block:ifVimeoURL}{block:ifYoutubeURL}display:inline-block;{/block:ifYoutubeURL}}#links #social li a{color:rgba({RGBcolor:Title},.6)}#links #social li a:hover{border-bottom:2px solid rgba({RGBcolor:Title},.4)}#social.icon-social-links li a{color:{color:Title}!important}#pagination a{color:{color:Title}}.hover-1 .ot a,.hover-2 .ot a,.hover-3 a{font:700 20px/1em "{select:Font}",Helvetica,sans-serif;color:{color:accent}}#loading-status,#loading-status a{font-family:"{select:Font}",Helvetica Neue,Helvetica,sans-serif;color:{color:title}}.two-late .X.format-photo:after{box-shadow:inset 0 0 9px 9px{color:background}}.text h2 a{color:{color:title}}.text-hover a{font:700 15px/1em "{select:Font}",Helvetica,sans-serif;color:{color:accent}}.text blockquote{border-left:2px solid{color:text}}.text .asker a{font:700 8px/1.5em "{select:Font}",Helvetica,sans-serif;color:{color:title}}h1.fixed a,#links ul li a{font-family:"{select:Font}",Helvetica Neue,Helvetica,sans-serif}#controls a,#post-action>a,#post-action #note-counts,ol.notes li.note.more_notes_link_container,ol.notes li.note.more_notes_link_container a{font-family:"{select:Font}",Helvetica Neue,Helvetica,sans-serif;color:{color:title}}ol.notes li.note:before{font-family:"{select:Font}",Helvetica Neue,Helvetica,sans-serif}#ajax-load #ajax-overlay{background:{color:background}}{CustomCSS}


</style>
</head>

<body class="{block:IndexPage}index{/block:IndexPage}{block:PermalinkPage}permalink{/block:PermalinkPage} tumblr-default-controls{block:ifsticktitle} stick-title{/block:ifsticktitle}{block:ifretinalogoimage} retina_logo_image{/block:ifretinalogoimage}{block:if2000andlate} two-late{/block:if2000andlate}{block:indexpage}{block:ifinfinitescrolling} infinite_scrolling{/block:ifinfinitescrolling}{block:ifrandomizepostsize} randomize_post_size{/block:ifrandomizepostsize}{block:ifcerean} cerean{/block:ifcerean}{block:ifRagtime} ragtime{/block:ifRagtime}{block:iftvstatic} tv-static{/block:iftvstatic}{/block:indexpage}">

<script>var post_width=240,post_margin_bottom=60,post_margin_horizontal=post_margin_bottom/2,randomized_post_width_min=180,randomized_post_width_max=300,post_width={text:Post Width},post_margin_bottom={text:Post Margin},post_margin_horizontal=post_margin_bottom/2,randomized_post_width_min={text:Randomized Post Width Minimum},randomized_post_width_max={text:Randomized Post Width Maximum};</script>

<div id=loading-status class="fixed action"><span class=ld_index>Index</span><span class=ld_permalink><a href=http://{name}.tumblr.com>← To Homepage</a></span><span class=loading>Loading...</span><span class=the_end>You've reached the end</span></div><div id=ajax-load><div id=ajax-content></div><div id=ajax-overlay></div></div>

{block:IndexPage}{block:iflogoimage}<a id=title class="fixed logo" href=/><img src={image:Logo}></a>{/block:iflogoimage}{block:ifnotlogoimage}<h1 id=title class=fixed><a href=/>{title}</a></h1>{/block:ifnotlogoimage}<nav id=links class="fixed action{block:ifinlinesociallinks} inline-social-links{/block:ifinlinesociallinks}"><a id=navigation_slide href=#>Menu</a><ul id=navigation>{block:AskEnabled}<li><a class=ajax href=http://{name}.tumblr.com/ask title="{text:Ask Link Label}">{text:Ask Link Label}</a></li>{/block:AskEnabled}{block:SubmissionsEnabled}<li><a class=ajax href=http://{name}.tumblr.com/submit title="{text:Submit Link Label}">{text:Submit Link Label}</a></li>{/block:SubmissionsEnabled}{block:ifenablearchivelink}<li><a href=/archive title="{text:Archive Link Label}">{text:Archive Link Label}</a></li>{/block:ifenablearchivelink}{block:ifenablerandomlink}<li><a href=/random title="{text:Random Link Label}">{text:Random Link Label}</a></li>{/block:ifenablerandomlink}{block:ifenablersslink}<li><a href={RSS} title=RSS>RSS</a></li>{/block:ifenablersslink}{block:HasPages}{block:Pages}<li><a href={URL} title={Label}>{Label}</a></li>{/block:Pages}{/block:HasPages}{block:ifCustomLink1Title}<li><a href="{text:Custom Link 1}">{text:Custom Link 1 Title}</a></li>{/block:ifCustomLink1Title}{block:ifCustomLink2Title}<li><a href="{text:Custom Link 2}">{text:Custom Link 2 Title}</a></li>{/block:ifCustomLink2Title}{block:ifCustomLink3Title}<li><a href="{text:Custom Link 3}">{text:Custom Link 3 Title}</a></li>{/block:ifCustomLink3Title}{block:ifCustomLink4Title}<li><a href="{text:Custom Link 4}">{text:Custom Link 4 Title}</a></li>{/block:ifCustomLink4Title}{block:ifCustomLink5Title}<li><a href="{text:Custom Link 5}">{text:Custom Link 5 Title}</a></li>{/block:ifCustomLink5Title}

</ul><ul id=social {block:ificonsociallinks}class=icon-social-links {/block:ificonsociallinks}>{block:ifBehanceURL}<li class=behance><a href="{text:Behance URL}" title=Behance target=_blank><i class=icon-behance></i><span>Behance</span></a>{/block:ifBehanceURL}{block:ifDribbbleURL}<li class=dribbble><a href="{text:Dribbble URL}" title=Dribbble target=_blank><i class=icon-dribbble></i><span>Dribbble</span></a>{/block:ifDribbbleURL}{block:ifFacebookURL}<li class=facebook><a href="{text:Facebook URL}" title=Facebook target=_blank><i class=icon-facebook></i><span>Facebook</span></a>{/block:ifFacebookURL}{block:ifFlickrURL}<li class=flickr><a href="{text:Flickr URL}" title=Flickr target=_blank><i class=icon-flickr></i><span>Flickr</span></a>{/block:ifFlickrURL}{block:ifLinkedinURL}<li class=linkedin><a href="{text:Linkedin URL}" title=Linkedin target=_blank><i class=icon-linkedin></i><span>Linkedin</span></a>{/block:ifLinkedinURL}{block:ifInstagramURL}<li class=instagram><a href="{text:Instagram URL}" title=Instagram target=_blank><i class=icon-instagram></i><span>Instagram</span></a>{/block:ifInstagramURL}{block:ifPinterestURL}<li class=pinterest><a href="{text:Pinterest URL}" title=Pinterest target=_blank><i class=icon-pinterest></i><span>Pinterest</span></a>{/block:ifPinterestURL}{block:ifSoundCloudURL}<li class=soundcloud><a href="{text:SoundCloud URL}" title=SoundCloud target=_blank><i class=icon-soundcloud></i><span>SoundCloud</span></a>{/block:ifSoundCloudURL}{block:ifTwitterURL}<li class=twitter><a href="{text:Twitter URL}" title=Twitter target=_blank><i class=icon-twitter></i><span>Twitter</span></a>{/block:ifTwitterURL}{block:ifVimeoURL}<li class=vimeo><a href="{text:Vimeo URL}" title=Vimeo target=_blank><i class=icon-vimeo></i><span>Vimeo</span></a>{/block:ifVimeoURL}{block:ifYoutubeURL}<li class=youtube><a href="{text:Youtube URL}" title=Youtube target=_blank><i class=icon-youtube></i><span>Youtube</span></a>{/block:ifYoutubeURL}</ul></nav>{/block:IndexPage}

<div id=container>

    {block:indexpage}{block:Description}<div id=description>{Description}</div>{/block:Description}{/block:indexpage}<div id=grid>{block:Posts inlineMediaWidth="700" inlineNestedMediaWidth="700"}{block:permalinkpage}<div id=position >{/block:permalinkpage}<article id="{PostID}" class="X {block:Answer} text format-answer{/block:Answer}{block:Chat} text format-chat{/block:Chat}{block:Link} text format-link{/block:Link}{block:Text} text format-text{/block:text}{block:Quote} text format-quote{/block:Quote}{block:Photo} photo format-photo{/block:Photo}{block:Photoset} photo format-photoset{/block:Photoset}{block:Audio} media format-audio{/block:Audio}{block:Video} media format-video{/block:Video}{block:permalinkpage} pp{/block:permalinkpage}">{block:indexpage}<div class=gif></div>{/block:indexpage}
    {block:Answer}<h2 class=title><a href={permalink}>{Question}</a></h2><div class=asker><img src={AskerPortraitURL-64}>{Asker}</div><p class=answer>{answer}</p>{/block:Answer}{block:Chat}{block:Title}<h2 class=title><a href={permalink}>{Title}</a></h2>{/block:Title}<ul class=chats>{block:Lines}<li>{block:Label}<b>{Label}</b>{/block:Label}{Line}</li>{/block:Lines}</ul>{/block:Chat}{block:Link}<h2 class=title><a class=link href={URL}>{Name} →</a></h2>{block:Description}{Description}{/block:Description}{/block:Link}{block:Text}{block:Title}<h2 class=title><a href={permalink}>{Title}</a></h2>{/block:Title}{Body}{/block:Text}{block:Quote}<h2 class=title><a href={permalink}> “{Quote}”</a></h2><div class=source>— {Source}</div>{/block:Quote}
    {block:indexpage}<div class=text-hover><a href={permalink}>Permalink</a><a href={ReblogURL} target=_blank>Reblog</a></div>{/block:indexpage}

    {block:Photo}{block:indexpage}{block:ifnotphotohoverstyle3}{block:ifnotphotohoverstyle2}{block:ifphotohoverstyle1}<div class=hover-1><a href={permalink}>{Notecount}</a><a href={ReblogURL} target=_blank>Reblog</a><a href={permalink}>Posted {timeago}</a><a href={permalink}>{Month} {DayOfMonth}{DayOfMonthSuffix}, {Year}</a></div>{/block:ifphotohoverstyle1}{/block:ifnotphotohoverstyle2}{/block:ifnotphotohoverstyle3}{block:ifnotphotohoverstyle3}{block:ifphotohoverstyle2}<div class=hover-2><a href={permalink}>{MonthNumberWithZero}.{DayOfMonthWithZero}.{ShortYear}</a><span>/</span><a href={ReblogURL} target=_blank>Reblog</a><span>/</span><a href={permalink}>{NoteCount} NTS</a></div>{/block:ifphotohoverstyle2}{/block:ifnotphotohoverstyle3}{block:ifphotohoverstyle3}<div class=hover-3><a href={ReblogURL} target=_blank><i class=icon-retweet></i></a><a class=like-button>{LikeButton size="19"}<i class=icon-heart></i></a></div>{block:ifphotohoverstyle3}<a class=g href={permalink}></a><img src={PhotoURL-500} alt="{PhotoAlt}">{/block:indexpage}

    {block:PermalinkPage}{LinkOpenTag}<img src={PhotoURL-HighRes} alt="{PhotoAlt}">{LinkCloseTag}{/block:PermalinkPage}{/block:Photo}{block:Photoset}{block:indexpage}{block:Photos}<a href={permalink}><img src={PhotoURL-HighRes} alt="{PhotoAlt}"></a>{/block:Photos}{/block:indexpage}

    {block:permalinkpage}{Photoset-700}{/block:permalinkpage}{/block:Photoset}{block:Audio}{block:IndexPage}{AudioEmbed-400}{/block:IndexPage}{block:PermalinkPage}{AudioEmbed-640}{/block:PermalinkPage}{/block:Audio}
    {block:Video}{block:IndexPage}{VideoEmbed-400}{/block:IndexPage}{block:PermalinkPage}{VideoEmbed-700}{/block:PermalinkPage}{/block:Video}</article>{block:permalinkpage}</div>{/block:permalinkpage}{block:date}{block:PermalinkPage}
    <div id=post-action class=fixed>{block:Caption}<a href=# id=slide_caption>Caption</a><div id=caption class=text>{Caption}</div>{/block:Caption}{block:PostNotes}<a href=# id=slide_notes>Notes</a><div id=notes><div id="note-counts">{NoteCountWithLabel}</div>{PostNotes-64}</div>{/block:PostNotes}</div>{/block:PermalinkPage}{block:PermalinkPagination}<div id=post-navigation class="fixed action">{block:NextPost}<a href={NextPost}>← </a>{/block:NextPost}{block:PreviousPost}<a href={PreviousPost}> →</a>{/block:PreviousPost}</div>{/block:PermalinkPagination}{/block:date}{/block:Posts}</div>

{block:indexpage}<footer id=pagination>{block:ifInfiniteScrolling}{block:NextPage}<div id=infinite-next><a href={NextPage}></a></div>{/block:NextPage}{/block:ifInfiniteScrolling}{block:ifnotInfiniteScrolling}{block:Pagination}<a href=# class=prev>←</a><a href=# class=next>→</a>{block:PreviousPage}<a href={PreviousPage} class="prev exist">←</a>{/block:PreviousPage}{block:NextPage}<a href={NextPage} class="next exist">→</a>{/block:NextPage}{/block:Pagination}{/block:ifnotInfiniteScrolling}</footer>{/block:indexpage}


<script src="https://code.jquery.com/jquery-1.12.0.min.js"></script><script src="https://code.jquery.com/jquery-migrate-1.2.1.min.js"></script><script src=http://static.tumblr.com/j6tha7z/Gjjo5i6mh/s.js></script>

</body>
</html>

1 个答案:

答案 0 :(得分:5)

Tumblr有一个方便的变量{TagsAsClasses}。通过这种方式,您可以根据标签设置帖子的样式,从而实现您想要的效果。请注意,这只是隐藏帖子。这意味着,如果每页有10个帖子,并且您博客上最近的10个帖子都有要隐藏帖子的标签,则不会显示任何帖子,您的博客也会干扰无限滚动触发。

首先,您需要将{TagsAsClasses}变量添加到帖子标记中。

<article id="{PostID}" class="{block:IndexPage}{TagsAsClasses}{/block:IndexPage} X {block:Answer} text format-answer{/block:Answer}{block:Chat} text format-chat{/block:Chat}{block:Link} text format-link{/block:Link}{block:Text} text format-text{/block:text}{block:Quote} text format-quote{/block:Quote}{block:Photo} photo format-photo{/block:Photo}{block:Photoset} photo format-photoset{/block:Photoset}{block:Audio} media format-audio{/block:Audio}{block:Video} media format-video{/block:Video}{block:permalinkpage} pp{/block:permalinkpage}">

它包含在{block:IndexPage}{/block:IndexPage}中,因此您仍然可以在其固定链接页面上看到帖子。

接下来,将以下CSS添加到您的主题中。

{block:IndexPage}
.{block:TagPage}x{/block:TagPage}{block:SearchPage}x{/block:SearchPage}dontshow {
   display: none!important;
   margin: 0!important;
   padding: 0!important;
   width: 0!important;
   border: 0!important;
   outline: none!important;
}
{/block:IndexPage}

使用您要隐藏的标记更改“dontshow”。如果您不希望帖子显示在搜索页面或标签页面上,请删除标签页面和搜索页面块。

另请注意,使用{TagsAsClasses}会冒着将标签添加到与主题中的类相对应的帖子的风险(特别是因为您没有自己制作)。