na maioria dos sites que vai encontrar apenas o código JavaScript e HTML tag para o widget posts relacionados. Após adicionar o código em seu blog, você pode ver apenas uma lista de posts relacionados, sem setas ou css estilo. Então eu quis incorporar tanto para fazer as ligações widget está lindo.
Primeiro vamos ver o JavaScript e HTML usual Tag.Step 1: Adicione o seguinte código Javascript abaixo de]]></ b: skin>, thats entre ]]></ b: skin> e </ head>.
<script type='text/javascript'>
//<![ CDATA [relatedTitles = new Array (); relatedTitlesNum var = 0; relatedUrls = new Array (); related_results_labels function (json) (for (var i = 0; i <json.feed.entry.length ; i + +) (var entrada json.feed.entry = [i]; t relatedTitles relatedTitlesNum [] = entry.title. $ for (var k = 0; k <entry.link.length; k + +) (if (entry. [link k]. rel == 'alternate') (relatedUrls [relatedTitlesNum] = entry.link [k]. href; relatedTitlesNum + + break;)))) function removeRelatedDuplicates () (var tmp = new Array (0); var tmp2 = new Array (0); for (var i = 0; i <relatedUrls.length; i + +) (if (! contains (tmp, relatedUrls [i])) (tmp.length + = 1; tmp [tmp.length - 1] = relatedUrls [i]; tmp2.length + = 1; tmp2 [tmp2.length - 1] = relatedTitles [i];)) relatedTitles = tmp2; relatedUrls = tmp;) function contains (a, e) (for (var j = 0; j <a.length; j + +) if (a [j] == e) return true; return false;) printRelatedLabels function () (var r = Math.floor ((relatedTitles.length - 1) * Math.random ()); var i = 0; document.write ( '<ul>'); while (i <relatedTitles.length & & i <20) (document.write ( '<li> <a href = " '+ relatedUrls [r] +' "> '+ relatedTitles [r] +' </ a> </ li> '); if (r <relatedTitles.length - 1) (r + +;) else (r = 0;) i + +;) document.write ( '</ ul>');) //]]> </ script>
Etapa 2: Verificar expandir widgets e procure values='data:post.labels' <b:loop var='label'>, Agora copie e cole o seguinte código em azul entre <b: loop values = 'data: post. var rótulos '=' label '> e </ b: loop values='data:post.labels' <b:loop> var='label'>
<a expr:href='data:label.url' rel='tag'> <data:label.name/> </ a> </ b: if cond = 'data: label.isLast! = "true"' >, </ b: if> <b:if cond='data:blog.pageType == "item"'> expr <script: src = "/ feeds/posts/default/- /" + dados : label.name + "? alt = json-in-script & callback = related_results_labels & max-results = 5" "type =" text / javascript '/> </ b: if> </ b: loop>
personalizar o texto na cor verde para mostrar como muitas ligações que você deseja.
Passo 3: Agora, cole o script a seguir o código logo abaixo
<p> <data:post.body/> </ p>.
Código: <script type='text/javascript'> removeRelatedDuplicates (); printRelatedLabels (); </ script>
É isso, agora olhar para a página, ele será parecido com este
Você pode ver, não há um estilo, eu quis fazer parecer bonito. Então eu fiz as seguintes alterações. Ambos os passos 1 e 2 são os mesmos, apenas em três etapas fazer algumas mudanças.
<div id='related-posts'> <h2> Outros Posts recomendado nesta categoria </ h2> <script type='text/javascript'> removeRelatedDuplicates (); printRelatedLabels (); </ script> </ div> agora seu tempo para adicionar da CSS para esta seção div. / *- (Widget Related posts abaixo-posts) -* / # relacionadas-posts (float: left; width: 450px; height: 100%; min-height: 100%; padding-top: 5px; padding-left: 5px;) # posts relacionados. widget (padding-left: 6px; margin-bottom: 10px; background-color: # FFF) # posts relacionados. Widget h2, # relacionados posts h2 (font-size: 1.6em; font-weight: bold; color: # 0000FF; font-family: Georgia, "Times New Roman", serif Times,; margin-bottom: 0.75em; margin-top: 0em; padding-top: 0em;) # posts relacionados a (color: # A10000;) # posts relacionados a: hover (color: # A10000) # relacionadas postos ul (list-style-type: none; margin: 0 0 0px 0; padding: 0; text-decoration: bold; font-size: 15px; text-color: # 000000) # relacionadas postos ul li (background: transparent url (http://img152.imageshack.us/img152/ 3756/bulletzc2.gif) no-repeat; display: block; list-style-type: none; margin-bottom: 13px; padding-left: 30px; padding-top: 0px;)
Agora olhe novamente a página, e salve.
.png "English"){kind=small}
Postagens
0 comentários:
Postar um comentário
seja bem vindo ao mundo do doutorblogs, e sendo asim espéro ser merecedor de suas amizades e lhe convido para visitar mais e ser um dos Seguidor de nosso blogs.
atenciosamente douotrblogs.