91

Añadir una sección con pestañas para incluir gadgets

Gadget-Tabs
Veremos como incluir en la sidebar o sobre las entradas por ejemplo, una nueva sección que nos permita mostrar mediante pestañas diferentes gadget de Blogger (archivos, etiquetas, perfil, etc.)

Incluiremos además, usando variables, la posibilidad de controlar su diseño desde la pestaña "Fuentes y colores" de nuestro panel de Blogger.

Antes de empezar podéis ver un ejemplo funcionando en la sidebar en este blog de pruebas.



[1] Ingresamos a nuestro panel de Blogger -> Diseño -> Edición HTML.

[2] Localizamos la etiqueta </head>.

[3] Copiamos este script y lo pegamos justo antes de esa etiqueta:

<script type='text/javascript'>
//<![CDATA[
document.write('<style type="text/css">.tabber{display:none;}<\/style>');
function tabberObj(argsObj)
{
  var arg;
  this.div = null;
  this.classMain = "tabber";
  this.classMainLive = "tabberlive";
  this.classTab = "tabbertab";
  this.classTabDefault = "tabbertabdefault";
  this.classNav = "tabbernav";
  this.classTabHide = "tabbertabhide";
  this.classNavActive = "tabberactive";
  this.titleElements = ['h2','h3','h4','h5','h6'];
  this.titleElementsStripHTML = true;
  this.removeTitle = true;
  this.addLinkId = false;
  this.linkIdFormat = '<tabberid>nav<tabnumberone>';
  for (arg in argsObj) { this[arg] = argsObj[arg]; }
  this.REclassMain = new RegExp('\\b' + this.classMain + '\\b', 'gi');
  this.REclassMainLive = new RegExp('\\b' + this.classMainLive + '\\b', 'gi');
  this.REclassTab = new RegExp('\\b' + this.classTab + '\\b', 'gi');
  this.REclassTabDefault = new RegExp('\\b' + this.classTabDefault + '\\b', 'gi');
  this.REclassTabHide = new RegExp('\\b' + this.classTabHide + '\\b', 'gi');
  this.tabs = new Array();
  if (this.div) {
    this.init(this.div);
    this.div = null;
  }
}
tabberObj.prototype.init = function(e)
{
  var
  childNodes,
  i, i2,
  t,
  defaultTab=0,
  DOM_ul,
  DOM_li,
  DOM_a,
  aId,
  headingElement;
  if (!document.getElementsByTagName) { return false; }
  if (e.id) {
    this.id = e.id;
  }
  this.tabs.length = 0;
  childNodes = e.childNodes;
  for(i=0; i < childNodes.length; i++) {
    if(childNodes[i].className &&
       childNodes[i].className.match(this.REclassTab)) {
      t = new Object();
      t.div = childNodes[i];
      this.tabs[this.tabs.length] = t;
      if (childNodes[i].className.match(this.REclassTabDefault)) {
    defaultTab = this.tabs.length-1;
      }
    }
  }
  DOM_ul = document.createElement("ul");
  DOM_ul.className = this.classNav;
  for (i=0; i < this.tabs.length; i++) {
    t = this.tabs[i];
    t.headingText = t.div.title;
    if (this.removeTitle) { t.div.title = ''; }
    if (!t.headingText) {
      for (i2=0; i2<this.titleElements.length; i2++) {
    headingElement = t.div.getElementsByTagName(this.titleElements[i2])[0];
    if (headingElement) {
      t.headingText = headingElement.innerHTML;
      if (this.titleElementsStripHTML) {
        t.headingText.replace(/<br>/gi," ");
        t.headingText = t.headingText.replace(/<[^>]+>/g,"");
      }
      break;
    }
      }
    }
    if (!t.headingText) {
      t.headingText = i + 1;
    }
    DOM_li = document.createElement("li");
    t.li = DOM_li;
    DOM_a = document.createElement("a");
    DOM_a.appendChild(document.createTextNode(t.headingText));
    DOM_a.href = "javascript:void(null);";
    DOM_a.title = t.headingText;
    DOM_a.onclick = this.navClick;
    DOM_a.tabber = this;
    DOM_a.tabberIndex = i;
    if (this.addLinkId && this.linkIdFormat) {
      aId = this.linkIdFormat;
      aId = aId.replace(/<tabberid>/gi, this.id);
      aId = aId.replace(/<tabnumberzero>/gi, i);
      aId = aId.replace(/<tabnumberone>/gi, i+1);
      aId = aId.replace(/<tabtitle>/gi, t.headingText.replace(/[^a-zA-Z0-9\-]/gi, ''));
      DOM_a.id = aId;
    }
    DOM_li.appendChild(DOM_a);
    DOM_ul.appendChild(DOM_li);
  }
  e.insertBefore(DOM_ul, e.firstChild);
  e.className = e.className.replace(this.REclassMain, this.classMainLive);
  this.tabShow(defaultTab);
  if (typeof this.onLoad == 'function') {
    this.onLoad({tabber:this});
  }
  return this;
};
tabberObj.prototype.navClick = function(event)
{
  var
  rVal,
  a,
  self,
  tabberIndex,
  onClickArgs;
  a = this;
  if (!a.tabber) { return false; }
  self = a.tabber;
  tabberIndex = a.tabberIndex;
  a.blur();
  if (typeof self.onClick == 'function') {
    onClickArgs = {'tabber':self, 'index':tabberIndex, 'event':event};
    /* IE uses a different way to access the event object */
    if (!event) { onClickArgs.event = window.event; }
    rVal = self.onClick(onClickArgs);
    if (rVal === false) { return false; }
  }
  self.tabShow(tabberIndex);
  return false;
};
tabberObj.prototype.tabHideAll = function()
{
  var i;
  for (i = 0; i < this.tabs.length; i++) {
    this.tabHide(i);
  }
};
tabberObj.prototype.tabHide = function(tabberIndex)
{
  var div;
  if (!this.tabs[tabberIndex]) { return false; }
  div = this.tabs[tabberIndex].div;
  if (!div.className.match(this.REclassTabHide)) {
    div.className += ' ' + this.classTabHide;
  }
  this.navClearActive(tabberIndex);
  return this;
};
tabberObj.prototype.tabShow = function(tabberIndex)
{
  var div;
  if (!this.tabs[tabberIndex]) { return false; }
  this.tabHideAll();
  div = this.tabs[tabberIndex].div;
  div.className = div.className.replace(this.REclassTabHide, '');
  this.navSetActive(tabberIndex);
  if (typeof this.onTabDisplay == 'function') {
    this.onTabDisplay({'tabber':this, 'index':tabberIndex});
  }
  return this;
};
tabberObj.prototype.navSetActive = function(tabberIndex)
{
  this.tabs[tabberIndex].li.className = this.classNavActive;
  return this;
};
tabberObj.prototype.navClearActive = function(tabberIndex)
{
  this.tabs[tabberIndex].li.className = '';
  return this;
};
function tabberAutomatic(tabberArgs)
{
  var
    tempObj,
    divs,
    i;
  if (!tabberArgs) { tabberArgs = {}; }
  tempObj = new tabberObj(tabberArgs);
  divs = document.getElementsByTagName("div");
  for (i=0; i < divs.length; i++) {
    if (divs[i].className &&
    divs[i].className.match(tempObj.REclassMain)) {
      tabberArgs.div = divs[i];
      divs[i].tabber = new tabberObj(tabberArgs);
    }
  }
  return this;
}
function tabberAutomaticOnLoad(tabberArgs)
{
  var oldOnLoad;
  if (!tabberArgs) { tabberArgs = {}; }
  oldOnLoad = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = function() {
      tabberAutomatic(tabberArgs);
    };
  } else {
    window.onload = function() {
      oldOnLoad();
      tabberAutomatic(tabberArgs);
    };
  }
}
/* Run tabberAutomaticOnload() unless the "manualStartup" option was specified */
if (typeof tabberOptions == 'undefined') {
    tabberAutomaticOnLoad();
} else {
  if (!tabberOptions['manualStartup']) {
    tabberAutomaticOnLoad(tabberOptions);
  }
}
//]]>
</script>

[4] Algo más arriba de donde hemos colocado el script veremos la etiqueta ]]></b:skin> y justo sobre ella colocamos el código CSS:

/*-- Inicio sección pestañas --- */
.tabberlive{
margin:0;
padding:5px;
clear:both;
background:$tbbxbgcolor;
border:1px solid $tbbxbrcolor;
}
.tabbernav {
margin:0;
padding: 3px 0;
border-bottom: 1px solid $tbbxbrcolor;
font-family:Arial,Helvetica,sans-serif;
font-size:12px;
font-weight:bold;
}
.tabbernav li {
list-style:none;
margin:0;
display:inline;
}
.tabbernav li a {
padding:3px 0.5em;
margin-right:1px;
border:1px solid $tbbxbrcolor;
border-bottom:none;
background:$tbbxcolor2;
text-decoration:none;
color:$tbbxcolor1;
}
.tabbernav li a:hover {
color:$tbbxcolor2;
background:$tbbxcolor1;
border-color:$tbbxbrcolor;
text-decoration:none;
}
.tabbernav li.tabberactive a,
.tabbernav li.tabberactive a:hover {
background:$tbbxcolor1;
color:$tbbxcolor2;
border-bottom: 1px solid $tbbxcolor1;
}
.tabberlive .tabbertab {
padding:5px;
border:1px solid $tbbxbrcolor;
border-top:0;
background:$tbbxcolor1;
}
.tabberlive .tabbertab h2,
.tabberlive .tabbertabhide {
display:none;
}
.tabbertab .widget-content ul{
list-style:none;
margin:0 0 10px 0;
padding:0;
}
.tabbertab .widget-content li {
border-bottom:1px solid $tbbxbrcolor;
margin:0 5px;
padding:2px 0 5px 0;
}
/*-- Fin sección pestañas---*/

