Espero que este blog ayude a aquellos que están buscando conocimientos, al igual que yo.
Sígueme en:
Blogger Google+ facebook twitter you yube Ver perfil en Linkedin Agregar a Favoritos/Marcadores
pica pica curioso Mi Ping en TotalPing.com Buscar en el blog
Cerrar X Bienvenido amig@!!! Recuerda que puedes recibir las actualizaciones del blog a través de Facebook y/o Twitter, o Suscríbase al Feed vía RSS o vía Email.

Siempre, Siempre, Siempre, antes de modificar tu plantilla guarda una copia.

Descarga la plantilla o copias el código en el bloc de notas.

¿Que es RSS?:

RSS (Really Simple Syndication)

Es un sistema que nos permite enterarnos de las actualizaciones de las paginas que visitamos frecuentemente, sin tener que visitarlas directamente.

¿Cómo funciona?

Así cómo para poder leer correos electrónicos tenemos que tener una cuenta y un lector de correo electrónico, para poder leer nuestras paginas en RSS tenemos que tener un lector de RSS.
Existen muchos lectores de RSS pero uno de los mas sencillos de usar y mas utilizados por todos es el Google Reader, este lector se encarga de agrupar todos los sitios que visitamos frecuentemente mostrándonos la actualización que cada sitio tiene sin necesidad de ir a visitarlos.
Antes yo entraba a los sitios a mirar si habían publicado algo nuevo, ahora mediante los RSS cuando el sitio publica algo nuevo me llega su actualización.

Sencillo, rápido y útil.
votar
Achicar Entrada Agrandar Entrada

Ya vimos en otra entrada cómo crear el efecto en la parte superior derecha.

Ahora veremos cómo se hace para mostrar el efecto en la parte superior izquierda.

Ver ejemplo:

Los cambios con el anterior son los siguientes:

  • Se muestra a la izquierda.
  • Podemos elegir la distancia a mostrar desde arriba y desde la izquierda.
  • Podemos dejarla fija arriba y que se deslize con la página.
  • Podemos mostrar un texto desplazandose por la imagen chica.
  • Podemos mostrar un texto desplazandose por la imagen grande.

¿Cómo se hace...?

Ahora copiaremos todo el contenido del siguiente código:


Lo copiaremos en un editor de texto. (puede ser el Bloc de notas)

Lo personalizamos de la siguiente forma:

// Distancia desde arriba
var top = "0px"
//
// Distancia desde la izquierda
var left = "0px"
//
//
// cambiar: absolute: fijo arriba - fixed: se mueve con la página
var position = "position:fixed;"
//
// Flash pequeño
var smallflash ="http://img61.xooimage.com/files/1/9/4/smalltopl-23d29d8.swf"
//
// Imagen pequeña
var smallimg ="http://img61.xooimage.com/files/1/2/6/rss-0-23d2a54.png"
//
// Texto en la imagen pequeña
var scrolltxtsmall = "Suscribete"
//
// Tamaño del texto en imagen pequeña
var txtsizesmall = "20"
//
// Color del texto en imagen pequeña
var textcolorsmall = "FFFFFF"
//
//                            IMAGEN GRANDE CUANDO ABRIMOS
//
// Flash grande
var bigflash = "http://img51.xooimage.com/files/7/7/0/bigtopl-23d29cb.swf"
//
// Imagen grande
var bigimg = "http://img52.xooimage.com/files/8/5/4/rss-1-23d2a4f.jpg"
//
// URL al darle clic a la imagen grande
var urlval = "http://feedburner.google.com/fb/a/mailverify?uri=blogspot/qygH"
//
// Forma de abrir
var owindow = "blank" // blank: nueva pestaña - self: en la misma
//
// Texto en imagen grande
var scrolltxtbig = " Suscribete para estar siempre actualizado..."
//
// Tamaño del texto en imagen grande
var txtsizebig = "50"
//
// Color del texto en imagen grande
var textcolorbig = "ff0000"
//

