11 fevereiro 2017

Layout Free Fevereiro


Gente olha que fofo o layout de fevereiro, espero que todos se divirtam com ele... Obrigado pelas curtidas na pagina, em breve uma promo bem legal para vocês.



COMO EDITAR O LAYOUT

Esse layout é bem simples de mexer, mas tem que ser com calma para não ficar feio pessoal

TOPO DO BLOG

Começando com o Banner principal. Para Download estará essa capa sem o nome do blog. Mas como mudo essa capa Karol?



Para mudar essa capa vocês tem que entrar lá em Modelo > Editar HTML  e procurar
pobackground-image: url('https://3.bp.blogspot.com/-cXQey-aFadM/WJ7114-w2eI/AAAAAAAAVvc/VTgkqEFB4nYYG643oGZ5Y398RCAcDVPRACLcB/s1600/topo%2Bfree.jpg');

Onde está o link você irão trocar pela de vocês. Simples? Não entendeu? Leia novamente, que eu tenho certeza que você vai entender.

MENU DO BLOG

Para editar o menu do blog, vocês tem que ter mais paciência ainda, é simples mais é dentro do HTML do blog, então cada "aspas", Cada virgula faz falta.

Para editar vocês vão lá em MODELO > EDITAR HTML e procurar por 
<div id='mymenuda'> abaixo dele estar assim

<div id='mymenuda'>
<div id='mymenu'>
<li><a href=' / '>Home</a></li>
<li><a>/</a></li>
<li><a href='Link do post'>Sobre Mk</a></li>
<li><a>/</a></li>
<li><a href='Link do post'>Layouts Pronta Entrega</a></li>
<li><a>/</a></li>
<li><a href=''>Portfólio</a></li>
<li><a>/</a></li>
<li><a href='Link do post'>Nosso diferencial</a></li>
<li><a>/</a></li>
<li><a href='Link do post'>Contato</a></li>
</div>

Na parte Home, Sobre Mk, Layouts a pronta entrega, Portfólio, Nosso Diferencial e Contato, vocês editam do jeito que vocês querem. Já onde está o Link do Post, coloquem o link que corresponde a cada.

POSTAGENS RECENTES NO TOPO DO BLOG REDONDA


Vamos com atenção pessoal, são pequenas coisas, todas fáceis de fazer, mais tenha atenção no que faz. Essa parte vocês vão lá em LAYOUT > ADICIONAR UM GADGET  e colocar o código que está abaixo. Salva e veja se deu certo. 



