2020

Um template Blogger pode suprir as necessidades iniciais, depois de um tempo a gente quer outras funções, as vezes outro desenho.
Eu vejo muitos casos, em que o internauta sofre para atingir o objetivo. De fato não é algo tão simples, instalar e configurar adequadamente um template. Aqui pretendo compartilhar algumas dicas, de uma maneira geral, por exemplo se tiver uma imagem em cada artigo, todos os templates e aplicativos, gadgets/widgets funcionarão bem, se não tiver imagem, alguns templates terão problema pela falta de tal imagem, então no geral é bom ter uma imagem em cada artigo. Pode ter mais de uma imagem? Sim, sem problema algum, na maioria das vezes os programas irão puxar a primeira imagem do artigo, mesmo que ela não esteja aparente no artigo, para isso pode-se por exemplo usar o estilo display:none em css.
Daí entra o segunda dica, que é ter uma noção básica do html, css e javascript, isso facilitará bastante a vida do internauta que faz uso do Blogger. Entender onde adicionar código, onde se localizam os blocos de código, da pele(skin), do corpo(body), do rodapé(footer), barra lateral(sidebar) e etc.

Outro detalhe que deve ser considerado é a idade do template, geralmente a última versão de um "software" está em teste e é chamada de "beta", isso por conter problemas ainda não resolvidos, significa que o mais novo pode não ser o melhor. Por outro lado não se deve fazer uso de algo muito antigo, com links quebrados de sites que já fecharam as portas e serviços encerrados como o GooglePlus por exemplo.
Um template que está com um ano de vida hoje, tem maiores chances de possuir uma codificação atualizada e com menos problemas para correção.
É quase que impossível estar 100%, pois as coisas mudam muito rápido e se deve considerar que até mesmo grandes sites tem problemas, falhas as vezes pequenas, que passam desapercebidas por muitos, mas que ali estão e para quem é mais detalhista se tornam algo incômodo.
Eu gosto de ver tudo funcionando bem, mas reconheço que nem sempre isso é possível. Tenho um gosto em especial que nem sequer é perceptível ao público, me refiro aqui ao painel administrativo, que é visto apenas pelo Jair, mas que me dá um gostinho quando aparece nas imagens ou nos vídeos, sei que muitos ficam se perguntando, como o painel dele é cheio de tons e gadgets diferentes?

Imagem do painel administrativo layout Blogger Verbratec.

Acredito que a maioria das pessoas, que gostam de blogar, escolhem seus templates apenas pelo desenho, mas tem uns 30% de usuários que gostam de ter funcionalidades à disposição e a tendência é que esse percentual cresça. Para isso os desenvolvedores precisam estar atentos, atualizados e dispostos para atender a demanda.
Penso que há tão pouco disponível, mas de fato não há procura suficiente. O que rege é a lei da oferta e da procura, por isso até hoje, não há suporte ao PHP no Blogger, infelizmente.
Eu dedico algum tempo pesquisando, para poder inovar, mas há alguns "freios" aqui, daí resta escrever algo lamentando a impossibilidade de fazer algo diferente, seguimos usando apenas o feed na alimentação dos gadgets, que já me parecem velhos conhecidos e que por mais criativos que sejamos, possuem as mesmas funcionalidades de anos atrás. Isso é bah!
Para efeitos de estudo e observação, como exemplos de codificação para templates Blogger, poderás acessar essa página.
Os códigos na versão 1 e 2 para um mesmo widget.
Códigos nas versões um e dois para um mesmo widget Blogger.

Por curiosidade, é possível fazer uso de até 999 widgets em um template Blogger, sendo que muitos deles são usados apenas para realizar funções, ficando invisíveis, trabalhando apenas em segundo plano.
Um abraço com o ensejo de um ótimo final de semana e até a próxima!

Gente como é difícil para o leigo, estou bah!


Eu vi no fórum a questão de uma tal dificuldade e fui ver como era, mas foi um tal de isso não dá, isso também não, kkkkkk!

Pra criar a página já não renderizava, daí tive a ideia de publicar sem texto mesmo, ganhei um ponto, aaah!