[5] Guardamos los cambios en la plantilla.

[6] Una vez hemos guardado los cambios, localizamos la zona de la plantilla (casi a comienzo de su código) la zona donde están incluidas las variables, será algo así:

Variables

[7] Copiamos el código de las nuevas variables que vamos a añadir y lo pegamos justo después de la última variable de nuestra plantilla (antes del cierre de las mismas: */)

<Variable name="tbbxbgcolor" description="Tab box Background Color" type="color" default="#f8f8f8" value="#f8f8f8">
<Variable name="tbbxbrcolor" description="Tab box Border Color" type="color" default="#dcdcdc" value="#dcdcdc">
<Variable name="tbbxcolor1" description="Tab box Color 1" type="color" default="#ffffff" value="#ffffff">
<Variable name="tbbxcolor2" description="Tab box Color 2" type="color" default="#5588aa" value="#5588aa">

[8] Para terminar la instalación, localizamos esta línea en la plantilla: <div id='sidebar-wrapper'> y pegamos este código justo debajo:

<div class='tabber'>
<b:section class='tabbertab' id='tab1' maxwidgets='1'/>
<b:section class='tabbertab' id='tab2' maxwidgets='1'/>
<b:section class='tabbertab' id='tab3' maxwidgets='1'/>
<b:section class='tabbertab' id='tab4' maxwidgets='1'/>
</div>

[9] Guardamos cambios y comprobamos si la nueva sección para añadir gadgets está disponible en Diseño:

Gadget Tabs Diseño

Modificaciones:
* Los números en azul son los números de cada pestaña. Para añadir un gadget a una de las pestañas, pinchamos en el número de la pestaña y añadimos el gadegt que queremos o arrastramos uno que ya tengamos incluido y que queramos mostrar ahí.

* De esta manera la nueva sección de pestañas aparece al comienzo de nuestra sidebar, si queremos mostrarla al final de la misma, desde Edición HTML localizamos dentro del código de la plantilla su ubicación Y movemos ese código justo sobre el </div> de cierre del código de la sidebar.

Colocación sidebar tabs

* Si quisiéramos mostrar la sección de pestañas sobre las entradas, tendríamos que colocar el código (paso [8]) justo después de <div id='main-wrapper'>

* Los cambios como antes os decía del color del borde, las pestañas o el fondo de la "caja", los haremos desde nuestro panel en Fuentes y colores viendo los cambios en Vista previa.

