23.8.17

Comentários com google+ e blogger


Ohayou, minna ^^ 

O tutorial  de hoje é baseado num tuto do Bunny Crazy, só com ligeiras alterações para ficar um modelinho meu, ou seja este: www. O processo que vou mostrar é idêntico, mas o balãozinho atrás é uma imagem minha e vou explicar à minha maneira, assim como sugerir modelos de comentários que já publiquei aqui. O blogger, por omissão, apresenta sempre uma forma própria de comentar - algumas pessoas optam por colocar o modelo do google+, contudo, até agora sempre tinha julgado que necessariamente se tinha de optar por um ou outro. Contudo, graças ao tutorial da Wendy, descobri que dá para conjugar as duas formas, pelo que os leitores podem comentar pela maneira que lhes agrada mais - e agradar aos leitores é a melhor forma de fazer o blog crescer.

Prévia: www

Tutorial:

Procure por </head> e adicione em cima:
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js' type='text/javascript'/>

Agora procure por:
<b:include data='post' name='post'/>
E troque por:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
#comments, #gplus-comments-visibility {display:none;}
.comments-icons {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBqcEpWqqM7khsdCMB5XLam9YTPG0aPYPzI5uiG4BsckNTjlCxHwDQ5LF0t9JjzG2XrMguUI_ivFPWXlVEhrJJNCSIs7ywyTnXPzrdlAY_be0fkqMIBinyI_I-KZqmpJAGT0nCjUYdS7M/s1600/000.png) no-repeat; border-radius: 5px; font-size: 20px; font-family: Berkshire Swash; color: #8a3e40; margin: 20px 0px -20px -10px;font-weight: bold; padding: 18px 15px 0; height: 70px; }
.comments-icons a img {vertical-align: middle;}</style>
<div class='comments-icons'>
Comentar com: <a class='show-hide-comments' href='javascript:void();' onclick='$(&quot;#gplus-comments-visibility&quot;).slideToggle();$(&quot;#comments&quot;).hide();'><img class='gplus-https://www.blogger.com/blogger.g?blogID=3224560834634523712#editor/target=post;postID=6080401536756351522;onPublishedMenu=allposts;onClosedMenu=allposts;postNum=0;src=linkicon' height='25' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPRjmyBUCKn95srTCHdIk6vGS06kGEkED33B2zsmdu_ozzxmWSLm2erE2YHNwH-g1kgnt8hplDmKNLNN0OzpopFfORvAMxSN6THkz3QlEmucUF3d4w-BpDJYYYVTyyATyHtZ4vFZkX5nnQ/s1600/google-plus-logo.png' width='25'/></a> ou <a class='show-hide-comments' href='javascript:void();' onclick='$(&quot;#comments&quot;).slideToggle();$(&quot;#gplus-comments-visibility&quot;).hide();'><img class='blogger-icon' height='25' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiiGHI7g7x-8lcZ5dTblElR4G2XtDlg6rZhT0h8pqgpMzgCn4IJNXMstgeyFhD9CzHxmp0jghZUzSa1qcrVE6eNFQKAcYQQ4byF3JkrgC6KQc8c6sXo-aTk93h-naYRKbC8VMXKXZlDtxb/s1600/blogger-logo.png' width='25'/></a>
</div>
<div id='gplus-comments-visibility'>
<div class='g-comments' data-first_party_property='BLOGGER' data-view_type='FILTERED_POSTMOD' data-width='745' expr:data-href='data:post.url'/>
</div>  
</b:if>

Explicações:

  • Vai notar na prévia que quando se dirige ao fim do post, não aparece comentário nenhum. Isto porque mesmo para ver os comentários já feitos, é preciso selecionar se queremos visualizá-los com google+ ou blogger. 
  • O que destaquei a itálico é a formatação do texto que permite escolher como se quer comentar, isto é, imagem de fundo, fonte, etc...
  • Em sublinhado, está a mensagem "comentar com", para o caso de quererem deixar a frase mais bonitinha.
  • O que está em negrito é a largura dos comentários em formato google +, que é a única coisa personalizável.
  • Os comentários em formato blogger têm de ser personalizados normalmente, aqui todos os tutoriais/modelos que publiquei até agora, do mais recente para o mais antigo: #uvas e laranjas #kawaii #roots #galaxy #delicate #pastel candies #inverted flower #too sweet
  • Mude a fonte, fundo e frase do "comente com" se quiser, credite o meu modelo se usar, se não credite o tutorial do Bunny Crazy por ser o original.
Era isso. Não tenho dúvidas de que funciona sempre.

1 comentário: