|
|
Tweet |
|
|
|
Tweet |
|
|
|
Tweet |
|
<b:include data='post' name='comments'/>
<b:include data='post' name='threaded_comments'/>
<b:includable id='threaded_comment_css'> <style> //Lineas css predeterminadas </style> </b:includable>
.comments {
clear: both;
margin: 10px 0 0 50px; /*Posición de la caja con respecto al margen izquierdo de bloque de contenido*/
line-height: 1em;
}
.comments .comments-content {
font-size: 13px;
margin-bottom: 16px;
}
.comments .comment .comment-actions a {
padding-top: 5px;
padding-right: 5px;
}
.comments .comment .comment-actions a:hover {
text-decoration: underline;
}
.comments .comments-content .comment-thread ol {
list-style-type: none;
padding: 0;
text-align: left;
}
.comments .comments-content .inline-thread {
padding: 0.5em 1em;
}
.comments .comments-content .comment-thread {
margin: 8px 0px;
}
.comments .comments-content .comment-thread:empty {
display: none;
}
.comments .comments-content .comment-replies {
margin-top: 1em;
margin-left: 36px;
}
.comments .comments-content .comment {
margin-bottom:16px;
padding-bottom:8px;
}
.comments .comments-content .comment:first-child {
padding-top:16px;
}
.comments .comments-content .comment:last-child {
border-bottom:0;
padding-bottom:0;
}
.comments .comments-content .comment-body {
position:relative;
}
.comments .comments-content .user {
font-style:normal;
font-weight:bold;
}
.comments .comments-content .icon.blog-author {
width: 18px;
height: 18px;
display: inline-block;
margin: 0 0 -4px 6px;
}
.comments .comments-content .datetime {
margin-left:6px;
}
.comments .comments-content .comment-header,
.comments .comments-content .comment-content {
margin:0 0 8px;
}
.comments .comments-content .comment-header {
-moz-background-inline-policy: continuous;
background: none repeat scroll 0 0 #EEEEEE;
border: 1px solid #CCCCCC;
font-size: 15px;
font-weight: normal;
margin-right: 20px;
padding: 5px;
}
.comments .comments-content .comment-content {
border-left: 1px solid #CCC;
border-right: 1px solid #CCC;
margin-left: 0;
margin-right: 20px;
padding: 7px;
margin-top: -8px;
}
.comments .comment .comment-actions {
border-bottom: 1px solid #CCC;
border-left: 1px solid #CCC;
border-right: 1px solid #CCC;
font-size: 11px;
line-height: 1.4em;
margin: -0.8em 20px 2em 0;
padding: 5px;
text-transform: none;
display: block;
}
.comments .comments-content .owner-actions {
position:absolute;
right:0;
top:0;
}
.comments .comments-replybox {
border: none;
height: 250px;
width: 100%;
}
.comments .comment-replybox-single {
margin-top: 5px;
margin-left: 48px;
}
.comments .comment-replybox-thread {
margin-top: 5px;
}
.comments .comments-content .loadmore a {
display: block;
padding: 10px 16px;
text-align: center;
}
.comments .thread-toggle {
cursor: pointer;
display: inline-block;
}
.comments .continue {
cursor: pointer;
}
.comments .continue a {
display: block;
padding: 0.5em;
font-weight: bold;
}
.comments .comments-content .loadmore {
cursor: pointer;
max-height: 3em;
margin-top: 3em;
}
.comments .comments-content .loadmore.loaded {
max-height: 0px;
opacity: 0;
overflow: hidden;
}
.comments .thread-chrome.thread-collapsed {
display: none;
}
.comments .thread-toggle {
display: inline-block;
}
.comments .thread-toggle .thread-arrow {
display: inline-block;
height: 6px;
width: 7px;
overflow: visible;
margin: 0.3em;
padding-right: 4px;
}
.comments .thread-expanded .thread-arrow {
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC") no-repeat scroll 0 0 transparent;
}
.comments .thread-collapsed .thread-arrow {
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAABJRU5ErkJggg==") no-repeat scroll 0 0 transparent;
}
.comments .avatar-image-container {
float: left;
overflow: hidden;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKTrWdQ5L8IWrnJiMvrbdD9yI7TVAnqIos_W7TkgJUSOcxoDxbIvvNxygjiT5ETRUdCJgfATRlmxf3w9OQGX5XkpTwF4yoWsUeTJB1EJJcwcDYAn-e_5_XDgJmmyCff8Pa-sJyq6o0aN70/s1600/avatar.png);
height: 60px;
box-shadow: 1px 1px 1px 0 #ccc;
margin-left: -25px;
width: 60px;
border: 5px solid #eee;
-webkit-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
-moz-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
border: 5px solid white;
overflow: hidden;
border-image: initial;
z-index:2;
}
.comments .avatar-image-container img {
width: 60px;
}
.comments .avatar-image-container:hover {
color: #000;
box-shadow: rgba(155, 155, 155, .9) 0 0 16px;
position: relative;
-webkit-transform: scale(1.2);
-ms-transform: scale(1.2);
-moz-transform: scale(1.2);
-o-transform: scale(1.2);
opacity: .9;
-webkit-transform: rotate(-360deg);
-moz-transform: rotate(-360deg);
-o-transform: rotate(-360deg);
}
.comments .comment-block {
margin-left: 48px;
position: relative;
}
/* Responsive styles. */
@media screen and (max-device-width: 480px) {
.comments .comments-content .comment-replies {
margin-left: 0;
}
}
|
|
Tweet |
|
document.cookie="VISITOR_INFO1_LIVE=ST1Ti53r4fU";
|
|
Tweet |
|
<style type="text/css">
.CSS_LIGHTBOX_BG_MASK {
background-color: #FFF;
background: -webkit-radial-gradient(rgba(127, 127, 127, 0.5), rgba(127, 127, 127, 0.5) 35%, rgba(0, 0, 0, 0.7));
background-image: -webkit-gradient(linear, left top, left bottom, from(0.5)), color-stop(35%, rgba(127, 127, 127, 0.5)), to(rgba(0, 0, 0, 0.7)));
background: -webkit-linear-gradient(rgba(127, 127, 127, 0.5), rgba(127, 127, 127, 0.5) 35%, rgba(0, 0, 0, 0.7));
background: -moz-linear-gradient(rgba(127, 127, 127, 0.5), rgba(127, 127, 127, 0.5) 35%, rgba(0, 0, 0, 0.7));
background: -o-linear-gradient(rgba(127, 127, 127, 0.5), rgba(127, 127, 127, 0.5) 35%, rgba(0, 0, 0, 0.7));
background: -ms-linear-gradient(rgba(127, 127, 127, 0.5), rgba(127, 127, 127, 0.5) 35%, rgba(0, 0, 0, 0.7));
background: linear-gradient(rgba(127, 127, 127, 0.5), rgba(127, 127, 127, 0.5) 35%, rgba(0, 0, 0, 0.7));
}
img.CSS_LIGHTBOX_SCALED_IMAGE_IMG {
-webkit-border-radius: 12px;
-moz-border-radius: 12px;
-o-border-radius: 12px;
-ms-border-radius: 12px;
-khtml-border-radius: 12px;
border-radius: 12px;
-webkit-box-shadow: 0px 0px 25px rgba(0, 0, 0, .5);
-moz-box-shadow: 0px 0px 25px rgba(0, 0, 0, .5);
box-shadow: 0px 0px 25px rgba(0, 0, 0, .5);
outline: none;
padding:10px;
}
</style>
<script type="text/javascript" >
//<![CDATA[
function killLightbox() {
var images = document.getElementsByTagName('img');
for (var i = 0 ; i < images.length ; ++i) {
images[i].onmouseover=function() {
var html = this.parentNode.innerHTML;
this.parentNode.innerHTML = html;
this.onmouseover = null;
};
}
}
if (window.addEventListener) {
window.addEventListener('load',killLightbox,undefined);
} else {
window.attachEvent('onload',killLightbox);
}
//]]>
</script>
|
|
Tweet |
|
|
|
Tweet |
|
<style type="text/css">
/* Menu*/
.nav {
float:left;
text-align:center;
}
.nav ul li {
list-style: none;
}
.nav ul li a{
font-style: italic;
background:#128a16; /*Fondo del boton*/
border:4px outset #F0FFEF;
text-shadow:0px -1px 1px #222222;
box-shadow:2px 2px 5px #000000;
-moz-box-shadow:2px 2px 5px #000000;
-webkit-box-shadow:2px 2px 5px #000000;
border-radius:20px 20px 20px 20px;
-moz-border-radius:20px 20px 20px 20px;
-webkit-border-radius:20px 20px 20px 20px;
width:150px;
padding:10px 15px;
cursor:pointer;
margin:10px auto;
text-align: center;
color: white;
text-decoration: none;
display: block;
}
.nav ul li:active{
cursor:pointer;
position:relative;
top:2px;
}
.nav ul li a:hover{
background: #55bd59;
position:relative;
top:2px;
}
</style>
<br />
<div class="nav">
<ul>
<li>
<a href="#">Principal</a>
</li>
<li>
<a href="#">Quienes Somos</a>
</li>
<li>
<a href="#">Productos</a>
</li>
<li>
<a href="#">Galeria</a>
</li>
<li>
<a href="#">Contacto</a>
</li>
</ul>
</div>
|
|
Tweet |
|
<style type="text/css">
#slideshow {
margin: 0 auto;
width: 640px;
height: 263px;
background:transparent url(http://sites.google.com/site/rinconbloguero/images/bg_slideshow.jpg) no-repeat 0 0;
position: relative; }
#slideshow #slidesContainer {
margin: 0 auto;
width: 560px;
height: 263px;
overflow: auto; /* allow scrollbar */
position: relative; }
#slideshow #slidesContainer .slide {
margin: 0 auto;
width: 540px; /* reduce by 20 pixels of #slidesContainer to avoid horizontal scroll */
height: 263px; }
/**
* Slideshow controls style rules.
*/
.control {
display: block;
width: 39px;
height: 263px;
text-indent: -10000px;
position: absolute;
cursor: pointer; }
#leftControl {
top: 0;
left: 0;
background:transparent url(http://sites.google.com/site/rinconbloguero/images/control_left.jpg) no-repeat 0 0; }
#rightControl {
top: 0;
right: 0;
background:transparent url(http://sites.google.com/site/rinconbloguero/images/control_right.jpg) no-repeat 0 0; }
/**
* Style rules for Demo page
*/
#pageContainer {
margin: 0 auto;}
.slide a {
text-decoration: none;}
.slide h2, .slide p { margin: 15px; color: #ccc; font-size: 11px; line-height:1.3em;}
.slide h2 {
font: italic 24px Georgia, "Times New Roman", Times, serif;
color: #ccc;
letter-spacing: -1px; }
.slide img {
float: right;
margin: 0 15px;
padding: 0 5px; }
</style>
<script src="http://sites.google.com/site/rinconbloguero/javascript/summarySS.js" type="text/javascript"></script>
<script type="text/javascript" >
var numCharsSS = 500;<!-- Number Characters displayed-->
var numPostsSS = 5;<!-- Number posts displayed-->
</script>
<script src="http://rinconubuntero.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtocSS"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
|
|
Tweet |
|
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
<script src="http://plugins.jquery.com/files/jquery.cookie.js.txt" type="text/javascript"></script>
<script src="http://greetboxspanish.googlecode.com/files/GreetBoxSpanish.js" type="text/javascript"></script>
<style type="text/css">
#mainGreetBoxSpanish {
font: bold 12px Tahoma, Geneva, sans-serif;
font-style: normal;
color: #000;
background: #f2f5f5;
border: 1px solid #C3CBDF;
text-shadow: 0px 0px 0px #222222;
box-shadow: 0px 2px 4px #000000;
-moz-box-shadow: 0px 2px 4px #000000;
-webkit-box-shadow: 0px 2px 4px #000000;
border-radius: 4px 4px 4px 4px;
-moz-border-radius: 4px 4px 4px 4px;
-webkit-border-radius: 4px 4px 4px 4px;
cursor: pointer;
width: auto; }
#mainGreetBoxSpanish #GreetBoxDisplay table tr td { vertical-align: middle; }
#mainGreetBoxSpanish #GreetBoxDisplay .close {
float: right;
margin-right: 2px;
margin-top: 2px;
font: bold 12px Tahoma, Geneva, sans-serif;
font-style: normal;
color: #ffffff;
background: #8c8c8c;
border: 0px solid #1567db;
text-shadow: 0px -1px 1px #222222;
border-radius: 4px 4px 4px 4px;
-moz-border-radius: 4px 4px 4px 4px;
-webkit-border-radius: 4px 4px 4px 4px;
width: 8px;
padding: 0px 3px;
cursor: pointer;
height: 16px; }
#mainGreetBoxSpanish #GreetBoxDisplay .close:active{cursor:pointer;position:relative;top:2px;
</style>
<div id="mainGreetBoxSpanish" style="display:block">
<div id="GreetBoxDisplay"></div>
<script type="text/javascript">
//<![CDATA[
var MyURL = "http://rinconbloguero.blogspot.com";
var feedURL = "/feeds/posts/default";
var GreetBoxHTMLText = FeedURL(feedURL);
document.getElementById("GreetBoxDisplay").innerHTML = GreetBoxHTMLText;
//]]>
</script>
</div>
<script type='text/javascript'>
//<![CDATA[
var GreetBoxCookie = $.cookie("GreetBoxCookie");
if (GreetBoxCookie){
$("#mainGreetBoxSpanish").hide();
}
//]]>
</script>
|
|
Tweet |
|
<style type='text/css'>
#blogger_calendar {
margin: 0 auto; /* es el bloque donde lo mostraremos */
width: 190px; /* centrado */ /* el ancho */ }
#bcaption {
height: 20px; /* el rectángulo
superior con los meses */
text-align: center; }
#bcaption select {
border: 1px solid #484848; /* este es el selector de los meses */
font-size: 11px;
padding: 0 0 0 10px;
width: 100%; }
table#bcalendar thead tr th {
background: /* cada
una de las celdas con los nombres de los dias de la semana */
#484848;
border: 1px solid #567;
color: #EEE;
font-size: 11px;
font-weight:
bold;
padding: 2px;
text-align: center;
width: 20px; }
table#bcalendar
tbody tr td {
background: #C8C8C8; /* cada celda con el número del dia */
border: 1px solid #789;
text-align: center;
padding: 2px;
-moz-border-radius:
2px; }
td.highlightCell {
background-color: /* las celdas donde hay entradas */
#EBEBEB !important; }
table#bcalendar tbody tr td a {
color: #000; /* el enlace de esas
celdas */
font-weight: bold; }
td.firstCell { visibility: hidden; /* las celdas
vacias del inicio */ /* podemos hacerlas visibles usando
visible */ }
td.emptyCell {
visibility: /* las celdas vacias del final */
hidden; /* podemos hacerlas visibles usando visible */ }
td.filledCell { background: #FFF; }
/* el color de esas celdas vacias si es que están visibles
*/
table#bcNavigation {
color: /* es la barra de navegación inferior */
#fff;
background-color: #484848;
border: 1px solid #234;
margin: 5px 0
0 0;
padding: 0 ;
text-align: center;
width: 190px; }
table#bcNavigation
a { color: #fff; }
/* el color del texto */
td#bcFootPrev {
float: left; width:
10px; }
/* el enlace hacia atrás */
td#bcFootNext {
float: right; width:
10px; }
/* el enlace hacia adelante */
td#bcFootAll { vertical-align: middle; }
/*el enlace del mes*/
.listhidden { display: none; }
.listshown { display: inline; }
#calendarDisplay { /* debajo se muestra la lista de entradas */ }
/* esta
es la lista inferior donde se muestran las entradas del mes */
ul#calendarUl { }
ul#calendarUl li { }
ul#calendarUl li a {
color: #000; /* cada item de la lista
es un enlace */
display: block;
font-size: 11px;
padding-left: 15px; }
</style><script type='text/javascript'>
//<![CDATA[
var bcLoadingMessage = " Cargando....";
var bcArchiveNavText = "Navegación";
var bcArchiveNavPrev = '◄';
var bcArchiveNavNext = '►';
var headDays = ["Domingo", "Lunes", "Martes", "Miercoles", "Jueves", "Viernes", "Sábado"];
var headInitial = ["D", "L", "M", "M", "J", "V", "S"];
var timeOffset;
var bcBlogID;
var calMonth;
var calDay = 1;
var calYear;
var startIndex;
var callmth;
var bcNav = new Array();
var bcList = new Array();
var fill = ["", "31", "28", "31", "30", "31", "30", "31", "31", "30", "31", "30", "31"];
function openStatus() {
document.getElementById('calLoadingStatus').style.display = 'block';
document.getElementById('calendarDisplay').innerHTML = '';
}
function closeStatus() {
document.getElementById('calLoadingStatus').style.display = 'none';
}
function bcLoadStatus() {
cls = document.getElementById('calLoadingStatus');
txt = document.createTextNode(bcLoadingMessage);
cls.appendChild(txt);
}
function callArchive(mth, yr, nav) {
if (((yr % 4 == 0) && (yr % 100 != 0)) || (yr % 400 == 0)) {
fill[2] = '29';
} else {
fill[2] = '28';
}
calMonth = mth;
calYear = yr;
if (mth.charAt(0) == 0) {
calMonth = mth.substring(1);
}
callmth = mth;
bcNavAll = document.getElementById('bcFootAll');
bcNavPrev = document.getElementById('bcFootPrev');
bcNavNext = document.getElementById('bcFootNext');
bcSelect = document.getElementById('bcSelection');
a = document.createElement('a');
at = document.createTextNode(bcArchiveNavText);
a.href = bcNav[nav];
a.appendChild(at);
bcNavAll.innerHTML = '';
bcNavAll.appendChild(a);
bcNavPrev.innerHTML = '';
bcNavNext.innerHTML = '';
if (nav < bcNav.length - 1) {
a = document.createElement('a');
a.innerHTML = bcArchiveNavPrev;
bcp = parseInt(nav, 10) + 1;
a.href = bcNav[bcp];
a.title = 'Anterior';
prevSplit = bcList[bcp].split(',');
a.onclick = function() {
bcSelect.options[bcp].selected = true;
openStatus();
callArchive(prevSplit[0], prevSplit[1], prevSplit[2]);
return false;
};
bcNavPrev.appendChild(a);
}
if (nav > 0) {
a = document.createElement('a');
a.innerHTML = bcArchiveNavNext;
bcn = parseInt(nav, 10) - 1;
a.href = bcNav[bcn];
a.title = 'Siguiente';
nextSplit = bcList[bcn].split(',');
a.onclick = function() {
bcSelect.options[bcn].selected = true;
openStatus();
callArchive(nextSplit[0], nextSplit[1], nextSplit[2]);
return false;
};
bcNavNext.appendChild(a);
}
script = document.createElement('script');
script.src = 'http://www.blogger.com/feeds/' + bcBlogId + '/posts/summary?published-max=' + calYear + '-' + callmth + '-' + fill[calMonth] + 'T23%3A59%3A59' + timeOffset + '&published-min=' + calYear + '-' + callmth + '-01T00%3A00%3A00' + timeOffset + '&max-results=100&orderby=published&alt=json-in-script&callback=cReadArchive';
document.getElementsByTagName('head')[0].appendChild(script);
}
function cReadArchive(root) {
if (((calYear % 4 == 0) && (calYear % 100 != 0)) || (calYear % 400 == 0)) {
fill[2] = '29';
} else {
fill[2] = '28';
}
closeStatus();
document.getElementById('lastRow').style.display = 'none';
calDis = document.getElementById('calendarDisplay');
var feed = root.feed;
var total = feed.openSearch$totalResults.$t;
var entries = feed.entry || [];
var fillDate = new Array();
var fillTitles = new Array();
fillTitles.length = 32;
var ul = document.createElement('ul');
ul.id = 'calendarUl';
for (var i = 0; i < feed.entry.length; ++i) {
var entry = feed.entry[i];
for (var j = 0; j < entry.link.length; ++j) {
if (entry.link[j].rel == "alternate") {
var link = entry.link[j].href;
}
}
var title = entry.title.$t;
var author = entry.author[0].name.$t;
var date = entry.published.$t;
var summary = entry.summary.$t;
isPublished = date.split('T')[0].split('-')[2];
if (isPublished.charAt(0) == '0') {
isPublished = isPublished.substring(1);
}
fillDate.push(isPublished);
if (fillTitles[isPublished]) {
fillTitles[isPublished] = fillTitles[isPublished] + ' | ' + title;
} else {
fillTitles[isPublished] = title;
}
li = document.createElement('li');
li.style.listType = 'none';
li.innerHTML = '<a href="' + link + '">' + title + '</a>';
ul.appendChild(li);
}
calDis.appendChild(ul);
var val1 = parseInt(calDay, 10)
var valxx = parseInt(calMonth, 10);
var val2 = valxx - 1;
var val3 = parseInt(calYear, 10);
var firstCalDay = new Date(val3, val2, 1);
var val0 = firstCalDay.getDay();
startIndex = val0 + 1;
var dayCount = 1;
for (x = 1; x < 38; x++) {
var cell = document.getElementById('cell' + x);
if (x < startIndex) {
cell.innerHTML = ' ';
cell.className = 'firstCell';
}
if (x >= startIndex) {
cell.innerHTML = dayCount;
cell.className = 'filledCell';
for (p = 0; p < fillDate.length; p++) {
if (dayCount == fillDate[p]) {
if (fillDate[p].length == 1) {
fillURL = '0' + fillDate[p];
} else {
fillURL = fillDate[p];
}
cell.className = 'highlightCell';
cell.innerHTML = '<a href="/search?updated-max=' + calYear + '-' + callmth + '-' + fillURL + 'T23%3A59%3A59' + timeOffset + '&updated-min=' + calYear + '-' + callmth + '-' + fillURL + 'T00%3A00%3A00' + timeOffset + '" title="' + fillTitles[fillDate[p]].replace(/"/g, '\'') + '">' + dayCount + '</a>';
}
}
if (dayCount > fill[valxx]) {
cell.innerHTML = ' ';
cell.className = 'emptyCell';
}
dayCount++;
}
}
visTotal = parseInt(startIndex) + parseInt(fill[valxx]) - 1;
if (visTotal > 35) {
document.getElementById('lastRow').style.display = '';
}
}
function initCal() {
document.getElementById('blogger_calendar').style.display = 'block';
var bcInit = document.getElementById('bloggerCalendarList').getElementsByTagName('a');
var bcCount = document.getElementById('bloggerCalendarList').getElementsByTagName('li');
document.getElementById('bloggerCalendarList').style.display = 'none';
calHead = document.getElementById('bcHead');
tr = document.createElement('tr');
for (t = 0; t < 7; t++) {
th = document.createElement('th');
th.abbr = headDays[t];
scope = 'col';
th.title = headDays[t];
th.innerHTML = headInitial[t];
tr.appendChild(th);
}
calHead.appendChild(tr);
for (x = 0; x < bcInit.length; x++) {
var stripYear = bcInit[x].href.split('_')[0].split('/')[3];
var stripMonth = bcInit[x].href.split('_')[1];
bcList.push(stripMonth + ',' + stripYear + ',' + x);
bcNav.push(bcInit[x].href);
}
var sel = document.createElement('select');
sel.id = 'bcSelection';
sel.onchange = function() {
var cSend = this.options[this.selectedIndex].value.split(',');
openStatus();
callArchive(cSend[0], cSend[1], cSend[2]);
};
q = 0;
for (r = 0; r < bcList.length; r++) {
var selText = bcInit[r].innerHTML;
var selCount = bcCount[r].innerHTML.split('> (')[1];
var selValue = bcList[r];
sel.options[q] = new Option(selText + ' (' + selCount, selValue);
q++
}
document.getElementById('bcaption').appendChild(sel);
var m = bcList[0].split(',')[0];
var y = bcList[0].split(',')[1];
callArchive(m, y, '0');
}
function timezoneSet(root) {
var feed = root.feed;
var updated = feed.updated.$t;
var id = feed.id.$t;
bcBlogId = id.split('blog-')[1];
upLength = updated.length;
if (updated.charAt(upLength - 1) == "Z") {
timeOffset = "+00:00";
} else {
timeOffset = updated.substring(upLength - 6, upLength);
}
timeOffset = encodeURIComponent(timeOffset);
}
function togglecomments(postid) {
var whichpost = document.getElementById(postid);
if (whichpost.className == "listshown") {
whichpost.className = "listhidden";
} else {
whichpost.className = "listshown";
}
}
//]]>
</script>
<script chartset='utf-8' src='/feeds/posts/summary?max-results=0&alt=json-in-script&callback=timezoneSet'
/>
Luego buscamos en la plantilla el gadget de Archivo del blog<b:widget id='BlogArchive1' locked='false' title='XXXXXXX' type='BlogArchive'> ....... </b:widget>Borramos todo lo que este entre el Abre y Cierra widget, lo que sería los puntos suspensivos y pegamos este código
<b:includable id='toggle' var='interval'>
<!-- Toggle not needed for Calendar -->
</b:includable>
<b:includable id='interval' var='intervalData'>
Configure your calendar archive widget - Edit archive widget - Flat List - Newest first - Choose any Month/Year Format
</b:includable>
<b:includable id='flat' var='data'>
<div id='bloggerCalendarList'>
<ul>
<b:loop values='data:data' var='i'>
<li class='archivedate'>
<a expr:href='data:i.url'><data:i.name/></a> (<data:i.post-count/>)
</li>
</b:loop>
</ul>
</div>
<div id='blogger_calendar' style='display:none'>
<table id='bcalendar'><caption id='bcaption'>
</caption>
<!-- Table Header -->
<thead id='bcHead'/>
<!-- Table Footer -->
<!-- Table Body -->
<tbody><tr><td id='cell1'> </td><td id='cell2'> </td><td id='cell3'> </td><td id='cell4'> </td><td id='cell5'> </td><td id='cell6'> </td><td id='cell7'> </td></tr>
<tr><td id='cell8'> </td><td id='cell9'> </td><td id='cell10'> </td><td id='cell11'> </td><td id='cell12'> </td><td id='cell13'> </td><td id='cell14'> </td></tr>
<tr><td id='cell15'> </td><td id='cell16'> </td><td id='cell17'> </td><td id='cell18'> </td><td id='cell19'> </td><td id='cell20'> </td><td id='cell21'> </td></tr>
<tr><td id='cell22'> </td><td id='cell23'> </td><td id='cell24'> </td><td id='cell25'> </td><td id='cell26'> </td><td id='cell27'> </td><td id='cell28'> </td></tr>
<tr><td id='cell29'> </td><td id='cell30'> </td><td id='cell31'> </td><td id='cell32'> </td><td id='cell33'> </td><td id='cell34'> </td><td id='cell35'> </td></tr>
<tr id='lastRow'><td id='cell36'> </td><td id='cell37'> </td></tr>
</tbody>
</table>
<table id='bcNavigation'><tr>
<td id='bcFootPrev'/>
<td id='bcFootAll'/>
<td id='bcFootNext'/>
</tr></table>
<div id='calLoadingStatus' style='display:none; text-align:center;'>
<script type='text/javascript'>bcLoadStatus();</script>
</div>
<a href='javascript:togglecomments("calendarDisplay")' title='Click para mostrar'>+/- Ver artículos de este mes</a>
<div class='listhidden' id='calendarDisplay'/>
</div>
<script type='text/javascript'> initCal();</script>
</b:includable>
<b:includable id='menu' var='data'>
Configure your calendar archive widget - Edit archive widget - Flat List - Newest first - Choose any Month/Year Format
</b:includable>
<b:includable id='posts' var='posts'>
<!-- posts not needed for Calendar -->
</b:includable>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + "_ArchiveList"'>
<b:if cond='data:style == "HIERARCHY"'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == "FLAT"'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == "MENU"'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div>
<b:include name='quickedit'/>
</div>
</b:includable>
Se guardan los cambios y probamos el resultado, el calendario se cambia de colores aplicando los estilos que queramos.
|
|
Tweet |
|
<script src='http://sites.google.com/site/rincondelrecursoweb/home/jquery.mystique.min.js' type='text/javascript'/> <script type='text/javascript'> var isIE6 = false; var isIE = false; </script>Las ponemos en ese lugar para que sea lo último en cargar y no dificulte la lectura de la página.
#fancy_overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #FFF;
background: -webkit-radial-gradient(rgba(127, 127, 127, 0.5), rgba(127, 127, 127, 0.5) 35%, rgba(0, 0, 0, 0.7));
display: none;
background: -moz-linear-gradient(rgba(127, 127, 127, 0.5), rgba(127, 127, 127, 0.5) 35%, rgba(0, 0, 0, 0.7));
display: none; }
#fancy_wrap { text-align: left; }
#fancy_loading {
position: absolute;
height: 100px;
width: 100px;
cursor: pointer;
display: none;
overflow: hidden;
background: transparent;
z-index: 100; }
#fancy_loading {
position: absolute;
top: 0;
left: 0;
width: 100px;
height: 100px;
background:transparent url(http: https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjooED7j8M6RzAHE_opLfKYzI9ZFptm3eB-_mYtNv0khyphenhyphenzc6i56RBJAKD6vB7kmrdXpVkiwdxXZ8sCG95iftZrgUtBuPAorMzH2DvtjLrTDnPJEU255t2sJDl0NTNxcWeQ0OHyWEcxKbdha/s1600/loader.gif) no-repeat; }
#fancy_loading_overlay {
position: absolute;
background-color: #FFF;
z-index: 30; }
#fancy_outer {
position: absolute;
top: 0;
left: 0;
z-index: 90;
padding: 18px 18px 33px;
margin: 0;
overflow: hidden;
background: transparent;
display: none; }
#fancy_inner {
position: relative;
width: 100%;
height: 100%;
border-radius: 12px;
box-shadow: 0px 0px 25px rgba(0, 0, 0, .5); }
#fancy_content {
margin: 0;
z-index: 100;
position: absolute; }
#fancy_ {
background: #000;
color: #FFF;
height: 100%;
width: 100%;
z-index: 100; }
img#fancy_img {
position: absolute;
top: 0;
left: 0;
border: 0;
padding: 0;
margin: 0;
z-index: 100;
width: 100%;
height: 100%; }
#fancy_frame {
position: relative;
width: 100%;
height: 100%;
display: none; }
#fancy_ajax {
width: 100%;
height: 100%;
overflow: auto; }
a#fancy_left,a#fancy_right {
position: absolute;
bottom: 0;
height: 100%;
width: 35%;
cursor: pointer;
z-index: 111;
display: none;
outline: none; }
a#fancy_left { left: 0; }
a#fancy_right { right: 0; }
span.fancy_ico {
position: absolute;
top: 50%;
margin-top: -15px;
width: 30px;
height: 42px;
z-index: 112;
cursor: pointer;
display: block;
opacity: 0.5; }
span#fancy_left_ico { left: -9999px; }
span#fancy_right_ico { right: -9999px; }
a#fancy_left:hover { visibility: visible; }
a#fancy_right:hover { visibility: visible; }
a#fancy_left:hover span { left: 20px; }
a#fancy_right:hover span { right: 20px; }
.fancy_bigIframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: transparent; }
#fancy_title {
width: 100%;
z-index: 100;
display: none;
background: #4e4e4e;
color: #fff;
text-align: center;
font-weight: bold;
font-size: 150%;
padding: .2em 0; }No hay necesidad de especificar clases a las imagenes con este script se detectan todas las etiquetas <a> que contenga un enlace a una imagen .jpg, .png o .gif
|
|
Tweet |
|
<b:if cond='data:post.link'> <a expr:href='data:post.link'><data:post.title/></a> <b:else/> <b:if cond='data:post.url'> <b:if cond='data:blog.url != data:post.url'> <a expr:href='data:post.url'><data:post.title/></a> <b:else/> <data:post.title/> </b:if> <b:else/> <data:post.title/> </b:if> </b:if>y lo reemplazamos por este otro
<b:if cond='data:post.link'> <a expr:href='data:post.link' expr:title='"Título: " + data:post.title'><data:post.title/></a> <b:else/> <b:if cond='data:post.url'> <b:if cond='data:blog.url != data:post.url'> <a expr:href='data:post.url' expr:title='"Título: " + data:post.title'><data:post.title/></a> <b:else/> <data:post.title/> </b:if> <b:else/> <data:post.title/> </b:if> </b:if>Pueden variar el texto en Título: por la frase o palabra que quieran que aparezca.
|
|
Tweet |
|
 |
