Terminemos con la barra en el footer y empecemos a agregar el contenido de los elementos ocultos. Teníamos tres cosas que mostrar usando los botones Feedburner, Twitter y Facebook.


Como dije, puede ser cualquier cosa y, en estos ejemplos, copié el formulario de suscripciones en uno, coloqué el script para conectarse con Twitter en otro y puse una imagen en el tercero.

En todos los casos, lo hice exactamente igual que lo haría si tuviera que agregarlos en la sidebar o en cualquier otra parte del blog.

Terminado eso, volvemos a la edición HTML de la plantilla y agregamos unas definiciones CSS que dimensionarán esos elementos y los ocultarán:
/* el contenedor Twitter */
#HTML7 {display: none; width: 400px;}
/* el contenedor Feedburner */
#HTML8 {display: none; width: 240px;}
/* el contenedor Facebook */
#HTML9 {display: none; width: 260px;}
Como el estilo por defecto será "ocultos", si fuéramos a la solapa Elementos de la página no los veríamos así que no podríamos editarlos; para que esto no ocurra, es decir, para que esten ocultos en el blog pero visibles en esa ventana de edición, agregamos esto, también en la parte de estilo:
body#layout #footer-tools #HTML7 {display: block;}
body#layout #footer-tools #HTML8 {display: block;}
body#layout #footer-tools #HTML9 {display: block;}
Ahora, haciendo click en cada ícono, se mostrará ese contenido y volviendo a hacer click, se ocultará tal como podemos verlo en este DEMO online.

El script que pusimos al inicio es el que controla eso y consigue que sólo se muestre uno por vez, permutando la propiedad display.

No es necesario que todos los elementos se oculten y sean mostrados mediante íconos, también podríamos agregar accesos a gadgets que se ejecutaran directamente en la barra. Agreguemos dos más: un buscador y un ícono para abrir un formulario de contacto.

El primero, será un elemento Cuadro de búsqueda (id = CustomSearch1) y el segundo, otro elemento HTML (id = HTML2) que dependerá del formulario que usemos.

Luego, otra vez en la plantilla seguimos agregando CSS para esos elementos:
#CustomSearch1 {
background: transparent url(URL_imagen) no-repeat left top;
height: 35px !important;
padding: 15px 0 0 60px;
width: 180px;
}

/* y algún efecto extra sobre los íconos */
#contacto, #feedburner, #twitter, #facebook {opacity: .8; filter: alpha(opacity=80); }
#contacto:hover, #feedburner:hover, #twitter:hover, #facebook:hover {opacity: 1; filter: alpha(opacity=100);}
Otra vez, si es necesario, volvemos a cambiar el ancho de #footertools-barra-inner (ahora requiere 590 pixeles) ... veremos esto.

Y así podríamos seguir hasta el infinito, agregando cosas y haciendo que se muestren en la barra de manera directa o bien colocando enlaces para que se abran en ese DIV superior que permanece oculto hasta que lo necesitamos.

El proceso será siempre el mismo. Si se trata de íconos que abren ventanas modales:
  • agregamos un elemento HTML en la barra inferior
  • agregamos un elemento cualquiera en la barra superior y le ponemos el contenido
  • tomamos nota del ID que se muestra en Edición HTML
  • colocamos las propiedades necesarias (fundamentalemente su ancho)
  • volvemos a editar el ícono y usamos el ID del elemento oculto para agregar la imagen y el enlace que ejectua el script
Si se trata de elementos que no requieren desplegarse:
  • agregamos ese elemento en la barra inferior
  • colocamos las propiedades necesarias en Edición HTML

El resultado final es el de este DEMO donde los contenidos son sólo simulaciones o bien copias de distintos gadgets de este mismo blog.

REFERENCIAS:Parte 1 Parte 2

56 comentarios:

Antony  

Eres un genio... Debió ser difícil el trabajo. Pero muchas gracias por compartirlo con nosotros. ;)

