Скрыть отмеченные сообщения на странице Tumblr

Question

Скрыть отмеченные сообщения на странице Tumblr

Хорошо, вот и сделка. Я искал около недели на нескольких сайтах, в том числе и на том, как скрыть специально помеченные записи со страницы индекса и страницы с тегами из моего блога на Tumblr. Чтобы сделать это проще, имейте в виду, что у меня есть некоторые знания html & css, так как это моя 4-я тема Tumblr, которую я создал в течение года, и с течением времени мне становится лучше. Итак, чтобы не тратить свое время, я уже неоднократно пробовал эти методы:

    1. <div id="posts {TagAsClasses}"></div>
    2. <div class="posts {TagAsClasses}"></div>
    3. {block:Posts}
       {block:HasTags}{block:Tags}<span class="tagged-{URLSafeTag}">{/block:Tags}{/block:HasTags}
       (*post content would go here*)
       {block:HasTags}{block:Tags}</span>{/block:Tags}{/block:HasTags}
       {/block:Posts}

Ничто из этого не сработало. Первоначально у меня был селектор идентификатора для содержимого публикации, но я изменил его на класс, поскольку каждый раз, когда я вставляю {TagAsClasses}, он портит всю страницу и публикует div, чтобы он больше не соответствовал CSS.

Когда я попробовал класс, моя страница выглядела точно так же, полностью игнорируя {TagAsClasses}.

Когда я попробовал третий метод, мне пришлось использовать это для CSS:

    .tagged-HIDDEN {
    {block:IndexPage}
    display:none !important;
    {/block:IndexPage}
    {block:TagPage}
    display:inline !important;
    {/block:TagPage}
    }

Конечно, "HIDDEN" - это любой тег, который я вставляю в сообщения, которые я хочу скрыть. Когда я делаю это, используя "! Важное" (это было то, что мне было приказано сделать из другого блога, который я посетил), мой блог даже не загружается, когда я попадаю на страницу, на которой есть сообщения, которые я хочу скрыть (я использую нумерация страницы). Когда я вычеркиваю "! Важно", мой блог загружается, но отмеченные сообщения будут отображаться, только с немного запутанным CSS.

Я перепробовал все, я даже пытался изменить

    <span class> to <span id>

после того как я изменился

    <div id posts> to <div class>

потому что я думал, что интервал станет сильнее и сработает, но в итоге я получил то же самое, что и когда использовал "! Важно", как я упоминал ранее.

Итак, теперь, когда вы увидели все варианты, которые я пробовал, вот мой полный html/css моего блога:... ёℓ§εå...............

<meta name="color:Background" content="#000000">
<meta name="color:Primary Color" content="#000000">
<meta name="color:Secondary Color" content="#000000">

<meta name="color:Tertiary Color" content="#000000">
<meta name="color:Quaternary Color" content="#000000">
<meta name="color:Quinary Color" content="#000000">

<meta name="font:Sidebar Text" content="" />
<meta name="font:Posts Text" content="" />

<meta name="text:Sidebar Width" content="" />
<meta name="text:Sidebar Title Size" content=""/>
<meta name="text:Sidebar Description" content="" />

<meta name="image:Sidebar" content="" />
<meta name="image:Background" content="" />





<style>
html {

    background: -webkit-linear-gradient(top,{color:Background},white);
    background-attachment: fixed;
}
body {

}

#content {
    margin: 10px 0px 10px 260px;
    width: 1020px;
}

#content blockquote {
    border-left: solid black 1px;
    margin: 0px;
    padding-left: 10px;
    max-width: 100%;

}

    img {
    border: 0;
    max-width: 100%;
}

#content #posts {
    background-color: rgba(255,255,255,0.7);
    width: 250px;
    padding: 10px;
    margin-top: 20px;
    margin-bottom: 20px;
    margin-left: 10px;
    margin-right: 10px;

    {block:PermalinkPage}
    width: 800px;
    {/block:PermalinkPage}
}

#content #posts .title {
  font-size: 15px;
  font-family: {font:Posts Text};
  color: {color:Primary Color};
}

#content #posts .text {
  font-size: 10px;
  font-family: {font:Posts Text};
  color: {color:Tertiary Color};
  max-width: 100%;
}