Lógico que fiz num blog de testes, pois aqui já tem tudo e muito complexo, não cabe nem entrar no assunto. Volto pro "simple" então lembrei que minha filha tem um blog desse "tempo" kkkkkk, fui lá e peguei o código do gadget páginas do Blogger e vim certo que ia fazer em cinco minutos, redondamente enganado. O bom é que ficou divertido de ver como é quando nada dá certo.

Na edição do html em princípio eu nem vi que tinha outra seção com o mesmo identificador, mas uma falha minha é aceitável, deletei a tal "section" e voltei crente no "agora vai" e deu tudo errado, só por esquecimento, onde consigo o identificador de uma página, nesse código antigo, bom, apelei pro feed né, bora lá peguei o idenficador, mas, aconteceu porém de esquecer uma vírgula, então virou uma novela, pois o interpretador do Blogger, te diz tudo, menos que falta uma vírgula.

Na imagem o código, completo mesmo cria a seção(section) o gadget por dentro do html, direto no modelo, é interessante sobretudo para quem está iniciando, criar um blog de testes e praticar isso, criar e ver como funciona a plataforma Blogger.

Pra quem não sabe nada, até dá pra aprender alguma coisa, pra quem já sabe pode se divertir e rir muito!
Depois tudo vira gargalhada, que não resolve chorar, eu espero que seja útil ao menos para uma pessoa, é um mico só meu ou de mim pra você que está lendo, o legal da coisa é que eu poderia deletar o video e fazer outro bem mais rápido, apenas o caminho certo, mas eu gostei do resultado, muito bom pra rir pelo menos!

Enquanto isso esperamos que a engenharia do Google solucione e talvez até venha com algo novo.

Deixe um comentário, me diga se é interessante ver vídeos desse tipo, com a dureza da realidade.

Um abraço e até a próxima!


[ads-post]
Esse vídeo vai render, gargalhadas!

Enquanto eu escrevia aqui, o vídeo estava em upload, mas que bah! O YouTube também está mal das pernas e o vídeo não carrega, 11% em duas horas, vish!

https://www.youtube.com/embed/wttMbRzV4Wc


24 horas depois consegui colocar o código aqui abaixo, este código criará uma seção(section) com o widget de páginas do Blogger, o gadget oficial do Blogger. Escolha o lugar no seu modelo e crie o seu.

Depois de criado o widget, vá para o layout e confira, estando tudo certo volte para o modelo, localize seu widget id='PageList1' e basta adicionar as demais linhas de código para as demais páginas, dentro da tag CDATA, conforme exemplificado abaixo, faz com calma observando todos os detalhes, vírgula, aspas, chaves e etc.

Se já tinha o gadget no seu modelo, ele já está com o css formado, mas se não usava até então, precisa fazer um trabalhinho a mais, colocar o css básico dentro da tag b:skin para melhorar a aparência, vou deixar o código abaixo, mas claro que você pode fazer da sua maneira, isso é só um exemplo.

 

Passado algum tempo, os grandes sites disponibilizaram o modo escuro(dark-mode), alguns navegadores e sistemas operacionais também já possuem.
Não sou bom com 'design' e para implementar o modo escuro, está me faltando apenas escolher as cores que melhor contrastem, mantendo o verde já tradicional.
Os mais curiosos já devem ter percebido no código, que está em desenvolvimento essa parte e portanto assim que possível, haverá uma chave para que o internauta possa escolher como deseja ver esse site.
Chave para ativar o modo escuro.
A preferência do usuário será armazenada, portanto ao navegar pelo site e até mesmo ao retornar ao site, seu modo preferencial será renderizado.
Claro que o padrão será o modo claro, rsrsrs, também é claro que a chave estará sempre ali, sendo possível alternar os estilos em qualquer tempo, conforme seu desejo.
Existe ao menos duas maneiras mais famosas de implementação do recurso em questão, eu optei por fazer sem usar :root num primeiro momento, mas não descarto a possibilidade de usar as variáveis css, num futuro próximo.
Como editar seu código noturno: https://codepen.io/ananyaneogi/pen/zXZyMP?editors=1100