Responder
OCP  

[google translate on]
Usted es un genio. He hecho algunos cambios de menor importancia y estoy usando. Yo prefiero esta barra en lugar de la originale Wibiya, que nunca me gustó el design.
[google translate off]
Bom trabalho. :)

Responder
Eulalia  

¡Chapeau!
Dentro de poco veremos todos los blogs con esta barra, jeje.
Un abrazo.

Responder
Nicoliense  

Muy buena la barra, me gusto mucho por que no trae creditos ;) ejeje

Y aparte el trabajo, aunque al principio me confindi, pero despues entendi

Responder
Graciela  

he venido siguiendo las secuencias Don Jmiur pero sabe usted que no coloco estas cositas en mi blog.
Genial, tu explicación es clarísima besos de jueves por la tarde :D

Responder
JMiur  

Antony: Genio, no. Llevó trabajo SIIIIIIIII :D

OCP: ¡¡¡Excelente!!!!!!! :D

Eulalia: Jajajaja. Espero que te haya gustado la idea.

Nicoliense: Parece engorroso pero, no, no lo es tanto ¿Créditos? No, para nada ... los odio :D

Graciela: No se preocupe, ya terminó, demos vuelta la hoja y sigamos con otra cosa :D

Responder
Anahí  

JMiur, tengo un problema con este chiche: al poner el "display none" me desaparece en diseño, y con el body#layout no se ne arregla. Y si no lo pongo, me aparecen bodoques en la pag. princip ... :o
quizás tenga que cambiar la clase o algo así? Gracias.
Es acá : pruebasdeanahi.blogspot.com
Saludos.

Responder
JMiur  

Eso sí que es un problema, Anahí porque body#layout debería funcionar. es algo que no puedo ver online per, llegado el caso, me envias la plantilla y la pongo en un blog de pruebas a ver si pasa lo mismo.

Responder
Anahí  

JMiur, yo creo que algo anda mal con mi "layout" , porque también me aparecen cosas que creería que no deberían aparecer, pero como hasta ahora no molestan, ahí están...
Saludos.

Responder
JMiur  

Anahí:
Por lo que veo de la plantilla, el problema es que haces referencia a un DIV llamado footer-tools pero, ese DIV no existe así que, en lugar de esto:

body#layout #footer-tools #HTML7 {display: block;}
body#layout #footer-tools #HTML8 {display: block;}
body#layout #footer-tools #HTML9 {display: block;}

deberías poner esto:

body#layout #footertools-contenedor #HTML7 {display: block;}
body#layout #footertools-contenedor #HTML8 {display: block;}
body#layout #footertools-contenedor #HTML9 {display: block;}

y entonces sí, esos tres elementos estarían ocultos en el blog pero visibles en la edición de la plantilla.

Responder
Anahí  

Ahora sí me funcionó, JMiur, gracias :)
Y ya que estoy confianzuda, le quiero preguntar, ¿hay alguna manera de que los flash no "pasen por delante" de la barra? Espero se entienda lo que digo.
Saludos.

Responder
JMiur  

Me alegro, Anahí.

Pufff eso de los Flash si es complicado. Podrías probar agregándole una propiedad a la barra que queda fija:

z-index: 10000;

o algo así, un número alto ... sólo es un intento :$

Responder
conejo - trasmitiendo desde playa del carmen Qrro.  

que onda carnal yo quiero poner unos botones en mi blogg pero no ayo como ponerlos sera k me puedas ayudar por mas que lo hago no me sale mira este es mi msn crazy_blas@hotmail.com te lo agradeceria si me ayudaras graciar jmir

Responder
JMiur  

Tendrías que explicarme qué has hecho y qué quieres hacer.

Responder
Sheldon  