#content #posts .container {
    float: left;
}

#content a {
    text-decoration: none;
    color:{color:Quinary Color};
}




#posts .date {
    margin-top: 40%;
    margin-left: 40%;
}

#sidebar {
    font-family: {font:Sidebar Text};
    width: {text:Sidebar Width}px;
    float: left;
    position: fixed;

}

#sidebar .title {
    font-size: 30px;
    text-align: center;
}

#sidebar .title a {
    text-decoration: none;
    color: {color:Primary Color};
}

#sidebar .title a:hover {
    color: {color:Quaternary Color};
}

#sidebar .image {
    width: 250px;
    height: auto;
    border-radius: 100%;
}

#sidebar .description {
    font-size: {text:Sidebar Description}px;
    text-align: center;
    color: {color:Secondary Color};
}
#sidebar .links {
    margin-top: 10px;
    text-align: center;
}

#sidebar .links a {
    text-decoration: none;
    color: {color:Tertiary Color};
}

#sidebar .links a:hover {
    color: {color:Quaternary Color};
}

#sidebar .navigation {

}

#sidebar .navigation a {
    text-decoration: none;
    color: {color:Quinary Color};
}

#like_button {
    float:right;
    opacity: 0;
    position: absolute;
    display: inline-block !important;
    vertical-align: middle;
    margin-left: 75px;
    top: 50%;
    transition: .2s ease-in-out; 
   -moz-transition: .2s ease-in-out; 
   -webkit-transition: .2s ease-in-out;
   }

#reblog_button {
    float:right;
    opacity: 0;
    position: absolute;
    display: inline-block !important;
    vertical-align: middle;
    margin-left: 155px;
    top: 50%;
    transition: .2s ease-in-out; 
    -moz-transition: .2s ease-in-out; 
    -webkit-transition: .2s ease-in-out;
    }

#notecount {
    float:right;
    opacity: 0;
    position: absolute;
    display: inline-block !important;
    left: 20%;
    top: 60%;
    transition: .2s ease-in-out; 
    -moz-transition: .2s ease-in-out; 
    -webkit-transition: .2s ease-in-out;
    font-family: {font:Sidebar Text};
    font-size: 10px;
}

#date {
    float:right;
    opacity: 0;
    position: absolute;
    display: inline-block !important;
    left: 60%;
    top: 60%;
    transition: .2s ease-in-out; 
    -moz-transition: .2s ease-in-out; 
    -webkit-transition: .2s ease-in-out;
    font-family: {font:Sidebar Text};
    font-size: 10px;
}

#posts .postnotes {
    font-family: {font:Posts Text};
}

#posts .info {
    background: rgba(255,255,255,0.8);
    opacity: 0;
    position: absolute;
    transition: .2s ease-in-out; 
    -moz-transition: .2s ease-in-out; 
    -webkit-transition: .2s ease-in-out;
    width: 250px;
    bottom: 14px;
    top: 10px;
}

#posts:hover .info {
    opacity: 1;
    {block:PermalinkPage}
    opacity: 0;
    {/block:PermalinkPage}
}

#posts:hover #like_button {
    opacity: 1;
}

#posts:hover #reblog_button {
    opacity: 1;
}

#posts:hover #notecount {
    opacity: 1;
}

#posts:hover #date {
    opacity: 1;
}



</style>

<script type="text/javascript"   src="http://static.tumblr.com/d0qlne1/DiAl6ekb7/jquery-1.4.2.min.js"></script>
<script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"> </script>

<script type="text/javascript">
$(window).load(function () {
$('#content').masonry({
itemSelector : ".container",
},
function() { $('#content').masonry({ appendedContent: $(this) }); }
);
});
</script>
</head>


<body>

<div id="sidebar">
<img class="image" src="{image:Sidebar}" />
<div class="title"><a href="{blogURL}">{Title}</a></div>

<div class="description">{block:Description}{Description}{/block:Description}</div>


<div class="links">
{block:AskEnabled}<a href="/ask">Ask</a>{/block:AskEnabled}
{block:SubmissionsEnabled}<a href="/submit">Submit</a>{/block:SubmissionsEnabled}
{block:HasPages}{block:Pages}<a href="{url}">{Label}</a>{/block:Pages}{/block:HasPages}
<a href="/dashboard">Dashboard</a>
</div>