Los archivos flash pueden descargarlos y subirlos a su propio servidor:


Ya terminado de personalizar cambiando imágenes, texto, link, etc..., lo guardamos.

Al guardarlo ponerle el nombre con terminación "js"

Ejemplo: peel-top-left.js

Ahora lo subimos a un servidor.

Puede ser Xooimage.com

Si no saben como, ver el siguiente manual: Tutorial Xooimage

Ya subiro el archivo "js"

Vamos a Diseño, Edición de HTML y justo arriba de </body>

Poner el código así:

<script src='URL del archivo.js'/>

Cambiar: URL del archivo.js por el link propio.

Hacer Vista Previa y si todo quedo bien Guardar.

Tener en cuenta que la URL tiene que terminar en .js y no en .js/

Si lo suben a xooimage.com es el link generado al hacer clic sobre "Télécharger".

Leer Importante... Comentar esta entrada ▼ Ir al principio de la entrada
teofermi dijo...

Hola de nuevo vku, mi comentario no tiene que ver con esta entrada pero es que no encuentro el enunciado para dejartelo, no se si te lo habre preguntado alguna vez,mira, en la pagina de entradas individual, al final sale comentarios,
Publicar un comentario en la entrada, Enlaces a esta entrada, Crear un enlace.
no se lo que tengo que hacer para arreglarlo, me sale casi montado uno encima de otro y me gustaria que me quedara al mismo nivel, si tiene arreglo me gustaria que me ayudaras, como siemore lo haces..
Gracias y perdon por no corresponder a esta entrada

Vku dijo...

teofermi desde Edición de HTML, Expandir plantillas de artilugios.
Busca: <h4>Enlaces a esta entrada</h4>
y ponele antes <br/> a vr si es así como quieres.

teofermi dijo...

@ Vku:
Gracias vku, pero no entiendo..lo que yo quiero es que las lineas no me salgan montadas, sino que haya la misma separacion entre una y otra y si es posible, en el mismo tamaño de letra

Vku dijo...

Yo lo veo asi:
http://img53.xooimage.com/files/2/7/4/t-2416a23.png

y si pones como te dije va a quedar así:

http://img50.xooimage.com/files/5/5/2/t2-2416a49.png

teofermi dijo...

@ Vku:
Creo que no me entiendes..lo tengo todo de pena, el icono de comentarios me sale al lado de "crear un enlace" y las demas lineas de texto, casi unas encima de las otras, y en tamaños distintos...me refiero a la pagina de entradas individuales
No quiero darte la "paliza" pero como otras veces me has ayudado...

teofermi dijo...

@ Vku:
pero sino es con imagen , solo quiero alinear el texto que queda al final de las entradas individuales

Vku dijo...

Yo se lo que es una imagen y un texto.

Te dije que me mandes una imagen de como lo quieres asi como hice yo en las imagenes del comentario 4

Y no probastes con la solución en el comentario 2

Otra cosa que podes hacer es solucionarlo desde Diseño, Elementos de la página en editar en entradas del blog. Ahí lo alineas.

Yo voy a estar un rato en el messenger loseasi@hotmail.com

Vku dijo...

Si quieres modificar el texto fijate que comentarios y Enlaces a esta entrada estan dentro de una etiqueta h4

o sea: h4 {propiedad:valor}

Publicar un comentario en la entrada: es un parrafo con la clase comment-footer

o sea: p comment-footer {propiedad:valor}

y Crear un enlace: tiene la clase comment-link

o sea: comment-link {propiedad:valor}

Todo eso lo modificas en CSS ¿eso lo sabes hacer?

teofermi dijo...

@ Vku:por favor, no queria molestarte con lo de la imagen, si es asi, te pido perdon..lo que me dices de css no se hacerlo

Vku dijo...

Bueno empecemos de nuevo.