Sou ruim na escolha de cores, mas vou tentar melhorar isso aos poucos.
Caso encontre algo falho, deixe o "feedback" nos comentários e ficarei feliz em responder.
Obrigado por sua visita, um abraço e até a próxima!

Por padrão a barra pegajosa vem ativada neste construtor, para quem ainda não conhece, a função é para manter o conteúdo do artigo, parelho com a barra lateral, não aparecendo aquele espaço vazio, quando o conteúdo do artigo é muito diferente do que consta na barra lateral.
A função faz com que a barra lateral espere o conteúdo do artigo, mantendo um visual mais aprazível.
Querendo desativar a função, acesse o 'layout' Blogger edite o gadget Controle administrativo, colocando o nome da variável 'barrapegajosa' para o "Novo nome do site" e adicione um n no campo "Novo URL do site", click em Adicionar link, depois click em salvar, isso fará com que a barra lateral role solta, juntamente com o artigo.
Querendo o efeito barra pegajosa de volta, delete esse link, ou coloque um y substituindo o n.

Desativa barra pegajosa no template.

Um video simples mostrando como ativa e desabilita essa função no template, conforme já descrito.

[youtube src="GuQ4EvzwVgY"][/youtube]

O objetivo deste estudo compartilhado, é para que outras pessoas possam conhecer um pouco mais, sobre o que pode ser feito com Blogger, quando se tem um "template" com as funções disponíveis.
Um abraço e o meu muito obrigado por sua presença aqui.

Ao abrir o layout do Blogger estará na parte inferior a área Menu principal links ao conteúdo. Nela existem quatro gadgets que foram projetados para receber uma quantia enorme de dados, suprindo as necessidades mais diversas.
O que vou fazer aqui é apenas exemplificar uma das muitas maneiras de configurar alguns links, com este construtor.
No topo do blog/site há dois links, um para termos de uso e o outro para política de privacidade, mas é possível inserir outros seguindo o mesmo método, lembrando que eles fazem parte do "Menu principal" enquanto em telas menores, como smartphones e tablets. Tudo será demostrado no vídeo.
Eu busquei deixar todos mais ou menos na mesma dimensão, então para o gadget Marcadores, selecionei apenas quatro itens: blogger, facebook, json e solda.
Para o segundo gadget, que também é criado automaticamente, na instalação do template, entitulado "Páginas", eu colocarei os links para as páginas que no Blogger chamamos de estáticas, escolhi deixar os seguintes links: configuração, ferramentas, política de privacidade, mapa do site, sobre e termos.
Esses links são introduzidos da forma tradicional, nome do link e url de destino, uma lista de links simples.
O terceiro gadget colocarei um link externo e uma imagem, e o quarto gadget não vou usar nesse momento.


O gadget Menu principal é um gadget do tipo lista de links, apenas trabalhará de uma forma um pouco diferente da tradicional, ficará bem nítido isso no vídeo. Farei minha lista da seguinte forma, lembrando que isso é apenas um exemplo.

Configuração básica do menu principal do template verbratec.
Será quase como aparece na imagem, isso por ter que criar e depois de criado, tem que voltar e editar. Já vi em alguns lugares e me conformo de não estar só na busca pela resolução do problema, o que ocorre é que se deixar chaves ou colchetes, que são usados na criação, eles irão aperecer onde não devem, como ocorreu no Facebook.
Colchetes no Facebook.
Também aconteceu no GMail, esses colchetes não deveriam aparecer ali.
Colchetes no Gmail.
Percebi o problema na pesquisa do Google e até o presente momento não tenho a solução, tudo o que posso fazer é criar com os colchetes, pois o construtor lê o que está aninhado ali, depois edito e retiro os colchetes uma vez que os dados já estarão armazenados. Creio que já deu pra entender o básico da rotina.


Bora pro vídeo então...
[youtube src="FhoPi_8CyoM"][/youtube]