<div class="navigation">
{block:Pagination} 
{block:NextPage}<p id="page_nav"><a style="float:left" href="{NextPage}"  id="next">Previous</a>{/block:NextPage}
{block:PreviousPage}<a style="float:right" href="{PreviousPage}">Next</a></p>{/block:PreviousPage}
{/block:Pagination}
</div>
</div>


<div id="content">
{block:Posts}

<div id="posts">

<div class="info">
<div id="like_button">{likebutton}</div>
<div id="reblog_button">{reblogbutton color="grey"}</div>
<div id="notecount"><a href="{Permalink}#notes">{NoteCountWithLabel}</a>    </div> <div id="date"><a href="{Permalink}">{TimeAgo}</a></div>
</div>


<div class="container"> 
{block:Text}
{block:Title}<div class="title">{Title}</div>{/block:Title}
<div class="text">{Body}</div>

<div class="postnotes">
{block:PostNotes}{PostNotes}{/block:PostNotes}
</div>


{/block:Text}
</div> 

<div class="container"> 
{block:Quote}
<div class="title">"{Quote}"</div>
{block:Source}
<div class="text">{Source}</div>{/block:Source}

<div class="postnotes">
{block:PostNotes}{PostNotes}{/block:PostNotes}
</div>
{/block:Quote}
</div>

<div class="container"> 
{block:Photo}
<img src="{PhotoURL-250}" />

<div class="postnotes">
{block:PostNotes}{PostNotes}{/block:PostNotes}
</div>

{/block:Photo}
</div>

<div class="container"> 
{block:Photoset}
{Photoset-250}

<div class="postnotes">
{block:PostNotes}{PostNotes}{/block:PostNotes}
</div>

{/block:Photoset}
</div>

<div class="container"> 
{block:Video}
{Video-250}

<div class="postnotes">
{block:PostNotes}{PostNotes}{/block:PostNotes}
</div>
{/block:Video}

</div>

<div class="container"> 
{block:Audio}
{AudioPlayer}

<div class="postnotes">
{block:PostNotes}{PostNotes}{/block:PostNotes}
</div>
{/block:Audio}
</div>

<div class="container">     
{block:Answer}
<div class="title">{Question}</div>
<div class="text">~{Asker}</div>
<div class="text">{Answer}</div>

<div class="postnotes">
{block:PostNotes}{PostNotes}{/block:PostNotes}
</div>
{/block:Answer}
</div>

<div class="container"> 
{block:Chat}
{block:Title}{Title}{/block:Title}
{block:Lines}
{block:Label}<strong>{Label}</strong>{/block:Label}
{Line}
{/block:Lines}

<div class="postnotes">
{block:PostNotes}{PostNotes}{/block:PostNotes}
</div>
{/block:Chat}
</div>

<div class="container"> 
{block:Link}
<a href="{URL}">{Name}</a>
{block:Description}{Description}{/block:Description}

<div class="postnotes">
{block:PostNotes}{PostNotes}{/block:PostNotes}
</div>
{/block:Link}
</div>

</div>

{/block:Posts}
</div>

</body>
</html>

Не обращайте внимания на отсутствующие заголовки и HTML-теги!D0CTYPE, они в моем блоге, они просто не будут отображаться здесь.

1

html css design tumblr tumblr-themes

Источник

user5245858 20 авг '15 в 21:51

1 ответ

Другие вопросы по тегам html css design tumblr tumblr-themes

user4571348 26 окт '15 в 05:46 2015-10-26 05:46 · Answer 1 · 2015-10-26 05:46

Вот что я сделал, в основном я использовал мета-теги tumblr, чтобы различать CSS в зависимости от страницы.

<head>
//Your head and CSS stuff here
{block:IndexPage}
<style>
.BLOCKME {display:none !important;}
</style>
{/block:IndexPage}
</head>

Это заблокирует любой пост с тегом BLOCKME от отображения на главной странице, вы также можете использовать {block:TagPage}{block:PermalinkPage} а также {block:SearchPage}

Примечание, ваши посты также должны содержать class="{TagsAsClasses}"