Muy bueno el post, yo justo hace un tiempo hice algo parecido -lo de agregar botones- solo que no era en una barra ni era tan complicado creo jeje.. en fin, solo queria saber como hacer para que en el boton de facebook que e puesto, cuando alguien le haga clik, peuda compartir el post que esta viendo en ese momento xq ahorita esta solo para que comparta la pagina principal.. tambien quieira que eso pasara con lso demas botones, que funcionene con la apgian que esta viendo en ese mismo momento, no el d la pagina principal.
yo e puesto lso botones en una lista (theall-knowing4.blogspot.com).. bueno en fin lo unico que m gustaria saber es qué debo hacer para q compartan, twiteen, agregen al delicious, agregen a sus favoritos d techonoratti, agregen a stumbleupon/digg la pagina que esta viendo en ese momento y no la pagina principal como esta ahora

Responder
JMiur  

No hay una respuesta única, cada servicio es diferente del otro y los códigos son largos. Este, por ejemplo es para eviar posts a Facebook

<a expr:href='&quot;http://www.facebook.com/share.php?u=&quot; + data:post.title + data:post.url' title='Facebook'>
ENLACE
</a>

Responder
info espectro autista  

Hola Jmiur !!!
Soy absolutamente novata, novatisima en estos temas de los blogs. Empecé a averiguar y leer desde hace unos meses y quiero ver todas las posibilidades antes de hacer un blog.
Por ejemplo, hablando de herramientas, quiero poner en la "plantilla de entrada" para que salga en cada post las opciones de imprimir post, guardar como pdf y enviar por mail el post, los 3 iconos juntos como se suele ver en webs . He visto cada cosa por separado pero no me hago la idea de como hacer que aparezcan juntos al pie de cada post.
No quiero ni empezar a hacer mi blog sin tener esto claro....Manias de cada uno, no?
Una ayudita????
Saludos desde Paraguay

Responder
JMiur  

Eso no es problema, puede hacerse, pero es complicado de explicar en abstracto; los códigos a colocar son, probablemente, esos que has visto separados, colocar los tres íconos uno al lado del otro será sólo cuestión de pulirlos y colocarles propeidades CSS adecuadas pero, debería ver un ejemplo de lo que estás haciendo. Colócalos todos, aunque se vean mal y me muestras.

Responder
info espectro autista  

Ok !!!! Gracias por contestar!!!
Voy a hacer una entrada como me gustaria que fueran!!!
Gracias otra vez
Desde que empecé a "estudiar" y que ubique tu blog no me lo pierdo, es espectacular!!!Saludos !!!!!..
Ana Laura

Responder
Siamo  

HELP! I need somebody..

Hago todo al pie de la letra y asi me lo acepta blogger: http://img98.imageshack.us/img98/4182/dibujowiu.png

sfuori@gmail.com, por favor que alguien me ayude!!

Responder
JMiur  

Es que estás copiando literalmente. Colocas propiedades en #HTML4 #HTML5 #HTML6 y #HTML7 sin tener en cuenta si esos son o no son los IDs de los elementos que has agregado en tu plantilla. Debes fijarte cuáles son los IDs que se corresponden con tu ejemplo.

Responder
Siamo  

Sisi, ya me di cuenta de eso, pero sigue sin funcionar!! No aparece la barra gris vacia cuando comienzo, en lo que seria el primer post sobre este tema!!

Responder
JMiur  

Tu blog dice ahora:
#footertools-barra {
background:transparent url(URL_unaimagen) repeat-x scroll left top;
allí no hay ninguna imagen colocada.

Tampoco hay nada dentro del #footertools-barra, ningún elemento agregado.

Responder
Alex Aguilar  