Com certeza muitos dos que aqui chegarem, já conhecem tudo isso e muito mais, eu porém espero é que isso seja útil para aqueles que ainda não sabem como funciona e muitas vezes, compram templates sofisticados mas sem uma documentação edequada, acabam deixando de fazer um melhor uso do software, que dá tanto trabalho ao desenvolvedor.

Anti - caçador curioso de baleia!

Um forte abraço e o meu obrigado por sua presença aqui! Pense em dar aquela curtida para incentivar esse trabalho.

Usando o novo script construtor, nesse template tudo é mais fácil, um exemplo é a inserção da já veterana, caixa de amigos do Facebook, na verdade chamamos de 'plugin', então há uma parte generosa do Facebook, outra do Blogger, e mais uma do construtor, com isso tudo junto, resta ao usuário apenas digitar ou até copiar e colar, umas poucas palavras e a mágica acontece.
Estamos em 2020, as coisas estão evoluindo sempre e nós precisamos estar sempre juntos, não podemos nos atrasar, mas chega de blá, blá, blá.
Aqui foi feito de maneira que "se" adicionar um 'gadget' na footer(rodapé) ou na sidebar(barra lateral).O construtor lê e verifica "se" for do tipo "HTML" e contiver a 'string' FBcaixa e o url facebook.com, faz isso, se não, faz aquilo, kkk, simples assim, veja o vídeo, afinal uma imagem vale mais que mil palavras, já dizia o poeta!





O trabalho prossegue.
Aproveito a oportunidade para lhe convidar, incentive com aquela curtida. Obrigado por sua presença, um forte abraço e o ensejo de uma boa navegação!


[info title="Info message" icon="info-circle"] É realmente difícil encontrar uma comunidade de desenvolvedores de temas do Blogger que tenha uma abertura de código-fonte como eu. Além do fato de que o Blogger não é um serviço de blog aberto, a falta de documentação oficial para os códigos sobre o tema do Blogger nos obriga a gastar muito tempo e energia estudando cada código existente autodidata e sem orientação. Como resultado, as pessoas que conseguem descobrir e / ou encontrar algo novo no mecanismo do Blogger preferem desenvolver e lançar seus temas de forma independente e até furtiva, sem nos contar sobre todas as coisas que vêm fazendo e desenvolvendo o tema que eles criaram. By - Taufik Nurrohman [/info]
Expressões regulares construtor: https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/RegExp

Nesse construtor, temos na homepage, no gadget "Últimas postagens", o link "Mais artigos" em forma de uma barrinha, como vemos na imagem.

Essa função também faz o paginador numérico, neste mesmo gadget, aqui denominado "Últimas postagens" eu escolhi este nome, mas o usuário pode escolher o que lhe convier.
Imagem do paginador numerado.

É possível ao usuário, trocar o modo de apresentação de uma forma muito simples e rápida, veja no vídeo por favor. A função homePageNavi é ativada com y para mostrar o paginador numérico.

[youtube src="TjMyr2n_Cxg"][/youtube]
Com n substituindo o y ou deletando o link, o construtor retorna ao funcionamento padrão, com a barrinha "Mais artigos", é bom salientar que há uma forma fácil de trocar o texto, a cor, e até mesmo de desativar o gadget, tudo feito pelo painel administrativo, através do gadget Controle administrativo.
Tudo em andamento por aqui, espero acrescentar algo que venha a ser útil.
Um forte abraço e até a próxima!

Existe um fator de "autoridade", que é concedida pelo buscador(Google principalmente), ao site. Porém o proprietário ou seu responsável pela manutenção, deve de tempos em tempos verificar e corrigir os 'links' que resultam em erros.
Temos aqui na nossa página de ferramentas, alguns links que podem ajudar, nessa tarefa de localizar e corrigir este e outros erros.
Hoje é dia 17 de outubro de 2020, dia em que fiz a correção de todos os links, alguns foram modificados, outros foram retirados. Tudo isso para manter a experiência de usuário em bom nível e lógico, manter a autoridade verbratec.com.br em dia na pesquisa.

Sobre corrigir links quebrados, erro 404.

