Código dos Tutoriais: fevereiro 2016

IMAGEM - Clique em cima da imagem com o botão direito e copie o Endereço da imagem

<center><div id='bp_recent'></div> <script style='text/javascript' src='http://bloggergadgets.googlecode.com/files/recentposts_orig.js'></script> <script style='text/javascript'> var numberOfPosts = 5; var showPostDate = false; var showSummary = false; var titleLength = 0; var showCommentCount = false; var showThumbs = true; var showNoImage = true; var imgDim = 190; var imgFloat = 'right'; var myMargin = 12; var mediaThumbsOnly = true; var showReadMore = false; </script> <script src='http://LINK-DO-SEU-BLOG/feeds/posts/default?max-results=18&orderby=published&alt=json-in-script&callback=bprecentpostswiththumbnails'></script></center>

#header-inner img {
margin-left: auto;
margin-right: auto;
}
.PageList {text-align:center !important;}
.PageList li {display:inline !important; float:none !important;}

.post-body img, .post-body .tr-caption-container, .ss, .Profile img, .Image img,

.BlogList .item-thumbnail img {

padding: none !important;

border: none !important;

background: none !important;

-moz-box-shadow: 0px 0px 0px transparent !important;

-webkit-box-shadow: 0px 0px 0px transparent !important;

box-shadow: 0px 0px 0px transparent !important;

}

<b:widget id='Attribution1' locked='true' title='' type='Attriution'>...</b:widget>

body, html {

height: 300px;

margin: 0;

padding: 0; }

body {

font: $(body.font);

color: $(body.text.color);

background: url("URL do 1º background") repeat; }

html {

background: url("URL do 2º background") repeat; }

<div class='widget-content'>
<style type="text/css">
/* CSS - Destaque de posts */
.bsrp-gallery {
width:100%;
clear:both;
margin-left:-3px; /*--define o posicionamento à esquerda, altere se precisar--*/
padding-left:100px;
}
.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 {
background: #c6ebfa; /*--cor de fundo das miniaturas ao passar o mouse --*/
display: block;
clear: left;
font-size: 13px;
font-family: arial;
text-transform:uppercase; /*--coloca o texto em capslock, apague se desejar --*/
line-height:1.3em;
font-weight:300;
height: 48%; /*--define a altura da legenda --*/
width:79%; /*--define a largura da legenda --*/
position: absolute;
bottom:0%;
text-align: center;
margin:0 0 14px 13px;
padding:60px 10px 20px 10px;
color:#000000; /*--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=90);
-moz-opacity:0.9;
-khtml-opacity:0.9;
opacity:0.9;
border-radius:130px;
-moz-border-radius:130px;
-webkit-border-radius:130px;
}
.bsrp-gallery a img {
background: #fff;
float: left;
border-radius:130px;
-moz-border-radius:130px;
-webkit-border-radius:130px;
}
.bsrp-gallery a:hover img {
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 : 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5svV-CG7_LH4XE9svF88cDxvZweRKrPeC4NhgVgAh6Abinzl4rv4hM4d86H12JzEjUDhnu3_j1jnzr31_Q3Y4nm3JUeISnb2U87R4HhMUaf3dpGQlVoC_aufEKdlvgbrGN0DzeKysaUOV/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 = 213; /*--define o tamanho das miniaturas --*/
var bsrpg_showTitle = true;
document.write("<script src=\"LINK-DO-SEU-BLOG-AQUI/feeds/posts/default?start-index="+numposts+"&max-results=4&orderby=published&alt=json-in-script&callback=bsrpGallery\"><\/script>");</script>
</div>
<div class='clear'>
</div>

</ textarea></center>

.main-inner h2.date-header {text-align: center;} /* centralizar data dos posts */

h3.post-title {text-align:center;} /* centralizar titulo dos posts */

quinta-feira, 18 de fevereiro de 2016