Hola JMiur, nuevamente solicitando tu ayuda... pues resulta que cambié la plantilla de mi blog y quisiera añadirle elementos (widgets), solamente en la parte de hasta abajo... o sea, necesito tener un footer... e ir agregando otros elementos. Pero, a pesar de que seguí algunas instrucciones del blog de Gem@, en ésta plantilla no logro encontrar lo que ella plantea... ésto es: Añadir elementos en página de "Diseño" (widgets). Dice que en la parte de hasta abajo de la plantilla, busque: b:section class='footer' id='footer'/ y que lo sustituya por: b:section class='footer' id='footer' showaddelement='yes', pero no encuentro esa parte, solamente tengo ésto:
/div> !-- end content-wrapper --
/div /div !-- end outer-wrapper -- /div /div
div id='footer-bg'
div id='footer'

y cuando quiero sustituir el último párrafo, me sale ésto:
The element type "b:section" must be terminated by the matching end-tag ""

Por otro lado, al final de la plantilla vienen algunos links del autor y supuestamente no debemos eliminarlos... eso no me importa, lo que si quisiera es que si alguien dá click allí, que se abra otra ventana... pero al manipular la plantilla, cuando le pongo el famoso target='_blank' (antes de href), no quiere guardarla... me dice:
Element type "a" must be followed by either attribute specifications, ">" or "/>".

Estos links vienen así:

(c) Copyright 2010 a expr:href='data:blog.homepageUrl'><data:blog.title/ /a. Designed by a alt='Blogger Templates' href='http://www.deluxetemplates.net/' Blogger Templates /a /div
div class='fright' Supported by a href='http://www.foxvacations.com' All-Inclusive Cancun Vacations /a , a href='http://www.qualityarticle.net' Quality Article /a , a href='http://www.navsari.in' Navsari /a
/div
/div
/div

Me podrías ayudar?.... mil gracias!

Responder
JMiur  

Supongo que lo que dice es algo así:

<div id="footer-bg">
<div id="footer">
.................. aquí esta lo que ahora tiene ..................
</div>
</div>

Y deberías agregar la seccion así:

<div id="footer-bg">
<div id="footer">
<!-- AQUI AGREGAS LA SECCION -->
<b:section class='footer' id='footer' showaddelement='yes' />
.................. aquí esta lo que ahora tiene ..................
</div>
</div>

Eso de "aquí esta lo que ahora tiene" es el copyright que es muy interesante porque no sólo muestra al autor sino que incluye enlaces a sus sponsors lo que en lo personal, me parece una práctica abusiva. Como mínimo, eliminaría esos sponsors:

<div class="fright"> .......... </div>

No veo por que uno debería estar haciendo publicidad de manera gratuita, si siguen así, mañana pondrán un cartel de Tome Coca-Cola o un aviso de McDonald porque le hacen un descuento en las hamburguesas, es algo tan miserable que yo, eliminaría todo de un plumazo pero, eso queda a tu criterio.

No hay problema en agregar target; sería así:

<a target='_blank' href="http://travel-blog-deluxetemplates.blogspot.com/'>

Responder
Alex Aguilar  

JMiur... muchas gracias por tu pronta respuesta... mira, solamente dejé el link del autor y quité su publicidad de vacaciones... pues mi página es precisamente del tema y obviamente no desearía competencia...
Pero bueno, al margen de ello... ya le puse la leyenda de: b:section class='footer' id='footer' showaddelement='yes'/
Pero aún así, no me aparece el elemento (gadget) en la plantilla de diseño y no entiendo la razón...
Luego, no comprendí muy bien lo que me dices de !-- AQUI AGREGAS LA SECCION --
A qué sección te refieres?... Pues únicamente deseo que aparezcan los widgets o gadgets para poder añadir cosas a mi página y solamente me interesa en el pié de página... ojalá y puedas ayudarme... mira, de cualquier manera, aquí te mando lo que ya puse y lo que ya eliminé, en la parte final de mi platilla:
/div !-- end content-wrapper --

/div /div !-- end outer-wrapper -- /div /div


div id='footer-bg'
div id='footer'
b:section class='footer' id='footer' showaddelement='yes'/