<div class='widget-content'>
<style type="text/css">
/* CSS - Destaque de posts */
.bsrp-gallery {
width:100%;
clear:both;
margin-left:-100px;  /*--define o posicionamento à esquerda, altere se precisar--*/
padding-left:100px;
margin-top:460px;
}
.bsrp-gallery:after {
display: table;
clear: both;
}
.bsrp-gallery .bs-item a {
position: relative;
float:left;
margin: 0 0 0 15px;
text-decoration:none;
border-radius:130px;  /*--define o grau de arredondamento da imagem, --*/
-moz-border-radius:130px; /*--define o grau de arredondamento da imagem, --*/
-webkit-border-radius:130px; /*--define o grau de arredondamento da imagem, --*/
}
.bsrp-gallery .bs-item .ptitle {
display: block;
clear: left;
font-size: 18px; /*--tamanho da fonte--*/
font-family: Impact; /*--tipo da fonte--*/
text-shadow:#000 2px -2px 3px, #000 -2px 2px 3px, #000 2px 2px 3px, #000 -2px -2px 3px;
border: #000 solid; /*--cor da borda pontilhada--*/
text-transform:uppercase; /*--coloca o texto em capslock, apague se desejar --*/
line-height:1.3em;
font-weight:300;
height: 50%; /*--define a altura da legenda --*/
width:81%; /*--define a largura da legenda --*/
position: absolute;
bottom:0%;
text-align: center;
margin:0 0 14px 13px;
padding:60px 5px 20px 5px;
color: #FFFFFF; /*--cor da fonte do texto--*/
word-wrap: break-word;
overflow:hidden;
filter:alpha(opacity=0);
-moz-opacity:0;
-khtml-opacity:0;
opacity:0;
border-radius:130px;
-moz-border-radius:130px;
-webkit-border-radius:130px;
}
.bsrp-gallery .bs-item .ptitle:hover {
filter:alpha(opacity=100);
-moz-opacity:1.0;
-khtml-opacity:1.0;
opacity:1.0;
border-radius:130px;
-moz-border-radius:130px;
-webkit-border-radius:130px;
}
.bsrp-gallery a img {
background: #FFFFFF;
float: left;
border-radius:130px;
-moz-border-radius:130px;
-webkit-border-radius:130px;
-webkit-transition-duration: .90s;
}
.bsrp-gallery a:hover img {
-webkit-transition-duration: .90s;
-webkit-filter: grayscale(0%);
border-radius:130px; /*--define o grau de arredondamento do fundo ao passar o mouse --*/
-moz-border-radius:130px; /*--define o grau de arredondamento do fundo ao passar o mouse --*/
-webkit-border-radius:130px; /*--define o grau de arredondamento do fundo ao passar o mouse --*/
}
/* CSS FIM */
</style>
<script>
function bsrpGallery(root) {
var entries = root.feed.entry || [];
var html = ['<div class="bsrp-gallery nopin" title="by elainegaspareto.com">'];
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 : 'http://2.bp.blogspot.com/-OSlo4lj_H4w/VRMrRXuZWyI/AAAAAAABCNA/RQsmcuaWiEE/s1600/sem.gif';
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;  /*--define em qual post começa a exibição --*/
var bsrpg_thumbSize = 233;  /*--define o tamanho das miniaturas --*/
var bsrpg_showTitle = true;
document.write("<script src=\"URLDOSEUBLOGAQUI/feeds/posts/default?start-index="+numposts+"&max-results=4&orderby=published&alt=json-in-script&callback=bsrpGallery\"><\/script>");</script>
</div>
<div class='clear'></div>

Para funcionar no seu blog, ele tem que ter postagens e você tem que mudar no código onde está URLDOSEUBLOGAQUI, colocando a sua.

ÁREA DE POSTAGEM DO BLOG


Como deixar a area de postagem do jeito da imagem? Bem é simples pessoal, nada de html agora..

Para deixar a postagem certinha como essa olhem na imagem acima, ela tem que estar com as seguintes formas: 

Você vai em Layouts, Postagem no blog e editar. A Data tem que ficar no formato da imagem: ( é o penúltimo formato de data)



Agora nesse mesmo lugar você vai desmarcar os seguintes quadradinhos: POSTADO POR, LINK PARA ESSA POSTAGEM, REAÇÕES, MOSTRAR EDIÇÃO RÁPIDA, MOSTRAR LINKS PARA ENVIAR ESSA POSTAGEM,MOSTRAR BOTÕES DE COMPARTILHAMENTOS, LOCAL, MOSTRAR PERFIL ABAIXO DA POSTAGEM E EXIBIR ANUNCIOS ENTRE AS POSTAGENS. 

Deve ficar assim abaixo: 



O que vai ficar marcado é a DATA, MARCADORES E COMENTÁRIOS.

RODAPÉ DO BLOG

Essa parte é no html pessoal, mais é básica, vocês só trocaram algumas informações do layout para a do blog de vocês.

Para editar você vai em MODELO> EDITAR HTML e procure por <div id='rodape-creditos'>

Abaixo coloquei o codigo completo e estou mostrando o que você podem mudar.



<center><div id='rodape-creditos'>
<table border='0' cellpadding='2' cellspacing='0' oncontextmenu='return false' ondragstart='return false' width='100%'>
<tr>
<td style='width:72%;text-align:center;'>&#169; <a href=''>NOME DO BLOG DE VOCÊS</a>- 2017.   Todos os direitos reservados.  Layout Free Criado por: <a href='https://www.facebook.com/designerlayoutmk/' rel='nofollow' target='_blank'>MK Designer e Layouts</a>.  Tecnologia do <a href='http://www.blogger.com' target='_blank'>Blogger</a>.</td>
<td style='width:28%;text-align:center;'><a href='http://mkdesignerlayout.blogspot.com.br/'><img alt='imagem-logo' border='0' id='logo-footer' oncontextmenu='return false' ondragstart='return false' src='https://2.bp.blogspot.com/-EPXjb83JXcc/V9BZM1S78nI/AAAAAAAATg8/Z1qXaXVrRrAN0CSbgSP-_sSKE-Tf_ZRbgCLcB/s1600/pequena_zps46dadd01.png'/></a><br/></td>
</tr>
</table>
</div></center>

Depois desse textão, acabamos isso mesmo pessoal, é fácil de instalar o layout, tenho certeza que seu blog vai ficar lindo. 

O que eu queria pedir para vocês é o seguinte: 

- Se pegarem o código não retirem os créditos, mas se isso for impossível de fazer pense no trabalho que eu tive para montar esse layout para vocês. 
- Compartilhem esse post, isso mesmo no face, twitter, Instagram, onde poder, me ajudem...
- Colocou no seu blog? Deixe o link aqui nos comentários que eu vou lá visitar.
- Não conseguiu instalar, me explique no comentário que eu te ajudo.

Curte a nossa pagina pelo amor de Deus...



Para ver o layout funcionando Clique Aqui

Para fazer Download CLIQUE AQUI 


4 comentários:

  1. Nao estou conseguindo aparece essa mensagem :É possível que a edição do modelo combinando HTTP e HTTPS afete a segurança e a experiência do usuário no seu blog quando ele é visto usando HTTPS. Saiba mais. Ocultar aviso
    e tambem essa: Não foi possível carregar a visualização do modelo: Erro ao analisar XML, linha 790, coluna 55: Element type "div" must be followed by either attribute specifications, ">" or "/>"

    o que eu estou fazendo de errado?

    ResponderExcluir
    Respostas
    1. Desabilita a função HTTPS em configurações deve ser isso Gleicy, pra mim está normal...

      Excluir
  2. O que eu fiz de errado? Ele fica estranho!
    https://jaquesoumae.blogspot.com.br/

    ResponderExcluir

Contato

Entre em contato e peça seu orçamento


Curta nossa Página

Quer um layout personalizado no seu blog? Entre em contato com a gente, ficaremos felizes em montar.

Telefone(whatsapp)

(11) 97310-0622

Website

www.mkdesignerlayout.blogspot.com.br/