vos tenes así:

0 comentarios:

Publicar un comentario en la entrada

Enlaces a esta entrada

Crear un enlace


0 comentarios y crear un enlace con el texto mas grande


¿como queres que quede?

en este momento estoy conectado si quieres

teofermi dijo...

@ Vku:
lo he tenido que dejar, se ha bloqueado el msg, no me deja escribir nada..
si te parece bien seguimos mañana

muchas gracias por tu paciencia conmigo y por tu ayuda

Vku dijo...

ok, borra

h3.post-title, h4 {
font: normal bold 20px 'Trebuchet MS', Trebuchet, sans-serif;;
color: #e31212;
font:bold 20px 'Trebuchet MS',Trebuchet,sans-serif;
margin-left:40px;
margin-top:-30px;
}

teofermi dijo...

@ Vku:
de nuevo por aqui, he borrado lo que me dices..el tamaño del texto ha cambiado, esta todo igual (que es como me gusta), lo que pasa ahora es que no se donde he tocado que "publicar un comentario a la entrada se ha quedado mas desplazado a la izquierda que el resto de las lineas, no estan alineadas ninguna..

teofermi dijo...

@ Vku:Creo que no te he mandado bien mi mensaje, he hecho lo que me dices, lo borre y el tamaño de la letra ha quedado muy bien pero no se si he hecho algo mal o he tocado en algun sitio porque las lineas de los textos han quedado desplazadas,quisiera que estuvieran alineadas y no que estan variadas a la derecha e izquierda..

Vku dijo...

En este código:
h4 { color: #e31212; font:bold 12px 'Trebuchet MS',Trebuchet,sans-serif; margin-left:40px; margin-top:-30px; }

Ajusta el margen: margin-left:40px;

Proba en lugar de 40px pone 30px

teofermi dijo...

@ Vku:
Graciaaa, ya voy consiguiendo algo jajja, lo he arreglado como tu me dices, ya solo me queda un paso mas y sere la persona mas feliz jajja, si te fijas, donde me pone 0 comentarios, me queda mas separado que el resto de las lineas¿tiene arreglo dejarlo a la misma altura que las demas y que todas las lineas empiecen en el mismo sitio?

Vku dijo...

Primero respalda la plantilla por si algo sale mal.

segundo: el margin left ponelo a 25px y el margin-top en 0

despues borra el salto de linea que pusistes el otro día <br>

Fijate como queda y me avisas.

No te confundas hacelo en h4

o sea esto:

h4 { color: #e31212; font:bold 12px 'Trebuchet MS',Trebuchet,sans-serif; margin-left:30px; margin-top:-30px; }

que quede así;

h4 { color: #e31212; font:bold 12px 'Trebuchet MS',Trebuchet,sans-serif; margin-left:25px; margin-top:0 }

teofermi dijo...

@ Vku:
Wawwwwwwwwwwwwwwwwwwwwwww perfecto!!
eres un genio!!!!
Estoy en deuda contigo, gracias y gracias por tu ayuda, por tu paciencia y por tus conocimientos para con los demas!!!
besos

Si tienes alguna opinión respecto a la entrada, tienes un punto de vista distinto, o simplemente quieres saludar, te invito a que dejes un comentario. NO SE ACEPTAN LINKS DE REFERIDOS para que los comentarios no se conviertan simplemente en una forma de publicitarse.



Elegir un botón o imagen, Seleccionar, copiar (Ctrl+C) y pegar en formulario de comentarios.


Nota: solo los miembros de este blog pueden publicar comentarios.

Si no puedes comentar, intenta con el antiguo formularioO leer solución

VituaRadio
Informe Importante

Por un tiempo voy a estar sin internet, así que no voy a actualizar ni poder contestar a los comentarios.
Suscribirse a las entradas Suscribirse a las entradas vía Mail Suscribirse a los comentarios
¿Que es RSS?