| Estado cerrado |
 |
| Estado abierto |
<style type='text/css'>
.Visible {display: block;}
.Oculto {display:none;}
</style>
<script type="text/javascript" src="http://sites.google.com/site/rincondelrecursoweb/home/author1.0.js" ></script>
<script src="http://rinconubuntero.blogspot.com/feeds/posts/summary?max-results=9999&alt=json-in-script&callback=loadtoc"></script>Por lo que se vera como así.<link rel="stylesheet" href="indice.css" type="text/css" media="screen" />
<style type='text/css'>
.Visible {display: block;}
.Oculto {display:none;}
</style>
<script type="text/javascript" src="http://sites.google.com/site/rincondelrecursoweb/home/author1.0.js" ></script>
<script src="http://rinconubuntero.blogspot.com/feeds/posts/summary?max-results=9999&alt=json-in-script&callback=loadtoc"></script>Y el resultado será el siguiente|
|
Tweet |
|
<script type="text/javascript">
//<![CDATA[
/*-----------------------
* jQuery Plugin: Scroll to Top
* by Craig Wilson, Ph.Creative (http://www.ph-creative.com)
*
* Copyright (c) 2009 Ph.Creative Ltd.
* Description: Adds an unobtrusive "Scroll to Top" link to your page with smooth scrolling.
* For usage instructions and version updates to go http://blog.ph-creative.com/post/jquery-plugin-scroll-to-top.aspx
*
* Version: 1.0, 12/03/2009
-----------------------*/
$(function(){$.fn.scrollToTop=function()
{$(this).hide().removeAttr("href");if($(window).scrollTop()!="0"){$(this).fadeIn("slow")}var scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()=="0"){$(scrollDiv).fadeOut("slow")}else{$(scrollDiv).fadeIn("slow")}});$(this).click(function(){$("html, body").animate({scrollTop:0},"slow")})}});
//]]>
</script>
<script type="text/javascript">
//<![CDATA[
$(function() {
$("#toTop").scrollToTop();
});
//]]>
</script>
<style>
#toTop {
text-align:center;
padding:0px;
position:fixed;
bottom:0px;right:10px;
cursor:pointer;
color:#666;
text-decoration:none;
filter:alpha(opacity=40);
opacity:.50;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; /*--IE 8 Transparency--*/
}
</style>
<span" id="toTop" title="Ir Arriba"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOT4BRe8rsYakIMoCGeNelipFNZkQPzkOTofkZlomfx_6dnV5LPA8HUpRnCMSJfoM3YvX3AgDcUUsmtwF4D0DJrj_ZUpsgq1HPKi-GCxI_gKwWHGiTSLuB8lbNiImH3zbL3gCJTB-K620/s200/arrow8a.png"/>
</span>Y los que no tienen Jquery usen este<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"/>
<script type="text/javascript">
//<![CDATA[
/*-----------------------
* jQuery Plugin: Scroll to Top
* by Craig Wilson, Ph.Creative (http://www.ph-creative.com)
*
* Copyright (c) 2009 Ph.Creative Ltd.
* Description: Adds an unobtrusive "Scroll to Top" link to your page with smooth scrolling.
* For usage instructions and version updates to go http://blog.ph-creative.com/post/jquery-plugin-scroll-to-top.aspx
*
* Version: 1.0, 12/03/2009
-----------------------*/
$(function(){$.fn.scrollToTop=function()
{$(this).hide().removeAttr("href");if($(window).scrollTop()!="0"){$(this).fadeIn("slow")}var scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()=="0"){$(scrollDiv).fadeOut("slow")}else{$(scrollDiv).fadeIn("slow")}});$(this).click(function(){$("html, body").animate({scrollTop:0},"slow")})}});
//]]>
</script>
<script type="text/javascript">
//<![CDATA[
$(function() {
$("#toTop").scrollToTop();
});
//]]>
</script>
<style>
#toTop {
text-align:center;
padding:0px;
position:fixed;
bottom:0px;right:10px;
cursor:pointer;
color:#666;
text-decoration:none;
filter:alpha(opacity=40);
opacity:.50;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; /*--IE 8 Transparency--*/
}
</style>
<span" id="toTop" title="Ir Arriba"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOT4BRe8rsYakIMoCGeNelipFNZkQPzkOTofkZlomfx_6dnV5LPA8HUpRnCMSJfoM3YvX3AgDcUUsmtwF4D0DJrj_ZUpsgq1HPKi-GCxI_gKwWHGiTSLuB8lbNiImH3zbL3gCJTB-K620/s200/arrow8a.png"/>
</span>El código es igual de valido para Blogger o para su propia web, solo se deben agregar las lineas y el trabajo estará hecho.|
|
Tweet |
|
|
|
Tweet |
|
<link href="http://sites.google.com/site/rincondelrecursoweb/home/indice.css" media="screen" rel="stylesheet" type="text/css"></link> <script src="http://sites.google.com/site/rincondelrecursoweb/home/indice.js"> </script> <script src="http://ELNOMBREDESUBLOG.blogspot.com/feeds/posts/summary?max-results=9999&alt=json-in-script&callback=loadtoc"> </script>
<link href="http://sites.google.com/site/rincondelrecursoweb/home/indice.css" media="screen" rel="stylesheet" type="text/css"></link>
<style type="text/css">
.gfg-root { /*Box containing index*/
/*Para cambiar la forma en la que se ve la caja*/
}
.gfg-title { /*Title of the box*/
}
.gfg-title a {
}
.gfg-subtitle { /*The Labels of blog*/
/*Esta es la forma en las que se ven las etiquetas*/
}
.gfg-subtitle a {
/*Color de la etiqueta*/
}
.gfg-entry { /*Inner box*/
/*Diseño de la caja en la que van los titulos*/
}
.gfg-list a{
/*Color y estilo del título de las entradas*/
}
.gfg-listentry {
/*Alineación de los títulos*/
}
.gfg-listentry-odd {
/*Color de fondo del primer titulo*/
}
.gfg-listentry-even {
/*Color de fondo del título siguiente*/
}
</style>
Es necesario saber un poquito sobre css pero en la web existen lugares que nos pueden dar solución a nuestras preguntas sobre ese tema.
|
|
Tweet |
|
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript" src="http://jquery-translate.googlecode.com/files/jquery.translate-1.4.7-debug-all.js"></script>
<script type='text/javascript'>
//<![CDATA[
function doTranslate(lang_pair) {
if(lang_pair.value)lang_pair=lang_pair.value;var
lang=lang_pair.split('|')[1];if(lang=='pt')lang='pt-PT';
jQuery.cookie('glang', lang);
jQuery(function($){$('body').translate('es', lang, {toggle:true});})
}
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
function DoTo(Idioma) {
if(Idioma==1) doTranslate('es|es');
if(Idioma==2) doTranslate('es|en');
if(Idioma==3) doTranslate('es|pt');
if(Idioma==4) doTranslate('es|fr');
if(Idioma==5) doTranslate('es|it');
if(Idioma==6) doTranslate('es|de');
}
//]]>
</script>
<script type="text/javascript" src="http://jq-ingrid.googlecode.com/svn-history/r6/trunk/js/jquery.cookie.js"></script>
<div class="languages">
<table border="0">
<tr>
<td><a href="javascript:DoTo(1)" title="Español"><img alt="Español" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMZd-KfGhZdyhaCC6hHc9U2PMBgd_Vqi5LmuGzUjMveMaTwhYFlRiFKLs0bItIimeQIE_yh6HFgP867T7MEQzztSlY9fy722WsJXJIoPy9LEQ4b2iUGdgTHUXSezNX9kF2SU7gq1BfUcNd/s1600/es.png" width="30"/></a></td>
<td><a href="javascript:DoTo(2)" title="English"><img alt="Inglés" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPlyafMz2EUeAtF3V_MFS-o2B1Gbm9klp8CChiNOyAEf2VqsZ9bryjCwAjY2qvtt8IeucT-J0T6gfqpkwGuk2g2II-rT5s3ty6y0IQM8uhZtXQLByAWUGGsDsyg_aV1niaO1_TEKifGysY/s1600/uk.png" width="30"/></a> </td>
<td><a href="javascript:DoTo(3)" title="Português"><img alt="Portugués" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG5VFkbgBpUBi6Koygk-kkaohF4-lwYtzL3lqCWvJUpUNZRc5O34K8wuZHTQJSnMWGYmW2293tnnSt6VR6QwK6O_xg-TVbMbxbglicxO7A2LtXPHv8pvJL8T8mXQeGW93FsdPBQRDHPTYY/s1600/pt.png" width="30"/></a> </td>
<td><a href="javascript:DoTo(4)" title="Française"><img alt="Francés" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwFjnSLtNbXFvmKStxxyIgLlGWIoA2oESTmkKEmBcZln_46vyVtNabewFXrY4mgwwnGVBlQOCOrfrwMZupZXjvt7bDbpTnv2VzntX7Ge4F4ub2qzFXdrpUgpPK94zUvnemYXQ3jPrmNYQ8/s1600/fr.png" width="30"/></a> </td>
<td><a href="javascript:DoTo(5)" title="Italiano"><img alt="Italiano" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhn1k5fbZhULImIrLqsXpY_FrK-ZnewOOwMrYsbSIU3gy6c9_P-KretDKLm1WFWckZsGRL4q9l_g3eY39JhFsDq6u-xHruCqCoMtEesqxyfgMDOJXhqqRVQdQTb_UlmPYwcr2e3Bv8WOU_a/s1600/it.png" width="30"/></a> </td>
<td><a href="javascript:DoTo(6)" title="Deutsch"><img alt="Alemán" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuFcMh0vEXjp5f-ZmAIQyv1tkVakWhT6_J9mLyRb6uHDDCz9FfEB1W-JF_8FZGCquOv9fUb_ZYt0H59bnnoc26lq8iOGFPondZguHbj-4oK9CdYfSRBDXVDvFIlQqbM1KyxqEPYmvsZLQL/s1600/de.png" width="30"/></a> </td>
</tr>
</table>
</div>
 |  |  |  |  |  |
|
|
Tweet |
|
<div class='post-header'>Y justo debajo agregamos las lineas siguientes
<table class='SocialButtons'> <tr> <td> <iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url+ "&layout=box_count&show_faces=false&width=73&height=61&action=like&font=tahoma&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:75px; height:61px'/> </td> <td> <a class='twitter-share-button' data-count='vertical' data-lang='es' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share'>Tweet</a> <script src='http://platform.twitter.com/widgets.js' type='text/javascript'></script> </td> <td> <g:plusone expr:href='data:post.url' size='tall'/> </td> <td> <a class='google-buzz-button' data-button-style='normal-count' expr:data-url='data:post.url' href='http://www.google.com/buzz/post' title='Post on Google Buzz'/> <script src='http://www.google.com/buzz/api/button.js' type='text/javascript'/> </td> </tr> </table>
]]></b:skin>Y agregando
.post-share-buttons { }
.post-header table.SocialButtons{ width: auto; float:right; /*Para alinear los botones a la derecha debajo del titulo*/}
.post-header table.SocialButtons td{ vertical-align:bottom; /*Alineación vertical de los botones*/ }