Tabs colores


Entradas Relacionadas:

91 comentarios:


And3rz0n

Gracias Rosa!

Muy buenos detalles, lo probare en mi blog.

Saludos desde Perú :)

pasaralaunacional.com

Wow.

Suena tentador.
Te prometo que lo probaré, porque me puede resultar sumamente util.
Saludos Rosa.

Felipe.

Jennifer

Hola Rosa,
Gracias por compartirnos detalles como estos que siempre son utiles.
Cuando tenga un tiempo la probare sin falta.
Un saludo desde el Rincon de la Psicologia

José GDF

Esto me puede venir bien más adelante, pero me lo tengo que mirar con mucha calma. Me lo anoto y ya lo haré. ;)

Midrez

Hola Rosa.

Implementé este buen gadgets, sin embargo cuando traslade el gadgets seguidores me aparece vacío diciendo "¡Sé el primero!", ¿Sabrías como arreglarlo?

Rosa

Midrez No tengo idea porque pasa eso... y no creo tenga que ver con este gadget... en mi blog de pruebas tengo el "seguidores" dentro del gadget y antes estaba fuera con un seguidor que se mantubo en el traslado...
Prueba desde ahí a eliminar el Seguidores y a volver a incluirlo ahí mismo de nuevo...

Midrez

Es extraño, pero no funcionó :-|

Cometa Azul

Muy bueno, lo probare.
AHORA QUIERO SABER, COMO PUEDOBPONER UN
POWER POINT EN EL BLOG ???
GRACIAS.

@rielCastellanos

Comata azul, utiliza scribbs.

Rosa, una pregunta, no soy un genio en esto, pero a tu criterio, este gadget realentiza el blog o no? yo pienso que no, una vez tuve uno y ese si, pero es que usaba google sites x el archivo js

Gracias, cuidate!

La hormiguita

Muy bueno!!!!!
gracias. :)

Nolo

Hola Rosa, lo habia visto en algun blog y me ha gustado mucho, gracias.

Pero, algo hice mal porque aunque lo veo en la pestaña de "Añadir y organizar elementos de la página" cuando le doy a guardar cambios y accedo al blog no esta y los gatches que le añadi no se ven en ningun sitio ¿que ocurre?

Un saludo http://nolo4939.blogspot.com/

Rosa

Midrez Si es raro y no tengo ni idea de porque te pasa eso además :S

Rosa

Cometa Azul Usando Slideshare por ejemplo:
http://www.slideshare.net/lalunaesmilugar/tutorial-de-slideshare

Rosa

@rielCastellanos Si es externo el alojamiento y allí hay problemas, ya sabes que influye en la carga... este está en la misma plantilla lo cual evita ese problema... aunque todo dependerá de si el blog ya está bastante cargado...todo lo que añades suma peso en un blog.

Rosa

Nolo Pues no tengo ni idea... si sale el gadget debería de funcionar correctamente, pues si algo hubiese ido mal el gadget no sale...

Dark David

buen post rosa, pero tengo una consulta diferente y es la siguiente: me gustaria hacer lo siguiente si es que se puede: por ejemplo si ves mi blog http://www.fullseries.org/ solo muestro los titulos de los post, bueno hasta alli ya esta bien, pero me me gustaria que en vez de que saliera antes del titulo del post osea [+/-] tenga una imagen personalizada, por ejemplo que la etiqueta de peliculas tenga su propia imagen como se ve al lado de los post donde estan las imagenes que dicen
Anime
Biblioteca
Celulares
Conciertos
Curiosidades
etc...
ellas tienen una imagen disintiva y me gustaria que cuando etiquetara un post automaticamente tuvieran esas imagenes me gustaria mucho que me ayudaras y creo que seria muy bacano lograr a ser eso porque si es asi nos estariamos hacercanos hacer algo parecido a worpress

Dark David

