Olá galerinha,hoje eu trouxe um tutorial super fácil e simples,de como mudar o blockquote padrão do blogger.

**ESSA É A SEGUNDA PARTE DOS TUTORIAIS QUE USEI NO BLOG,SE VOCÊ AINDA NÃO VIU A PRIMEIRA PARTE,CLIQUE AQUI**

Vá em Layout e vamos descobrir mais sobre o blog :)

Em Favicon você muda o símbolozinho do Blogger que aparece nessa parte de cima,é só colocar em Editar e Salvar o que você preferir,se precisar de sugestões aqui tem algumas
           

Agora,você precisa desabilitar a Navbar é que aquela aba de pesquisa e algumas funções do Blogger,é muito limitada e não ajuda em nada kkkk então vamos tirar

Vá em Editar>Desativado e Salve

Na parte do Cabeçalho você pode colocar uma imagem feita por você,é só colocar em Imagem>Do seu computador e Em vez de título e descrição

Espere carregar e salve(a imagem usada no cabeçalho deve ter em torno de 1000x315 se você usar a medida que eu usei na primeira parte)

Também recomendo retirar a parte do Perfil,é só clicar nela e excluir,porque vamos usar outro tutorial para ela.

Sem mais delongas,vamos a parte do HTML :D

Clique em Modelo>Editar HTML

Você vai encontrar algo assim

Para começar a editar você precisa ter a noção geral de cada parte do seu blog,por isso,clique nesses três pontinhos entre os skin e você vai ver tudo que precisa :)

Para o seu blog ser 100% exclusivo você pode alterar a parte indicada abaixo

E sua área de postagem vai estar assim 

E o melhor de tudo:Você só precisa de uma noção bem básica que eu mesma vou dar aqui,então bora né?!Que já falei demais rs

Antes de tudo,você precisa criar um blog,essa é a parte fácil,vá em Novo Blog e preencha as lacunas.

Nessa parte do Plano de Fundo,você pode escolher entre uma das opções disponíveis,mas eu recomendo você escolher um fundo(achado no Google mesmo),salvar e Fazer Upload da imagem,depois é só clicar em Concluído e Salvar(Clicando em Aplicar ao blog)

Agora,vamos ajustar a largura,o tamanho padrão do Blogger é o 960 de largura e 310 de barra lateral(onde ficam os gadgets ou caixinhas) Mas eu prefiro deixar mais largo,então mudo para 1200 e 360,se você achar que está muito largo é só diminuir,porém eu acho esse tamanho bom.

Em Avançado é onde você vai mudar a maioria das coisas,vou dar algumas sugestões de mudanças,mas vocês podem personalizar como acharem melhor,vou explicar todos os itens necessários para quem é blogueiro.

A maioria deles já é autoexplicativo,mas vamos lá :)

Em Texto da página você vai definir a fonte que os posts terão,esse será seu padrão e caso não mexa nisso a fonte será definida pelo próprio Blogger(O que recomendo é deixar a fonte Arial tamanho 18 px e na cor preta)

Em Planos de Fundo você escolherá a cor do fundo da área de postagem,recomendo deixar tudo transparente,porque vamos personalizar essa parte depois com um tutorial.
**Se você usou o mesmo modelo que o meu,vai perceber que a cor Preta não some realmente do fundo,mas isso a gente retira depois,não se preocupe.**

Em Links,você vai mudar a cor de todos os itens da área de postagem,como na imagem abaixo,recomendo deixar uma cor escura,porque o padrão da área de postagens é branco ou uma cor mais clara possível.

Em Título do Blog e Descrição do blog você irá mudar toda a parte do cabeçalho,mas se resolver usar uma imagem não precisa nem mexer nela.

Texto das guias e Plano de Fundo das guias você não precisa mexer,porque a gente arruma tudo isso com tutoriais.

Em Cabeçalho da Data você pode mudar se quiser,mas também tem tutorial para isso.

Em Título da Postagem e Plano de Fundo da Postagem você também não precisa mexer.

Desse final não precisa mudar nada,mas você se pergunta "E o que é esse Adicionar CSS?",essa parte você vai usar quando tiver um tutorial e pedir para colocar na parte ]]></b:skin> você pode ir direto por aqui e ela será imediatamente redirecionada ao lugar necessário,mas,atenção, CSS é só para quando aparece para por no skin,se for qualquer outro não dará certo.

Depois de acabar todas as alterações,coloque em Aplicar ao blog e pronto :D

Agora que você já conhece parte desse processo pode ter um blog simples montado no Blogger ok,agora,amanhã saí a segunda parte,que é a explicação da parte do HTML e os tutorias necessários para usar no blog.

E aí,gostaram?

Já começaram a montar seu blog?

Ansiosos para a postagem de amanhã?

Beijos 

Olá galerinha,eu faço parte de um grupo no facebook para ter ajuda com a personalização do blog,a gente pode perguntar sobre qualquer coisa na parte de personalizar e quem souber vai respondendo.Ultimamente eu tenho parado muito para pesquisar mais sobre tutoriais e ajudar o pessoal de lá,além de me ajudar também,pois estou montando um layout novo para o blog(que vai ser colocado no final de junho) e estou quase terminando ele,então muitos dos tutoriais que a gente aprende eu venho trazendo para aplicar ao layout.
Aí eu pensei que não tenho trazido muitos tutoriais aqui para o blog e seria legal mostrar um Slide de Postagens Recentes super fácil,que o pessoal de lá vive perguntando como faz.Então,se você quer aprender a fazer um slide de postagens recentes como esse abaixo,é só continuar lendo :D

