Tutorial pagina de postagens

Olá, minha gente! Como está o dia de vocês? O meu está um pouquinho corrido por conta dos estudos, mas tirando essa questão está ótimo. Inicialmente, vou falar um pouquinho sobre o tempo daqui. Acreditam que estava (mega) sol de manhã, entretanto já mudou de novo? Nem é novidade, mas admito ficou com uma temperatura muito mais agradável. Enfim, o tutorial de hoje é bem comum, mas super necessário em um blog. Então, quem nunca se deparou com aquela situação de querer organizar todas as suas postagens em uma página, mas não achar uma personalização que lhe agrade ou não saber como fazer isso? No meu caso, sempre que eu utilizava as configurações da plataforma blogger ficava extremamente feio e desagradável. Assim, resolvi fazer uma personalização própria e disponibilizar, espero que gostem.  22/11/2016

Para quem quer saber como fica o modelo ao vivo basta clicar aqui.O que muda é que ele não é hover, mas se quiserem também irei postar o modelo hover. A imagem abaixo demonstra o seu modelo.

1 Primeiro vá até Modelo> Editar HTML> Ctrl+f dentro do quadro> acima de ]]></b:skin> adicione o seguinte código

.menuvt {
background-color: #CORDEFUNDODOMENU;
border: 1px solid #CORDASUABORDA;
font-family: Arial;
font-size: 11px;
color: #CORDAFONTE!important;
text-transform: uppercase;
margin: 2px;
float: left;
text-align: center;
height: alturapx;
width: tamanhodomenupx!important;
display: block;
padding: 1px;
text-shadow: 1px 1px 0px #SOMBRADOTEXTO;
}

Bom, o código acima não tem mais o que explicar, basta adicionar conforme está escrito acima. Em casos de dúvidas podem me perguntar que irei tirar todas as suas dúvidas.

Adicionando pagina ao seu blog
Entre no seu blog e vá até Pagina (img) > clique em Nova pagina> Em seguida clique em HTML no topo da postagem (img) e adicione nela o seguinte código:

MODELO COM DIVIDIDO EM DUAS PARTES, QUE NEM NO MEU BLOG

<div style="text-align: center;">
<b> TITULO </b></div>
<div style="text-align: center;">
<b><br /></b></div>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<br />
<br />
<br />
<br />
<br />
<br />
<div style="text-align: center;">
<b><br /></b>
<br />
<b><br /></b>
<br />
<div style="text-align: center;">
<b>~</b><span style="color: #d0e0e3;"><b>SEGUNDA PARTE(APENAS SE QUISER)</b></span><b>~</b></div>
<div style="text-align: center;">
<b><br /></b></div>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a></div>

MODELO DE SOMENTE UMA PARTE 

<div style="text-align: center;">
<b> TITULO </b></div>
<div style="text-align: center;">
<b><br /></b></div>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<a class="menutag" href="LINK DA POSTAGEM">Nome da sua postagem</a>
<br />
<br />
<br />
<br />
<br />
<br />

Depois de adicionar o código basta voltar para escrever (img) e salvar!  Credite se usar