!-- Remmeber!!! This free Blogger template is licensed under the Creative Commons Attribution 3.0 License. You are required to keep the footer links intact which provides due credit to its Author and Supporters. If you have plan to remove any link, its better for you, not to use the template. --

a expr:href='data:blog.homepageUrl' data:blog.title/ /a . Designed by a alt='Blogger Templates' href='http://www.deluxetemplates.net/'Blogger Templates/a /div
/div

a href='#header' onclick='new Effect.ScrollTo("header",{offset:-140}); return false'><img alt='Subir' border='0' src='http://digitalbucket.net/download/351811d9c5d732a0/top.png' style='position:fixed; bottom:0; right:0;'/ /a

/body
/html

Responder
JMiur  

Si está colocado algo como esto:
<b:section class='footer' id='footer' showaddelement='yes'/>
lo que has hecho, es agregar una sección que es lo que se requiere para luego, agregar gadgets allí y deberías poderla ver en la primera ventana de diseño como un enlace abajo.

Si no expandes la plantilla, vas a ver como los widgetes estan siempre dentro de una sección.

Lo que puede ocurrir es que la plantilla tenga algunas propeidades extrañas. Podrías probar agregarlo de este modo, arriba del footer actual:

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>
<div id="footer-bg">

Como no sé que plantilla es, no es mucho mas lo que puedo agregar.

Responder
Alex Aguilar  

Cómo podré hacer para enviarte el archivo?... quizás lo puedas checar tú mismo, porque por más que le hago, según tus instrucciones, no se puede... podrás decirme si aceptas que te envíe el archivo del blog?

Responder
JMiur  

Hay una parte en tu plantilla que dice:

body#layout #footer {
display:none;
}

Elimínala y verás la sección en la parte de Diseño.

Responder
Alex Aguilar  

Genio, genio y más que genio!!!... ya lo pude hacer JMiur... de verdad muchísimas gracias!!!!!!... un gran abrazo desde México!!!

Responder
Alex Aguilar  

JMiur, como siempre, te diré que eres mi ídolo!!! : )

Oye, una pregunta: estuve viendo lo de añadir elementos en la barra de herramientas... muy interesantes por cierto...
Pero te quería comentar que en la plantilla que te mandé, en la página de "Diseño", en donde editas Entradas del Blog, éste tiene la función de mostrar botones para compartir... así como reacciones, etiquetas, fecha, etc... ésto viene siendo lo mismo que propones en éste artículo?... me refiero a la función...?

Pues bueno, a reserva de tu respuesta,resulta que yo tengo activada la casilla de botones para compartir, pues viene twitter, facebook, etc... pero éstos no aparecen, en el cuerpo de la entrada, como deberían, ya que los otros elementos sí aparecen...

Mira, para que me entiendas mejor... te voy a enviar una imagen que copié y pegué... y nuevamente la plantilla de mi blog, a ver si me puedes ayudar...

Nuevamente mil gracias por todo... espero tu respuesta... salu2

Responder
JMiur  

Las opciones que ves en la pantalla de Diseño son comunes a todos los blogas in importar la plantilla que se use y son opciones para las entradas. En princiipo, el footer del blog tiene siempre información mñas general y lo que acá se explica es sólo una forma de poner esa información que puede ser cualquier cosa y en los ejemplos, no hay nada que sea igual a las opciones de Blogger.

PAra el tema de los bootones apra compartir, deberías ver esta entrada porque es posible que la plantilla no tenga el código necesario para mostrarlos en cuyo caso, deberás agregar la línea correspondiente:

<b:include data='post' name='shareButtons'/>

Responder
Eduardo I. Grotteschi  

Hola JMiur, muy bueno el posto! Te hago una consulta, siver para usarse fuera de Blogger? es decir quiero agregarlo a mi web y estuve tocando, no me funciono del todo asi que epece a realizar cambios, antes de seguir queria saber si iba a funcionar o no...

Por ejemplo el tab <b:widget.... puede ser que eso sea un div? el b: es solo de blogger?