Opor lo menos una idea :((

Carlos Ventura

Hola Rosa:Me ha pasado lo mismo que a Nolo en el comentario numero 11, en la petaña de diseño todo muy bien pero a la hora de acceder al blog no sale nada. Algo debe de andar mal..

Linextelia

Lo acabo de probar en mi blog y me encantó como quedo, funciona a la perfección..

Gracias por los consejos..

Cargohe

Hola rosa quiero implementarlo, pero antes te tengo una consulta es si al ponerlo en pestaña se perderá el efecto Scrollbars en los widgets, por ejemplo mira en mi blog los widgets Ultimas publicaciones y Archivos del Blog que son los que quiero poner en pestañas y tienen ese efecto Scrollbars.
Espero respuesta y Gracias.

Patri O.

Hola Rosa, qué cosas tan interesantes nos enseñas siempre ^^ Antes de ponerme a destripar la plantilla, sólo se puede colocar arriba o abajo del todo? gracias por todo!

Rosa

Dark David En Oloblogger hay una entrada sobre como mostrar imágenes o iconos en lugar de las etiquetas en las entradas... mira si eso te sirve o al menos te orienta en lo que necesitas: http://oloblogger.blogspot.com/

Rosa

Carlos Ventura Pues como le dije a Nolo, ni idea :S quizá una errónea colocación de la sección...

Rosa

Cargohe Si arrastras o mueves de lugar, por ejemplo de la sidebar a sobre el main un gadget, este conserva sus propiedades... este caso es el mismo, es una nueva sección añadida como podría ser una nueva sidebar, no tiene porque afectar al diseño del gadget.
Es una pregunta además que tu mismo habrías resuelto haciendo la prueba.

Rosa

Patri O.Arriba, abajo o sobre el main... para hacerlo de otra manera ya habría que retocar el diseño de otras cosas en la plantilla...

Dark David

si rosa ya entre al blog, sera que me puedes orientar en que etiqueta de ese blog busco el tema es que veo que tienen muchos temas y se parecen bastantes y soy malo para identificar a que tema corresponde ese te agradesco

MALINA

Rosa wapaaaaaaaa!! que ganas tenía de ver este post. Lo guardo para cuando tenga tiempo de implantarlo.
Graciasssss

Rosa

Dark David Deja la pregunta allí y Oloman te lo indicará o en Vagabundia que también hay algo parecido o como eso que buscas.

Joni_rod

Muchas gracias, me ha sido muy util para un nuevo blog sobre Arte que estoy iniciando.

Rosa

MALINALo iba dejando... pero al fin salió! :D
¡Besotes!

MALINA

Estaba segura de que lo sacarías cuando tuvieses tiempo. Además eres única para explicarlo de forma fácil. :)

Mil y un besos!

Joni_rod

Rosa! Tengo una duda. Como se puede modificar el tipo de letra, así como tamaño y color de la fuente correspondiente al título de la pestaña?

Me gustaría ponerlo del mismo color que tengo atribuido para los títulos en la sidebar, pero no se como :S

Muchas gracias.

Trecarunga

¡Muy bueno Rosa! Como siempre ;)

Rosa

Joni_rod En esta parte del CSS, ahí cambias la fuente, tamaño y demás por los que tengas en la sidebar:

.tabbernav {
margin:0;
padding: 3px 0;
border-bottom: 1px solid $tbbxbrcolor;
font-family:Arial,Helvetica,sans-serif;
font-size:12px;
font-weight:bold;
}

Joni_rod

Rosa yo tengo estos parámentros en el tabbernav, y aun así no se ve como tiene que ser. Ya que esos mismos parámentros son los que siguen los titulos de la sidebar, y como podrás ver no se parecen en nada.

http://historidarte.blogspot.com/

.tabbernav {
margin:0px;
padding:3px 0;
border-bottom: 3px solid #dcdcdc;
font-family:tahoma,arial,helvetica;
font-size:14px;
font-weight:bold;
font-color:#313131;
}

Rosa

Joni_rod ¿Qué no se parecen?... no se como miro yo entonces :o los veo idénticos...

El Moderador

Muy buena la info, muchas gracias!! Sigue asi que es un blog fenomenal!

Fernando

Una pregunta muy tonta:
Por qué tienes un blog?

Rosa

Fernando ¿Y porque no tenerlo? ;)

CяιsтιαиGσиzαlєz

