Dois hacks que vão dar um toque especial e bacana a seu blog, além de deixa-lo mais eficiente e economizar espaço.
Vá até o "Modelo de seu blog", clique em "Editar HTML"
Hack para o template do Blogger, implementado em abril de 2013.
Procure por <b:skin>...</b:skin> se não encontrar procure por ]]></b:skin>
Abaixo dele, cole o próximo código:
<style>
.sidebar li{list-style-type:none; }
a.loadpost{
display:block;
padding:8px;
background-color:#cc0000;
color:white;
text-transform:capitalize;
text-decoration:none
}
.labelnyatas a{
list-style-type:none;
display:inline-block;
padding:0 5px;height:17px;
font-size:8px;
line-height:17px;
text-decoration:none;
background-color:#cc0000;
color:white
}
.bwh-title .comment-link:hover,a.loadpost:hover,.labelnyatas a:hover{
background-color:#cc0000}
</style>
<style>
/* Label =====================*/
.labelnyatas a{
list-style-type:none;
display:inline-block;
padding:0 5px;
height:17px;
font-size:8px;
line-height:17px;
text-decoration:none;
background-color:#cc0000;
color:white
}
.bwh-title .comment-link:hover,a.loadpost:hover,.labelnyatas a:hover{
background-color:#cccccc;
font-family: Sans-serif Courier New;
font-size: 18px;
}
.bwh-title .comment-link::after{
content:"";
width:0;
height:0;
border-width:2px 4px;
border-style:solid;
border-color:#808080 #808080 transparent transparent;
position:absolute;
top:100%;
right:0
}
.menu-xitem{
list-style-type:none;
font-size: 14px;
height:35px;
border-bottom:5px solid #000000;/*cor da linha */
margin-bottom:20px;
color:white
}
.menu-xitem .xitem1{
list-style-type:none;
height:30px;
position:relative;
float:left
}
.menu-xitem .liat{
font-size: 18px;
display:block;
line-height:35px;
padding:0 20px 0 10px;
float:left;
background-color:#cc0000; /*cor botão*/
text-transform:uppercase;
color:white;
position:relative;
text-decoration:none
}
#labelxnya{
list-style-type:none;
position:absolute;
width:230px;
top:100%;
z-index:3;
background-color:#000000;/* cor fundo menu*/
display:none
}
#labelxnya.hidden{display:none}
.menu-xitem .xitem1:hover #labelxnya.hidden{
display:block
}
#labelxnya a{
list-style-type:none;
color:white;text-decoration:none;
display:block;padding:0 10px;line-height:25px
}
#labelxnya a:hover{
border-left:4px solid #cc0000
}
.menu-xitem .liat::before,.menu-xitem .liat::after{
content:"";width:0;height:0;
border-width:4px 4px;
border-style:solid;
border-color:white transparent transparent transparent;
position:absolute;
top:14px;
right:8px
}
.menu-xitem .liat::after{
border-width:15px 6px;
border-color:transparent transparent black black;
left:100%;
top:0;
right:auto
}
</style>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<script type='text/javascript'>
//<![CDATA[
function resizeThumb(e,b){var c=document.getElementById(e),d=c.getElementsByTagName("img");for(var a=0;a<d.length;a++){d[a].src=d[a].src.replace(/\/s72\-c/,"/s"+b+"-c");}}
window.labelnyacx=(function(){var a=function(d){var e=d||{},c=e.url_blog||window.location.host,b=e.id_labelcontent||"#labelxnya";$.ajax({url:"http://"+c+"/feeds/posts/summary?max-results=0&alt=json-in-script",type:"get",dataType:"jsonp",success:function(h){var f=h.feed.category,j="";if(f!==undefined){j="<ul class='subnya-xitem'>";for(var g=0;g<f.length;g++){j+='<li><a href="/search/label/'+encodeURIComponent(f[g].term)+'" target="_blank">'+f[g].term+"</a></li>"}j+="</ul>";$(b).html(j)}else{$(b).html("<span>No Label!</span>")}},error:function(){$(b).html("<strong>Error Loading Feed!</strong>")}})};return function(b){a(b)}})();
//]]>
</script>
</b:if> </b:if>
Salve !
Procure agora por </body>
Acima dele cole o próximo código.
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<script type='text/javascript'>
//<![CDATA[
resizeThumb("main",250);
labelnyacx();
(function($) {
var loadingGif = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjX7x9TRu-Ptc8Nwzj-RcA-rOZtKa4av0E4ioV9AGeTP-97zM7Lozh_Slihg5zuEmHvHi8aaJbLPyZfZ8B0ouy56Q9r1x6RgJ-PLY7vaD_ofQ9HaJyqvHehwKBIMbC-uYLAFU8o33DGfCpM/s32/ajax-loader.gif';
var olderPostsLink = '';
var loadMoreDiv = null;
var postContainerSelector = 'div.blog-posts';
var loading = false;
var win = $(window);
var doc = $(document);
// Took from jQuery to avoid permission denied error in IE.
var rscript = /<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi;
function loadDisqusScript(domain) {
$.getScript('http://' + domain + '.disqus.com/blogger_index.js');
}
function loadMore() {
if (loading) {
return;
}
loading = true;
if (!olderPostsLink) {
loadMoreDiv.hide();
return;
}
loadMoreDiv.find('a').hide();
loadMoreDiv.find('img').show();
$.ajax(olderPostsLink, {
'dataType': 'html'
}).done(function(html) {
var newDom = $('<div></div>').append(html.replace(rscript, ''));
var newLink = newDom.find('a.blog-pager-older-link');
if (newLink) {
olderPostsLink = newLink.attr('href');
} else {
olderPostsLink = '';
loadMoreDiv.hide();
}
var newPosts = newDom.find(postContainerSelector).children('.date-outer');
$(postContainerSelector).append(newPosts);
resizeThumb("main",250);
// Loaded more posts successfully. Register this pageview with
// Google Analytics.
if (window._gaq) {
window._gaq.push(['_trackPageview', olderPostsLink]);
}
// Render +1 buttons.
if (window.gapi && window.gapi.plusone && window.gapi.plusone.go) {
window.gapi.plusone.go();
}
// Render Disqus comments.
if (window.disqus_shortname) {
loadDisqusScript(window.disqus_shortname);
}
// Render Facebook buttons.
if (window.FB && window.FB.XFBML && window.FB.XFBML.parse) {
window.FB.XFBML.parse();
}
loadMoreDiv.find('img').hide();
loadMoreDiv.find('a').show();
loading = false;
});
}
function init() {
if (_WidgetManager._GetAllData().blog.pageType == 'item') {
return;
}
olderPostsLink = $('a.blog-pager-older-link').attr('href');
if (!olderPostsLink) {
return;
}
var link = $('<a class="loadpost" href="javascript:;">Leia mais postagens</a>');
link.click(loadMore);
var img = $('<img src="' + loadingGif + '" style="display: none;">');
loadMoreDiv = $('<div style="text-align: center; font-size: 140%;"></div>');
loadMoreDiv.append(link);
loadMoreDiv.append(img);
loadMoreDiv.insertBefore($('#blog-pager'));
$('#blog-pager').hide();
}
$(document).ready(init);
})(jQuery);
//]]>
</script>
</b:if></b:if>
Agora procure por: <div class='columns-inner'>
Abaixo dele cole o próximo código
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<div class='menu-xitem'>
<div><div class='xitem1'><a class='liat' href='#'><b:if cond='data:blog.url == data:blog.homepageUrl'>
Postagem por assunto
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<data:blog.pageName/>
<b:else/>
<b:if cond='data:blog.searchQuery'>
<data:blog.searchQuery/>
<b:else/>
<b:if cond='data:blog.searchLabel'>
<data:blog.searchLabel/>
</b:if>
</b:if>
</b:if>
</b:if></a>
<div class='hidden' id='labelxnya'/>
</div></div>
</div>
</b:if></b:if>
<b:if cond='data:blog.pageType != "item"'>
<div class='menu-xitem'>
<div><div class='xitem1'><a class='liat' href='#'><b:if cond='data:blog.url == data:blog.homepageUrl'>
Postagem por assunto
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<data:blog.pageName/>
<b:else/>
<b:if cond='data:blog.searchQuery'>
<data:blog.searchQuery/>
<b:else/>
<b:if cond='data:blog.searchLabel'>
<data:blog.searchLabel/>
</b:if>
</b:if>
</b:if>
</b:if></a>
<div class='hidden' id='labelxnya'/>
</div></div>
</div>
</b:if></b:if>
Agora Salve
Nenhum comentário:
Postar um comentário
Por favor leia antes de Comentar