Erros do tipo 404 devem ser tratados com atenção, para seu site não sofrer penalização, mas também por ser algo bem chato, quando clica no link esperando um conteúdo "x", toda aquela expectativa é quebrada na hora. Vish! Se torna algo amargo de sorver.
Construa sim, enfeite sua página 404, mas sobretudo, conserte os links, essa é a melhor forma de deixar tudo bem.
Fica o ensejo de uma boa navegação e o meu muito obrigado por sua presença aqui.
Se for sua vontade sinta-se livre para comentar, compartilhar e tal, abraço!

[code type='JavaScript'] <script> //O site de origem já não existe mais garudathemes.blogspot.com $(document).ready(function(){ //redirecionamento function redirect(){ window.location.assign('https://www.verbratec.com.br'); } //verificações function check(){ if($('#copyright-id').length === 0){ redirect(); } else if($('#copyright-link').length === 0){ redirect(); } if($('my-copyright').length === 0){ redirect(); } else if($('#copyright-link').length === 0){ redirect(); } else if($("#copyright-link").attr("href") !== "https://www.verbratec.com.br"){ redirect(); } else if($("#copyright-link").attr("rel") !== "nofollow"){ redirect(); } else if($('#copyright-link').text() !== "Verbratec Premium"){ redirect(); } } //execute ao carregar a página. check(); //execute com intervalos de segundos. setInterval(function () {check()}, 5000); }); </script> [/code]

Só hoje percebi pelo fórum de ajuda, que o modo de inserir o favicon no blog mudou.
Agora é pelas configurações que acessa o link.
Fiz um vídeo para facilitar as coisas.
A funcionalidade é a mesma, foi bem rápido, não ví diferença no processamento.



Isso é o caminho, sem pedras.
As vezes a pessoa quer tudo na hora, mas existe um atraso para o processamento, por isso rolei a página pra cima e abaixo, dando um tempo, alguns segundos foram suficientes.
Em alguns casos é melhor ir tomar um café, tipo quando altera o DNS de um site.
Um abraço e até a próxima!

Um dos problemas que surgiram aqui, já nem sei quando foi, mas com certeza foi o mais difícil de consertar.
Na época eu usava Blogger e Facebook para os comentários e surgiu o Google+, daí surgiu o problema e eu quando dava tempo, tentava consertar. Com tantas tentativas um dia deu certo e não alterei mais nada, tipo "dá medo de mexer no trem". Tempos depois, o relatório do searchconsole, me indicou problemas para rich snippets, isso foi em 2018 e eu marquei com alguns comentários(correção 2018) no template, as alterações que fiz para a correção.
Até aqui tudo bem, mas resolvi atualizar o script principal, troquei o template, no meu modo de ver esses comentários(correção 2018) deveriam ter desaparecido, já que faziam perte do template retirado.

Não tinha ideia de que isso acontecia.
Era para o código antigo ser deletado, ou simplesmente ficar de fora.
O que importa é que o problema nos comentários do Blogger está de volta e com isso o link Responder não funciona.
Pra piorar antes já era um código complexo e dividido em várias partes, agora é ainda mais complexo, então vou deixar o tempo passar e esperar a ideia vir, para ter uma solução.
Sempre é útil o "feedback" do internauta, que pode ser feito ali, pelos comentários, se encontrar um problema, por favor deixe sua mensagem.
Um abraço e o ensejo de uma boa navegação!

