¡¡¡Se puede!!!
AVISO IMPORTANTE
Normas de obligado cumplimiento si me envias un mail pidiendo ayuda/consejo
2ª .- Intenta explicar LO MAS CLARAMENTE POSIBLE tu problema.
No pagarás más por escribir más palabras.
3ª . - Si has de contestarme usa la opción RESPONDER.
No abras un nuevo hilo de mensajes.
4ª .- No me envies NUNCA la plantilla si no te la pido.
5ª .- No me envies NUNCA la contraseña.
NO PIENSO ENTRAR A MODIFICARTE NADA.
SI ME DEJAS LA PREGUNTA EN UN COMENTARIO
1º .- Si tienes más de un blog dime en cual está el problema.
2º .- Habilita el perfil para que pueda entrar a ver el blog.
3º .- Si el blog es privado tampoco podré verlo. Invítame.
Y por último: Si quieres que te conteste por mail, envíame la pregunta por mail, mi dirección está en la sidebar, en el botón de arriba que tiene un sobre y en casi todos mis blogs.
| [+/-] |
Borrar mensajes incomodos del cbox |
| [+/-] |
Cambio de plantilla |
En esos blogs, como son operativos, suelo añadir cosas. Los comentarios visibles, el botón de enlace, a veces un contador, etc.
He usado el truco que dejé en esta entrada, pero mejorado.
Ha funcionado perfectamente.
La plantilla nueva se ha colocado en el blog y todas las cosas han continuado en su sitio y no me ha salido el dichoso aviso de: "Confirme que van a eliminarse los siguientes elementos" seguido de la lista de todo lo que no está en la plantilla que quieres poner.
Si quieres saber como, en esta entrada he dejado la explicación.
| [+/-] |
Modificar el Layout |
/** Page structure tweaks for layout editor wireframe */
body#layout #outer-wrapper { (define la zona total)
padding-top: 0;
width: 900px; (define el ancho total)
}
body#layout #header-wrapper { (define la cabecera)
padding-top: 0;
width: 800px; (al ponerle un ancho inferior al total, siempre se verá el Editar)
}
body#layout #crosscol-wrapper { (define la zona donde pongo la menubar)
padding-top: 0;
padding-bottom: 10px; (con esto evito que las columnas de debajo queden montadas en la menubar)
width: 800px; (al igual que en la cabecera, al ser menor que el total siempre se verá el Editar)
}
body#layout #main-wrapper { (define la zona de las entradas)
padding-top: 0;
width: 400px; (como esta zona no es necesario que se vea muy ancha, al ponerle un ancho inferior a la mitad del total las columnas laterales no quedan mal colocadas)
}
Si necesitas copiarlo y haces un copia y pega, recuerda borrar o no copiar las explicaciones.
| [+/-] |
Quitar eso de Publicado por |
Si quieres quitar esa frase que se ve al pie de las entradas y no quieres poner nada en su lugar, tan solo has de buscar este trocito de código en Edición de HTML de la pestaña Diseño, expandiendo los elementos:
<div class='post-footer'>
<div class='post-footer-line
post-footer-line-1'>
<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/>
<span class='fn'><data:post.author/></span>
</b:if>
</span>
y eliminar la línea que ves en azul.
Mención especial a Marian que lo ha descubierto y me lo ha comunicado.
| [+/-] |
El multitraductor |
Este es el código del multitraductor que tengo en la sidebar.
Si quieres usarlo, solo has de copiarlo en un elemento HTML/Javascript, poniendo la dirección de tu propio blog en el sitio indicado.<img src="http://img176.imageshack.us/img176/6091/84056383at1.png"/>
<form id="translateForm" action="http://www.worldlingo.com/S1790.5/translation" target="_blank">
<form id="translateForm" action="http://www.worldlingo.com/S1790.5/translation" target="_blank"><br/><input value="ES" name="wl_srclang" type="hidden"/><br/><select style="font-size: 70%; width: 160px;" name="wl_trglang"><br/><option value="AR"/>Spanish to Arabic<br/><option value="ZH_CN"/>Spanish to Chinese (Simplified)<br/><option value="ZH_TW"/>Spanish to Chinese (Traditional)<br/><option value="NL"/>Spanish to Dutch<br/><option value="FR"/>Spanish to French<br/><option value="DE"/>Spanish to German<br/><option value="EL"/>Spanish to Greek<br/><option value="IT"/>Spanish to Italian<br/><option value="JA"/>Spanish to Japanese<br/><option value="KO"/>Spanish to Korean<br/><option value="PT"/>Spanish to Portuguese<br/><option value="RU"/>Spanish to Russian<br/><option value="EN"/>Spanish to English<br/><option value="SV"/>Spanish to Swedish<br/></select><input value="AQUI LA DIRECCION DE TU BLOG" name="wl_url" type="hidden"/><br/><input style="font-size: 70%; width: 35px;" value="Go" type="submit"/><br/></form><br/></form>
| [+/-] |
Cambiar los triángulos ▼ que hay en el Archivo. |
Si tienes en el blog el elemento Archivo y lo tienes en Jerarquía, como el de aquí, ese sistema en el que se ven las fechas de las entradas y , si no lo has quitado, cuantas entradas has hecho cada mes, o dia o semana, verás que junto a las fechas se ven unos triángulos como este ▼
Pero en este blog lo que se ve es un icono de autor junto a cada fecha.
Aunque hace mucho tiempo que tengo colocado este truco en el blog, nunca hasta ahora se me había ocurrido explicarlo.
Pero hoy Marian me ha preguntado donde estaba la entrada en la que lo explico y me he dado cuenta de que no lo había hecho.
Había dejado un enlace a la entrada que hizo Rosa explicándolo, (que fue de donde saqué yo el truco), en la entrada en la que explico como poner iconos al pie de las entradas, pero no lo expliqué, así que ahora mismo subsano el error.
Has de entrar en Diseño/Edición de HTML y expandir plantillas de artilugios.
Busca esta línea de código<b:widget id='BlogArchive1' locked='false' title='Archivo del blog' type='BlogArchive'>
Cuando la encuentres, baja despacito por el código hasta que veas esto:<span class='zippy toggle-open'>&# 9660; </span>
Y sustituyes este &# 9660; por esto:<img src="URL DE TU ICONO"/>
(Ten en cuenta que el icono ha de ser pequeñito para que no se descontrole demasiado el archivo.)
Pero hay más.
Junto a algunas fechas hay este triángulo ►.
Para cambiarlo, baja un poquito más en el código y encontarás esta línea<span class='zippy'>&# 9658; </span>
sustituye este &# 9658; por el mismo código que has puesto antes.
ADVERTENCIA
| [+/-] |
El triple footer (2ª parte) Otra manera de ponerlo. |
Hoy he querido colocar dos de esas columnas en la Galería de premios, para poner los premios que son más grandes que la medida de la sidebar y he colocado el código, eliminando el de la tercera para que solo quedaran dos.
Pero no quedaba bien.
El contenido de cada columna se integraba en el footer normal, ya que lo tengo tuneado para que tengan fondo y borde, tanto el contenedor como los elementos que contenga.
He ido haciendo pruebas con los códigos y finalmente he logrado mi objetivo.
El doble footer está encima del footer, mantiene las distancias necesarias y tiene las mismas propiedades que el footer. Puedes verlo en directo aquí.
Las modificaciones que he hecho son las siguientes (por si estás interesad@ en hacer algo parecido):
En primer lugar he modificado el código original del footer, que era así:
<div id='footer-wrapper'><b:section class='footer' id='footer'></b:section></div>y lo he dejado así:
<div id='footer-wrapper'>
<div id='footer-bottom'>
<b:section class='footer' id='col-bottom'
preferred='yes'>
</b:section>
</div></div>
Si te fijas, tan solo he añadido la 2ª línea, la identidad del footer normal, llamándolo footer-bottom, para diferenciarlo de los que iba a poner después y el /div de cierre.A continuación he creado una nueva zona, encima de esta, en la que he colocado el código de las columnas, dos en este caso, y, a diferencia del código original para esta zona, que hay en la entrada que he mencionado, he quitado las definiciones de estilo.
La nueva zona ha quedado así:
<div id='footer-wrapper1'>
<div id='footer-columna-contenedor'>
<div id='footer2'>
<b:section class='footer' id='col1'
preferred='yes'>
</b:section></div>
<div id='footer3'>
<b:section class='footer' id='col2'
preferred='yes'>
</b:section></div>
</div></div>
La primera línea define el contenedor.
La segunda define la zona.
El primer grupo que le sigue define una de las columnas. Al decirle que pertenece a la clase del footer (section class) sé que las propiedades que tenga el footer en el CSS las tendrá también la columna. He mantenido las identidades que tenía en el código original, pero, como he dicho, eliminando las definiciones de estilo.
El segundo grupo define la otra columna.
Entonces en el CSS he modificado la definicion del footer añadiendo bottom a su nombre. (En su momento ya había modificado esta zona para que el footer se viera como yo quería).
#footer-bottom {
clear:both;
background:url(la direccion del fondo) repeat;
border: 10px ridge $borderColor;
margin-top: 10px;
padding-bottom: 10px;
padding-top:0px;
_padding-top:6px; /* IE Windows target */
}
#footer-bottom p {
line-height:1.5em;
font:$sidebarFont;
}
Luego he añadido las definiciones de la nueva zona así:
#footer-columna-contenedor{(Con esto he logrado que, en los dos navegadores, las columnas ocupen su sitio)
clear:both;
}
Y las definiciones de cada columna:
#footer2 {
float:$startSide;
width: 500px;
background:url(dirección) repeat;
border: 10px ridge $borderColor;
margin-top: 10px;
margin-bottom: 10px;
padding-bottom: 10px;
padding-top:10px;
_padding-top:6px; /* IE Windows target */
}
#footer2 p {
line-height:1.5em;
font: $sidebarFont;
}
#footer3 {
float:$endSide;
width: 500px;
background:url(dirección) repeat;
border: 10px ridge $borderColor;
margin-top: 10px;
margin-bottom: 10px;
padding-bottom: 10px;
padding-top:10px;
_padding-top:6px; /* IE Windows target */
}
#footer3 p {
line-height:1.5em;
font: $sidebarFont;
}
Como puedes ver he copiado las del footer, ahora footer-bottom, en cada una de las dos columnas, añadiendo a cada una la medida, posición, y retocando, donde ha hecho falta, los padding o los margin para separarlas entre si y del resto.
Los elementos que contienen, ya tenían sus propias definiciones, que se las puse al hacer el blog, así:
.footer .widget {
background:url(la dirección del fondo del elemento);
border: 5px ridge $borderColor;
margin-top:6px;
margin-$endSide:15px;
margin-bottom:12px;
margin-$startSide:15px; padding: 4px;
text-align: center;
font: $sidebarFont;
}
De paso, le he añadido definiciones propias al título de los elementos así:
.footer h2 {
margin: 0 0 10px 0;
padding:5px;
color:$sidebarHeaderColor;
font: $footerFont;
text-align: center;
border: 2px outset $borderColor;
}
Y he creado una fuente para el título de los elementos, (el h2), ya que al ser más grandes que los de la sidebar, necesitaban una fuente mayor.
Si quieres poner tres columnas, basta con añadir el código de la tercera.
| [+/-] |
Poner una imagen junto a las palabras en la lista de etiquetas |
#Label1 li {
list-style:none;
padding-left: 32px;
background: transparent url(http://usuarios.lycos.es/laeulalia/hpbimg/tiquetablava.png) no-repeat center left;
{
En Diseño/Edición de HTML, lo pegas al final de lo que haya bajo esta línea
/* Sidebar Content
----------------------------------------------- */
Si ves que las letras quedan montadas en la imagen, aumenta la cantidad del padding.
Si quedan muy separadas, disminúyela.
Os dejo la dirección de una etiqueta, pero puedes cambiarla por la del icono que desees, teniendo en cuenta de que no sea mayor que la altura de las letras o te separará mucho las palabras.
| [+/-] |
Cambiar de plantilla sin perder nada y que todas las cosas se coloquen en su sitio. |
<div></div>| [+/-] |
Entradas expandilbles con [+ -] |
Para descargarlo: Pincha el enlace con el botón derecho del ratón y del menú que se abrirá pincha, con el izquierdo, en Guardar como... o Guarda el enlace como... lo que abrirá una ventana a tu pc, posiblemente a Descargas o Downloads, a menos que tengas marcado que las descargas se guarden en otro sitio.
Una vez subido, has de entrar en Diseño, Edición de HTML, expandir plantillas de artilugios y, una vez que ha recargado, localizar esto en el código
</head> que está encima de donde empieza la zona del HTML (de todas formas ya sabeis que con Ctrl+F se encuentra lo que buscas enseguida).Una vez localizado, pegas esto justo encima:
<script type='text/javascript' src='aqui la dirección de tu archivo' />
NOTA: Este documento que hay en el enlace AQUI, tampoco se abre, se descarga a tu pc. Se llama Archivos expandibles en etiquetas. Cuando lo tengas en tu pc lo has de abrir con word o no verás su contenido.
Una vez hecho esto, Vista previa para asegurarte de que la página carga bien y Guardar cambios.
| [+/-] |
Música para el blog |








google-site-verification: google6804ea8a89fbde9f.html