Primeiro vá em Layout>Adicionar Gadget>HTML/Java Script

E cole o código a seguir

<center><style type="text/css">
.bsrp-gallery {
width: auto;
margin-left: 80px;
background: transparent;
clear:both;
margin-top: -80px;
}
.bsrp-gallery:after {
display: table;
clear: both;
background: #transparent;
}
.bsrp-gallery .bs-item a {
position: relative;
background: #transparent;
float:left;
margin: 10px 10px 10px 10px;
margin-right: 20px;
text-decoration:none;
}
.bsrp-gallery .bs-item .ptitle {
background:#3A5FCD;display: block;
transition: ease .7s;
clear: left;
font-size: 20px;
font-family: 'Arial';
text-transform:none;
line-height:1.3em;
font-weight:400;
height: 100%;
width:100%;
position: absolute;
bottom:0%;
font-family: 'Arial', sans-serif;
text-align: center;
padding:80px 10px 80px 10px;
color:#fff;word-wrap: break-word;
overflow:hidden;
text-transform: none;
padding-top: 85px;
filter:alpha(opacity=0);
-moz-opacity:0;
-khtml-opacity:0;
opacity:0;
}
.bsrp-gallery .bs-item .ptitle:hover {
filter:alpha(opacity=90);
-moz-opacity:0.9;
-khtml-opacity:0.9;
transition: ease .7s;
opacity:0.9;
}
.bsrp-gallery a img {
float: left;
border: 4px solid #AFEEEE;
}
.bsrp-gallery a:hover img {filter:alpha(opacity=90);
-moz-opacity:0.9;
-khtml-opacity:0.9;
transition: ease .7s;
opacity:0.9;}
</style>
<script>
//byjessica
function bsrpGallery(root) {
var entries = root.feed.entry || [];
var html = ['<div class="bsrp-gallery nopin" title="Get this from poderondesign">'];
for (var i = 0; i < entries.length; ++i) {
var post = entries[i];
var postTitle = post.title.$t;
var orgImgUrl = post.media$thumbnail ? post.media$thumbnail.url : 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgywHmwqr6CeIqsXjbCoK9ywZ1yP0yQIrJ826tHfWffEI6bP5QIs6szYMCjsgONAUdQVSYG5Wgf7o-cPBGy6OIsAcqHfTJ5RoXFfAiKCNP2AeXGnDtk0TZ6fH08U0JaTHTDDIo7Z4g2h_HQ/s72-c/default+image.png';
var newImgUrl = orgImgUrl.replace('s72-c', 's' + bsrpg_thumbSize + '-c');
var links = post.link || [];
for (var j = 0; j < links.length; ++j) {
if (links[j].rel == 'alternate') break;
}
var postUrl = links[j].href;
var imgTag = '<img src="' + newImgUrl + '" width="' + bsrpg_thumbSize + '" height="' + bsrpg_thumbSize + '"/>';
var pTitle = bsrpg_showTitle ? '<span class="ptitle">' + postTitle + '</span>' : '';
var item = '<a href="' + postUrl + '" title="' + postTitle + '">' + imgTag + pTitle + '</a>';
html.push('<div class="bs-item">', item, '</div>');
}
html.push('</div>');
document.write(html.join(""));
}
hoje = new Date()
numposts = 1;
var bsrpg_thumbSize = 200;
var bsrpg_showTitle = true;
document.write("<script src=\"/feeds/posts/default?start-index="+numposts+"&max-results=4&orderby=published&alt=json-in-script&callback=bsrpGallery\"><\/script>");</script></center>

Pode usar essa tabela de cores se precisar modificar
Altere apenas as partes indicadas,no primeiro negrito em azul você modifica a cor de fundo do Slide,isto é,quando você passar o mouse por cima dele vai aparecer uma cor nele,que no caso do tutorial é azul.O segundo negrito azul é para alterar a cor do que está escrito,no caso,a escrita ficará em branco quando passar o mouse por cima.O terceiro negrito azul é a cor da borda,altere apenas o # para a cor,ou,se preferir deixar sem borda é só mudar o 4px por 0px.
O primeiro negrito vermelho altera o tamanho do slide,aconselho não mudar,mas,se ele ficar um pouco pequeno aumente para 220.O segundo negrito vermelho é a quantidade de postagens que vai aparecer no slide,altere para mais ou para menos se quiser,eu recomendo deixar quatro que é a quantidade padrão.

Depois de alterar Salve e posicione no lugar desejado.

Decidi colocar abaixo do cabeçalho e ficou bom para mim,mas,se preferir,você pode posicionar no rodapé,é só mover até Footer

E está pronto,viu como é fácil,quase não precisa mexer e fica certinho no blog,eu testei no meu blog teste,outras pessoas testaram no blog delas e funcionou com todo mundo,espero que dê certo com vocês também :D
Qualquer dúvida me gritem aqui viu ;)
Beijos