A navegação mais usada no Blogger é aquela que pega o arquivo do lado, como todos sabemos o Blogger usa data para organizar os arquivos, então de um lado há algo mais novo, de outro algo mais antigo.
O fato é que essa navegação fica bem interessante quando capturamos a imagem, desses dois arquivos e apresentamos como links no final da postagens, podendo mostrar ou não o título desses mesmos arquivos.
Para quem usa o template "simples" padrão do Blogger é até fácil de fazer as alterações necessárias, com uma boa internet e um pouco de paciência, lembrando que sempre se deve fazer a cópia do template antes de iniciar o procedimento, para que se possa retroceder sem prejuízos caso algo falhe.
Eu sempre usava um tutorial como guia passo a passo, mas infelizmente o autor resolveu retirar, o blog dele agora é fechado, com conteúdo adulto. Por isso vou tentar reproduzir aqui, mais pra me servir de guia no futuro, mas poderá lhe ser útil também.
De primeira posso prometer que, estou ajustando o script principal, o qual interfere em todas as funções do blog/site e portanto deixarei no final dessa postagem o parecer atual, erro, manutenção e sucesso serão as alternativas. Na tentiva de uma melhor condição, vou marcar essa postagem como completa, assim ocultando a coluna lateral, me parece que fica um visual mais aprazível de trabalhar e facilita a concentração no objetivo.
Acima dos comentários, ou abaixo? Mostrar para telefones ou não? Claro que se deve usar condicional Blogger para renderizar apenas nas postagens itens. Para mim o maior problema, kkkk, que fique funcional em tudo.
A pré visualização do Blogger não mostra imagem, então vou ter que publicar para ver como está ficando, vish! Blogger Ki-Bah!