Wow muchisimimas gracias Rosa, el truco es genial.

Saludos y de nuevo gracias por compartir ^^.

Toxik Boys

tremendo, muchas gracias

Jose Manuel

buenísimo! :) tengo solo una pregunta, como colocarlo en el lado derecho del blog?, mas no abajo o al final.

Jaimevazquez15

Rosa Una pequenña pregunta no puedo lograr que salgan los numeros solo salen añadir gadget 4 veces seguidas, que estoy haciendo mal, ya le intente varias veces pero no logro cambiar.

Rosa

Jose Manuel Si esa posibilidad fuese tan sencilla como las demás, la habría incluido en la entrada. En mitad de la sidebar Blogger no admite, así que habría que hacer una nueva sidebar para ponerla justo debajo, con lo que si entonces sería posible que se viese en el medio.

Rosa

Jaimevazquez15 ¿No te habrás dejado algo sin poner o estará mal colocado?... por ejemplo el CSS (paso [4])

Noe Cerati

hola rosa es excelente esto pero no se que hice mal espero y te puedas dar vuelta a mi blog y me digas que hice mal

es este
http://noepruebas.blogspot.com/

Noe Cerati

ya no, lo solucione jeje

Nena

Hola Rosa!
Visitandote otravez.
Fijate que lo intente pero yono tengo lo de las variables :S
¿Que puedo hacer?

Rosa

Noe Cerati ¡Me alegro! :D

Rosa

Nena Fíjate que a comienzo casi del código de tu plantilla hay una etiqueta como esta:
<b:skin><![CDATA[/*

Justo debajo pegas las variables que están en esta entrada, pero lo haces colocando sobre ellas esto:
/* Variable definitions
====================

y recuerda al final que esté el simbolo de cierre también... este: */

Nena

Hola Rosa! :)
Fijate que hice lo que me dijiste y se guardaron los cambios bien, ahora el problema es que en lugar de salir los numeros sale "agregar gadget" 4 veces :S y ya lo verifique y todo esta exactamente igual como dijiste.

Rosa

Nena Fijate si no has colocado en mal lugar el código CSS del paso [4]

Favole

Hola! Lo primero decirte que tienes un blog estupendo y los trucos que pones son realmente útiles, ya he utilizado varios ;)

Quizás mi pregunta es un poco tonta pero, ¿Se puede utilizar este gadget en una plantilla de dos columnas? porque realmente me gustaría ponerlo ^^

Un abrazo!

Rosa

Favole ¿Cuando dices "dos columnas" a que te refieres?...en Blogger una plantilla con dos columnas es la mía por ejemplo...

Favole

Ups perdón, creo que me he explicado mal XD

Quiero decir que tengo dos sidebar, una a la izquierda y otra a la derecha, pero solo me gustaría poner el gadget en una de ellas.

Arepa

ROSa: al igual que a Jaimevazquez15 me sale 4 solapas añadir gadget seguidas arriba que puedo hacer para que salgan los numeros bien ? yo coloque todo bienn que pasa ??

Miguel Ángel Vázquez Vera

Muy buenas noches. Soy seguidor de tu blog desde hace tiempo y la verdad es que me ha ayudado muchisimo. Me ha surgido una duda que no consigo resolver de ninguna manera.

Lo que quiero hacer es darle un color al background del titulo de los post, pero quiero que el color solo esté en la parte que ocupa el texto.

He conseguido darle color, pero me ocupa todo el ancho de la entrada, o en cualquier caso, puedo controlar el ancho, pero no se como ajustarlo automaticamente al texto del titulo de la entrada.


Estoy desesperado la verdad, he inspeccionado los codigos de 8 web a ver si lo conseguía así, pero no hay manera....

Sabes alguna forma de conseguirlo?

Arbe de Lelis

Hola Rosa, me parece genial tu publicación, pero no encuentro en mi plantilla la palabra sidebar-wrapper, ¿Se deberá a que recién hoy acabo de crear un blog en Blogger y los términos han cambiado?, Antes yo podía encontrar la palabrita en mi blog antiguo de Blogger. Ha cambiado la terminología?

Rosa