En cuanto a ocultar la barra, cuando le doy click la barra se cierra pero los iconos no se ocultan y quedan por detras del boton cerra, hay posibilidad de ocultarlos?

Gracias!

Responder
JMiur  

Sí. Puedes adaptarla para cualquier tipo de página web. Sólo debes eliminar los códigos de Blogger. Como bien dices, los b:widget son solo DIVs así que basta reemplazar las etiquetas.

Lo del problema de los íconos, deberías revisar primero que los IDs sean correctos. Si me muestras el ejemplo online, me fijo.

Responder
Eduardo I. Grotteschi  

Hola! bueno algo pude hacer al final, te paso la pagina:
http://www.locosxelprode.com.ar/prode/tabla_mensaje.php

igualmente te consulto, estoy queriendo que el logo dle usuario y el nombre se vayan a la izq, pero no va, no se porque como qeu todos se van al medio... ademas, me podras guiar ocmo para armar la barra pero que tenga un 80% de ancho y quede centrada? se podra hacer eso?

en cuanto al boton de colapsar contraer, fijate que cuando escondo las cosas se ven que van x atras... eso hay forma de ocultarlo?\\

Gracias por tomarte el tiempo de contestar! Abrazo.

Responder
Eduardo I. Grotteschi  

tiro una mas antes de que contestes la anterior (anque algunas cosas las pude hacer ehh! jajaja) tengo el widget de twitter, pero veo en todos lados que el twitt sale completo y en el mio, como que me pone 1 linea de detalle y el resto no se donde va a parar, no se si se entiende, x ejemplo:

Twitt: Hola estamos probando la aplicacion nueva que va a salir
En mi widget solo veo: Hola estamos probando la.

El resto no lo veo, como que es mas grande el contenedor y sigue de largo, se entiende? pero no se porque... en la web del widget aparecen bien pero en mi pagina no...

Responder
JMiur  

No sé donde se ve eso, Eduardo. Puede ser muchas cosas, tal vez tiene definida una altura y la propiedad overflow, por ejemplo.

Responder
Eduardo I. Grotteschi  

bueno, para que no te compliques, no te calentes que pude solucionar todo! lo de twitter y lo de la barra! jajaja una duda, queria que en vez de colapsar hacia la izq lo haga hacia abajo y despues, aparezca subiendo (tipo barra de infobae.com) sabes de algun efecto? estoy tratando de ver si consigo algo con prototype y scriptacolous...

Responder
JMiur  

Para eso debes modificar los scripts. Habría que repensarlo todo.

Responder
Eduardo I. Grotteschi  

volvi! perdon qeu te joda, tenes algo de idea sobre prototype y scriptaculous? porque arme al barra y la hice que se esconda y aparezca, pero el tema es que no puedo hacer, que cuando se esconda aparezca otro botón por encima, para que me permita darle click y hacer que aparezca otra vez la barra... se entiende? Abrazos

Responder
JMiur  

No; eso no sabría respondertelo.

Responder
TheLukasWeb  

He instalado la barra, la he personalizado y va perfecta salvo una cosa: al entrar en un blog se abren todos los gadgets de la barra uno encima de otro ocupando todo el ancho y largo de la pagina, solo se pueden quitar ocultandolos pulsando en sus iconos. ¿Sabeis por que puede ser?
Gracias
P.D.: A pesar de ese fallo es perfecta, es justo lo que buscaba.

Responder
JMiur  

Creo que lo que te falta, es definir las reglas para esos gadgets; debes hacerlo uno por uno, agregándoles a todos display:none y dándoles un ancho; algo así:

#HTML6 {display:none;width:300px;}
#HTML7 {display:none;width:300px;}
#HTML8 {display:none;width:300px;}
#CustomSearch1 {display:none;width:300px;}

el valor de width, dependerá del contenido que coloques en cada uno; puede ser cualquiera y pueden ser todos diferentes.