Vou colocar no cabeçalho, acima da tag de fechamento o seguinte código:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
/*<![CDATA[*/
.halaman-kanan,.halaman-kiri{transition:all .3s ease-in-out}
.halaman{margin:0;padding:0;min-height:170px;height:auto}
.halaman-kanan,.halaman-kiri{color:#666;position:relative;background:#000;background:rgba(0,0,0,.6);width:50%;min-height:170px;-moz-box-sizing:border-box;margin:0}
.halaman-kiri{height:auto;float:right;padding:20px 40px 20px 10px;text-align:right;box-sizing:border-box}
.halaman-kanan,.halaman-kiri{-webkit-box-sizing:border-box}
.halaman-kanan{height:auto;float:left;padding:20px 10px 20px 40px;text-align:left;box-sizing:border-box}
.current-pageright,.current-pageleft,.halaman-kanan a,.halaman-kiri a{font-size:16px;font-weight:bold;background:0 0;text-decoration:none;line-height:1.1}
.halaman-kanan a,.halaman-kiri a,.current-pageright,.current-pageleft{color:#fff;}
#blog-pager,.isihalaman-kanan,.isihalaman-kiri{margin:0!important}
.panahkanan,.panahkiri,.halaman-kiri a div:before,.halaman-kanan a div:before{position:absolute;top:50%;margin-top:-8px;font-size:18px!important;}
.panahkiri,.halaman-kiri a div:before{right:10px}
.panahkanan,.halaman-kanan a div:before{left:10px}
.halaman-kanan a:hover,.halaman-kiri a:hover{text-shadow: 1px 1px 2px rgba(150, 150, 150, 1);}
.isihalaman-kanan img,.isihalaman-kiri img{position:absolute;top:0;width:100%;height:100%;z-index:1}
.isihalaman-kanan img{left:0}
.isihalaman-kiri img{right:0}
.halaman-kiri a div, .halaman-kanan a div,.current-pageright,.current-pageleft {position: absolute;bottom: 10px;z-index: 3;width: 100%;padding:0 10px;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}
.halaman-kiri a div,.current-pageright{right:0;padding-right:40px;}
.halaman-kiri a div:before{content:'\f054';font-family: FontAwesome;}
.halaman-kanan a div,.current-pageleft  {left:0;padding-left:40px}
.halaman-kanan a div:before{content:'\f053';font-family: FontAwesome;}
.halaman-kiri a div h6,.halaman-kanan a div h6,.pager-title-right{font-weight:light}
.blog-pager-newer-link:after,.blog-pager-older-link:after{content:"";position:absolute;top:0;right:0;left:0;bottom:0;z-index:2;background:-moz-linear-gradient(top,rgba(63,71,78,0) 0,rgba(63,71,78,0) 21%,rgba(63,71,78,.65) 100%);background:-webkit-linear-gradient(top,rgba(63,71,78,0) 0,rgba(63,71,78,0) 21%,rgba(63,71,78,.65) 100%);background:linear-gradient(to bottom,rgba(63,71,78,0) 0,rgba(63,71,78,0) 21%,rgba(63,71,78,.65) 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#003f474e', endColorstr='#a63f474e', GradientType=0 );transition:all .4s ease-in-out}
.halaman-kanan a:hover:after,.halaman-kiri a:hover:after{opacity:0}
@media screen and (max-width:414px){.halaman-kiri,.halaman-kanan{width:100%;}
}
/*]]>*/
</style>
</b:if>

Bueno! CSS adicionado, segundo o tradutor halaman-kiri é página esquerda, optei por deixar conforme encontrei, se for sua vontade traduzir, sinta-se livre.
Agora vou lá no final do código do modelo e insiro o script, antes de fechar o corpo do documento, lógico:

 <script type="text/javascript">
//<![CDATA[
(function ($) { var newerLink = $('a.blog-pager-newer-link'); var olderLink = $('a.blog-pager-older-link');
$.get(newerLink.attr('href'), function (data) { var thumb = $(data)
.find('.post-body')
.length == 1 ? "<img alt='" + $(data)
.find('.post-title')
.text() + "' src='" + $(data)
.find('.post-body img:first').attr('src', function(i, src) {return src.replace(/.*?:\/\//g , "//").replace( 's1600', 's386' );})
.attr('src') + "' class='pager-thumb' width='386' height='170'/>" : "";
newerLink.html(thumb + '<div><h6>Próximo</h6><h5>' + $(data)
.find('.post-title')
.text() + '</h5></div>') }, "html");
$.get(olderLink.attr('href'), function (data2) { var thumb2 = $(data2)
.find('.post-body')
.length == 1 ? "<img alt='" + $(data2)
.find('.post-title')
.text() + "' src='" + $(data2)
.find('.post-body img:first').attr('src', function(i, src) {return src.replace(/.*?:\/\//g , "//").replace( 's1600', 's386' );})
.attr('src') + "' class='pager-thumb' width='386' height='170'/>" : "";
olderLink.html(thumb2 + '<div><h6>Próximo</h6><h5>' + $(data2)
.find('.post-title')
.text() + '</h5></div>') }, "html") })(jQuery);
//]]>
</script>

Ir até:
  <b:includable id='nextprev'>...</b:includable>
  
E substituir por este código:
 <b:includable id='nav-post'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='halaman'>
<div class='blog-pager' id='blog-pager'>
<div class='halaman-kiri'>
<div class='isihalaman-kiri'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'>&#171;Próximo artigo</a>
</span>
<b:else/>
<span class='current-pageright'><i class='fa fa-chevron-right panahkiri'/><span class='pager-title-right'>Próximo</span><br/>Este é o artigo mais recente.</span>
</b:if>
<div class='clear'/>
</div>
</div>
<div class='halaman-kanan'>
<div class='isihalaman-kanan'>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'>Artigo anterior&#187;</a>
</span>
<b:else/>
<span class='current-pageleft'><i class='fa fa-chevron-left panahkanan'/><span class='pager-title-right'>Anterior</span><br/>Este é o último artigo.</span>
</b:if>
<div class='clear'/>
</div>
</div>
</div>
<div class='clear'/>
</div>
</b:if>
</b:includable>
<b:includable id='nextprev'>
<b:if cond='data:blog.pageType != &quot;static_page&quot; and data:blog.pageType != &quot;item&quot;'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>
<div class='mobile-link-button' id='blog-pager-home-link'>
<a class='home-link' expr:href='data:blog.homepageUrl' expr:title='data:homeMsg'><data:homeMsg/></a>
</div>
<div class='mobile-desktop-link'>
<a class='home-link' expr:href='data:desktopLinkUrl' expr:title='data:homeMsg'><data:desktopLinkMsg/></a>
</div>
</div>
</b:if>
<div class='clear'/>
</b:includable>
 
Terminando!
Pra finalizar coloco o include abaixo do artigo, essa parte varia bastente de um template para outro.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:include name='nav-post'/>
</b:if>
Para um exemplo simples, dentro da includable post e abaixo do artigo:
 
 <b:includable id='post' var='post'>
<article class='post hentry'.............
..........
..........
..........
</article>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:include name='nav-post'/>
</b:if>
</b:includable>
  
[success title="Success message" icon="check-circle"] Tivemos sucesso aqui, sim, mas em partes. [/success] O trabalho continua, abraço e até a próxima! Obrigado por sua presença, o código usado aqui abaixo é o desta postagem, levemente modificado, mas com a mesma lógica.
Se seu template tiver uma codificação mais nova coloque apenas a linha include name nave-post para isSingleItem como na imagem abaixo.

[full-post]

Imagem do novo 'design'do blog verbratec.
Aqui alguns testes das funcionalidades que já são antigas, mas que procurei deixar mais "enxutas" por assim dizer.
A expectativa gira em torno de um carregamento mais tranquilo, embora o que a gente quer na verdade é uma internet eficaz, que possibilite trafegar a quantia de dados que nos seja aprazível.
Este é um desenho MKRdezign que admiro tem algum tempo, acompanhei a evolução e o desenvolvimento das funcionalidades. Hoje o 'json' é o melhor que o Blogger nos oferece, torna tudo rápido dentro do site.
Caso encontre algo errado aqui, entre em contato, e-mail é uma forma, deixar um comentário também chegará ao meu e-mail, se preferir curtir e entrar em contato usando Facebook, sem problemas!

Algumas partes ainda por trabalhar, mas o básico está pronto.
Eu preciso ir, um abraço pra você e o meu muito obrigado pela sua presença aqui!



Dica de contexto: Este é apenas um demostrativo de uso de tooltip informações adicionais. Você pode inserir fotos, videos ou simplesmente uma frase a mais para orientar seu discurso. Este é um artigo para se mostrar sem a "sidebar", logo; não há nada errado aqui. Basta marcar full-post e 'voi-lá'!
[full-post]

Se isso tudo vai bem até aqui podemos testar o conteúdo exclusivo [lock] para quem é leitor que participa, comenta, curti, compartilha e etc. [/lock] Então logo continuo e espero um resultado positivo.

Olá pessoas do planeta Terra!
Percebi como meu polegar estava adaptado, ocorreu naturalmente, sem esforço algum, com o passar do tempo ele foi curvando.
Então passei a observar outros violonistas, não apenas o polegar evidentemente, 'kkk' eu até penso que a maioria sofre alterações no corpo, embora muitas delas sejam boas, preciso estar atento.



Talvez queira saber, quanto tempo demora, sei que todo iniciante faz esse questionamento. Posso dizer que somos indivíduos e portanto cada um tem seu tempo, serão alguns anos provavelmente, não menos que um ano.

Imagem de Mattahn McNair - Não sei o motivo, mas ele encerrou o canal no YouTube https://www.youtube.com/channel/UCDOMb4aG7rPmyBUQqQGutzg e retirou as postagens do Facebook, praticamente sumiu da rede, restam poucas citações.
O vídeo original também está indisponível, lógico: https://www.youtube.com/watch?v=oCY6_bGUlFo

Se você começa estudar música ao violão, com sete anos de idade, quando com doze anos já terá todas as adaptações necessárias para uma bela execução.
Não se preocupe com o desnecessário, faça com gosto, seja divertido, amável, música é sentimento além da arte, transcendental.

Um abraço e o ensejo de sucesso, boa saúde e paz!




Testando a função do Template para renderizar a 'sidebar' na esquerda e o artigo na coluna direita.

Jair de Jesus

Estudante de HTML, CSS, json, Blogger e tal.{picture#https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_X8kjnFQ6gqz7mpAsGYmndUBnVFuhUwtt2T4rjn6FnitkZZUulhSIzmhVsYGWIHULCAqOObPV3xw9ru-dSPBPuWhT9PGtv-XEK1A5I6l8bJtjEjRsYYleMWoCvtjOtVhDRusviMdEFBU/s35/jair.jpg}{facebook#https://facebook.com/verbratecajuda}{youtube#https://youtube.com/@estudoviolaoclassico} {twitter#https://twitter.com/verbratecajuda}

نموذج الاتصال

الاسم

بريد إلكتروني *

رسالة *