Favole Puede ponerse si, lo único que si la sidebar es muy estrecha no podrás añadir tantas pestañas... te aconsejo pruebes antes en un blog de pruebas y verás por ti misma como funciona el gadget...

Rosa

Arepa Me es imposible saber si como dices has hecho todo bien, para eso tendría que verlo aplicado en el blog... lo único que puedo decirte es que si todo está bien colocado tendría que salir.

Rosa

Miguel Ángel Vázquez Vera Veo que ya lo has conseguido... no era muy dificil solo con las propiedades adecuadas en un .post h3 a{

Rosa

Arbe de Lelis Si la plantilla es del nuevo diseñador de plantillas Blogger, si, ha cambiado y no puedo saber si esto sirve... muchas cosas no dan resultado en esas...

Favole

Ok! Muchas gracias Rosa, probare a ver que tal...

Un beso ^^

Nena

Hola Rosa! sobre mi problema, siguen apareciendo 4 veces agregar gadget, pero en la pagina si se muestran las pestañas, creo que asi lo dejare ya que volvi a hacer el procedimiento y me sigue apareciendo igual, no me falta nada.
Bueno muchas gracias :D

Miguel Ángel Vázquez Vera

AL final lo consegui si, pero tuve que bajarme una plantilla y desmontarla para ver dónde fallaba, y si te soy sincero, ni lo sé....

Quería preguntarte como sería el codigo para ponerle un background a un texto cualquiera, que este alojado en una caja de texto común

Rosa

Nena ¿Pero el gadget funciona?... fíjate en el comentario anterior de Miguel Ángel...tenía el mismo problema y lo logró...

Rosa

Miguel Ángel¿A que le llamas "caja de texto común"?

Favole

Hola! Bueno ya he probado el gadget y al igual que a otras personas en Diseño>Elementos de la página, me salen 4 gadget seguidos, pero a diferencia de los "normales" solo me deja poner un elemento en cada uno y luego se visualiza a la perfección. Así que probarlo porque aunque aparezca así funciona!

:D espero que os sirva de ayuda

Rosa

Favole Es que es solo para un gadget por pestaña.

nochesamarillasg

hola rosa,quièro saber,por favor,cómo añadir una sección pero "sin pestañas" para incluir gadgets "sóbre" la sidebar (te comento que busqué por todas partes y aún sin resultados) un saludo y muchas gracias. chris...

hacker1742

hola sabes lo intente pero por mas que intento no me sale asi como tu lo tienes ayuda lo hago todo como indicas me podrias ayudar mi correo es rafis1742@hotmail.com gracias de antemano
lo unico que sucede es que me salen 4 de lo que dice añadir gadget arriva de el primero que estaba es lo unico que pasa no sabes porque

Rosa

hacker1742 Lee comentarios anteriores.
No escribo a nadie al correo...contesto donde se me pregunta.

Alfredo

:D Hola rosa mira yo tengo implementado el nuevo código de plantillas en mi blog, ese que se hace con el diseñador de plantillas al ingresar a blogger in draft, y quería ingresar esta sección para reducir espacio. y no sale como debería aparecer.

Rosa

Alfredo No atiendo consultas para las nuevas plantillas, hasta que no pasen al Blogger "normal"... aún andan en pruebas y cambios en su código y he decidido esperar el sistema esté implementado para tratar de entender los nuevos códigos.

Alfredo

:( Bueno esta bien, voy a ver si puedo corregirlo! pero gracias de todas formas por responderme, se te agradece

SHORELESS

ROSA TENGO UNA DUDA PODRE CAMBIAR LA FUENTE DE L BLOG POR LA DE HALO 2 PORQUE LA DECARGUE PERO NO SE CAMBIAR LA LATRA TE LO AGRDESCO

Rosa

SHORELESS Si cambias la fuente del blog por una que tus visitas no tengan instaladas en sus navegadores, es como si no hicieses nada... hasta tu para ver la fuente tendrás que instalarla antes en tu PC.

DIEGO RODRIGUEZ

hola. exelente post.
una pregunta .
quisiera hacer algo parecido pero dentro de una entrada.
en la cual poner texto en una solapa, fotos en otra etc..
como tendria que ser el codigo?
gracias

AvenidaCero

Hola Rosa... como siempre tus trucos funcionan de maravilla... GRACIAS!

En este truco en particular, como puedo poner esta seccion con pestañas el el medio de la sidebar y no al principio o al final... quiero poner un widget normal con otro contenido sobre ella...

Saludos!!

arquitectura online

hola Rosa estea bueno este post! pero tengo un problema, que no tengo variables creo o no los encuentro no estan :S. ayudame! gracias

Dstello

Hola Rosa! Antes que todo mil gracias por tu blog, y contestar a todas las preguntas de todos. Vaya es impresionante la cantidad de trucos que das desinteresadamente a todos para mejor sus blogs. He utilizado varios de tus consejos. Y quería saber si me puedes ayudar :( Siempre al pasar el cursor sobre las fotos existía la posibilidad de agrandarlas y verlas completamente. Ahora por más que doy click en algunas fotografías no logro que se abran :( aparte al pie de pagina dice "Null" no se a que se deba esto. Ojala me puedas orientar y darme tu consejo. Te lo agradecería de todo corazón, Ane

Rosa

Dstello Veo que en algunas entradas se abren sin problemas y en otras no... la verdad que no consigo ver la diferencia ni cual puede ser el motivo, aunque me inclino a pensar que es algo al editar las entradas, quizá al pasar de la pestaña HTML del editor a la de Redactar, a veces hay algún código que se daña... desde luego ha de ser seguramente ahí, al editar la entrada, y ahí yo no puedo alcanzar a ver el problema...

Dstello

Gracias Rosa!!! Agradezco mucho que te hayas tomado el tiempo de verlo :) . Al ver tus observaciones creo que el error esta cuando muevo las fotografías dentro de la entrada. Algo raro pasa :o bueno tratare de tener más cuidado al colocarlas y tratar de no moverlas . Gracias wapa, siempre leo tus posts :) tienes un blog super interesante y me encanta que exista gente como tu que ayuda a todos desinteresadamente! Eso es ayudar con PASIÓN! Mil Graciasssss! :), Ane

Doc Samson

Rosa, ante todo darte las gracias por todo tu trabajo.
Al intertar usar esto no consigo que salgan los números solo salen añadir gadget 4 veces seguidas, he visto que le pasa a mas gente, me he leido todos los comentarios y no encuentro una solución.

He repetido todo un montón de veces,comprobados los codigos,y esta todo igual que lo muestras tu en los sitios correctos.
Sabes que duede ser?

Rosa

Doc Samson Pues sinceramente no :$ explico los pasos tal como yo misma los hice y en mi caso ese es el resultado... supongo que tendrá que ver conque el script no sea compatible con algún otro añadido en la plantilla, pero solo es una suposición mía, basándome en que el código es un script y que en otras ocasiones ha pasado esto...

Doc Samson

ok, gracias revisare todo el codigo

Rokuta

Buenos días/noches Rosa. Vengo leyendo tu página hace rato y me es muy útil. Te quería hacer una consulta. Es posible agregar dos veces está sección con pestañas? O se puede hacer únicamente una vez?

saludos

Rosa

Rokuta Tal y como está, solo una vez, para poder usar otra habría que modificar bastantes parámetros en todos los códigos, como todos los ids, variables y demás...

Make-up by Maryland

Necesito ayuda :(

Me encantaría poner esto en mi blog pero en mi plantilla no aparecen los códigos de "variable" por lo que no se donde añadir esa parte del código en mi plantilla, ¿me podrías ayudar?

Gracias de antemano

Rosa

Make-up by Maryland No se si esa plantilla admitirá variables aunque se las coloques, lo dudo... si así fuese irían después de: <b:skin><![CDATA[/*

Make-up by Maryland

Gracias Rosa, probaré a ver qué sale :)

Publicar un comentario en la entrada

Si vas a dejar una consulta, procura tener habilitado tu perfil en Blogger o deja la url del blog a revisar (no enlace).

Los comentarios están siendo moderados.

:) :(( :( :P :D :$ ;) :I :X :O |O :S