Responder
TheLukasWeb  

Ya lo tengo añadido pero sigue pasando. Lo que yo no he puesto, porque no lo iba a utilizar, es el boton para ocultar la barra, ¿puede influir?

Responder
JMiur  

En http://www.thelukasweb.com/ no veo que hayas colocado esas reglas de estilo. No se ven en el código fuente.

Responder
TheLukasWeb  

Es que http://www.thelukasweb.com/ es la pagina de inicio donde quiero colocar la barra es en la pagina principal http://www.thelukasvveb.com/ (las dos vv simulan una w)

Responder
JMiur  

No veo diferencias entre estas dos URLS:
http://www.thelukasweb.com
http://www.thelukasweb.com
de todos modos, la barra, ahora está en el home y en las entradas individuales, sin embargo, el estilo sólo está afectando al home porque probrablemente, lo hayas condicionado para que no se ejecute en las páginas individuales.

Responder
Manolo  

Hola oye el padinng del contendigo oculto tambien me afecta a en las imagenes del footer, como puedo soulucionar eso?

Responder
JMiur  

Tendría que ver el ejemplo concreto.

Responder
Manolo  

Hola amigo mira aqui esta la pagina en donde lo estoy elaborando http://paginawebpruebas.es.tl/

lo que pasa es que el padding de los elementos ocultos tambien le afecta a los botones de facebook, ultimas entradas etc. espero tu respuesta

Responder
Manolo  

Hola amigo aqui esta la pagina en donde estoy elaborando la barra http://paginawebpruebas.es.tl

lo que pasa es que el padding de los elementos ocultos tambien afecta las imagenes del footer, espero tu respuesta :)

Responder
JMiur  

Porque en esa plantilla estás usando unca clase genérica apra todos los widgtes de la p´´agina, sean los que sean y etén donde estén.

.widget {
background-color: #E4E4E4;
border: 2px solid #000000;
border-radius: 10px 10px 10px 10px;
margin: 0 auto;
padding: 10px;
}

Si esos cambios quieres que sólo afecten a algunos, debes indicar a cuales; por ejemplo:

#footertools-barra .widget { ......... }

Responder
Manolo  

Hola JMIUR, ya hize lo que me dijiste pero aun siguen viendonse las imagenes con el padding :( ,

si le pongo:

#footertools-barra .widget { ......... } El contenido oculto se ven los cvuadros del contenido oculto transparente.

y asi:
#footertools-contendor .widget { ......... } Asi ya se ve bien, el problema es que las imagenes del footer se quedan con el padinng de estos y se ven mal las imagenes de dicho footer.

ve otra ves a mi pagina en donde lo estoy elaborando
http://paginawebpruebas.es.tl
espero tu respuesta JMIUR

Responder
JMiur  

No sé qué padding quieres sacar o poner. Allí dice padding: 10px; si eso te mosta, simpleente lo eliminas.

Responder
Safer321  

hola amigo... disculpa yo eh implementado tu tutorial a mi blog www.writersperu.blogspot.com esta en construccion aun, mira quiero hacer dos barras una se muestra arriba y el otro abajo... se podra? mil gracias por tu ayuda.

Responder
JMiur  

Es posible, debes hacer lo mismo pero cambiar los IDs por otros, las funciones y rehacer el CSS. No es poca cosa :D

Responder

¿Quiere dejar un comentario?

recuerde que los comentarios están siendo moderados y serán publicados a la brevedad ...

Todos los archivos y demos alojados en Fileden han sido redireccionados y deberían estar funcionando correctamente.
De todos modos, también puede accederse a ellos a través de SkyDrive

Nota: sólo los miembros de este blog pueden publicar comentarios.

Si le gusta ir a lo seguro utilice este botón para abrir los comentarios en una ventana modal en esta misma pagina.

Si añora tiempos idos, use este enlace para agregar un comentario al viejo estilo ...

 
CERRAR