Delicious LinkedIn Facebook Twitter RSS Feed
Showing posts with label Generador. Show all posts
Showing posts with label Generador. Show all posts

Como mostrar códigos dentro de los posts



Cuando queremos mostrar un código en un posts o entrada, blogger lo interpreta como tal.

Si no queremos que se ejecute dicho código lo tenemos que convertir o codificar.

Lo podemos hacer manualmente o con ayuda de una página que se encarga de eso.

Los ejemplos mas comunes son:
  • < = &lt;
  • > = &gt;
  • & = &amp;
  • " = &quot;
Por ejemplo si queremos mostrar el código de una imagen seria así:

<img scr="URL"/>

Tendríamos que poner en nuestro posts de la siguiente manera:

&lt;img scr=&quot;URL&quot;/&gt;

Mostrar un link:

<a href="http://URL=">Link</a>

Y lo pondríamos así:

&lt;a href=&quot;http://URL=&quot;&gt;Link&lt;/a&gt;

Yo tengo mi propia página que se encarga de codificar y también de decodificar.
La pueden encontrar en mi sidebar junto con otras utilidades, la pueden utilizarla tantas veces sea necesario.

Acá les pongo el link de la página, es la primera utilidad.

Su nombre es: Escape HTML / Parse HTML

Crea un Botón de un blog para la Barra de Google (Otra Forma)

Ya vimos una forma en esta: entrada

("Puedes darles a tus lectores la posibilidad de añadir un botón de tu blog en la barra de Google así pueden tener acceso directo o realizar búsquedas en tu blog.")

En este caso es para que tu agregues el botón de la página que mas te guste o la que mas visitas realizas. 

Deben tener instalada la barra Google.

Si la página que quieren crear el botón tiene incorporado el buscador de google, lo hacen del mismo blog, como muestro en el paso 1. Si no lo tiene tendrían que hacer todos los pasos.

Pueden utilizar el buscador que se encuentra en mi blog, como en este ejemplo.

Yo voy a hacer un botón del blog de mi amiga Rosa "DeJoTaS Radio". (Aunque en el blog ya tiene la opción de incorporarlo directamente.)

Paso 1:
Hacemos click con el botón derecho del mouse en la caja de búsqueda y ubicamos en el recuadro "Generar búsqueda personalizada...", donde hacemos nuevamente click.



Aparece la siguiente ventana con los datos del blog (en este caso el mio).



Le damos en Añadir.
Notaremos como de manera parpadeante, aparece el botón en la barra.
 


Ya tenemos el botón añadido. (fácil ¿no?)

Si el blog no tiene el buscador seguir con el siguiente paso.

Paso 2:
Hacemos click con el botón derecho del mouse en el botón creado y ubicamos en el recuadro "Opciones del botón etc...", donde hacemos nuevamente click.

 

En la ventana que se abre le damos click en: "Utilizar el editor avanzado..."

 

Ahí cambiamos los datos:
  1. Description: Ponemos lo que queremos del blog.
  2. Ponemos la dirección del blog o página.
  3. Igual que el 2.
  4. El Titulo del blog o página.
 

Fijarce los cambios y cerrar salvando.

 


 

Le damos en Sustituir y despues cerramos con Close Window.

 
Aceptamos y guardamos.

Notaran el cambio en el botón en la barra de google.

 

Ya tienen listo el botón personalizado.

Si quieren cambiar la imagen por una personal leer la otra entrada.


Y no se olviden de visitar DeJoTaS Radio.

Generador online imágenes habbo

De que se trata, ver algunos ejemplos:

              



En solo 3 pasos:
  • Escribir el texto
  • Seleccionar estilo del texto   
  • Apretar botón "Generar"




Ir a la página:

También lo pueden encontrar en mi sidebar "Páginas Recomendadas" Generadores.

Generador online de ribbon


Un ribbon es una cinta o tira que se pone en la esquina superior derecha de la página.

Quick Ribbon es una página que se encarga de generarlos.

Hay varias opciones y diseños para elegir.

Al darle en el botón "Generate Ribbon!" se crea un código JavaScript el cual pegaremos en Edición de HTML justo arriba de </head>

Hay otras opciones que yo aconsejo utilizando un código CSS.

Primero tenemos que descargar la imagen, verán que al generarla se muestra en la parte superior o al darle al botón "Apply".

Nos ponemos sobre la imagen con el cursor y con el botón derecho del mouse le damos a Guardar imagen como...

Ahí la subimos a nuestro servidor, que puede ser mismo blogger.

Luego copiamos la dirección de nuestra imagen.

Nos vamos a Edición de HTML y justo abajo de <body> pegamos el siguiente código:

Para que quede arriba de nuestra página:
<img src="URL de nuestra imagen/ribbon.gif" style="position: absolute; right: 0; top: 0;" />
Para que quede fija arriba y se vea siempre:
<img src="URL de nuestra imagen/ribbon.gif" style="position: fixed; right: 0; top: 0;" />

Gadget nuevo para mostrar comentarios de twitter - español

Hice un gadget el cual muestra los últimos o todos los comentarios que hacemos en TWITTER.

Queda así:



Se puede poner en la sidebar o donde mas les guste.

Se adapta al tamaño tanto en ancho como en altura.

Tiene varios aspectos que se le pueden modificar que mostrare mas adelante.

Ahora detallo como incrementarlo.

1- Vamos a diseño ahí elegimos añadir un gadget:



2- Poner como muestra la imagen en el buscador vku:



3- Elegir cualquiera de los 2, son iguales:



4- Elegimos las opciones que mas nos gusten o se adapten a nuestro blog:



5- a: Título: Ponemos el que mas nos guste.
    b: Altura: Dejamos como esta ya que se adapta a la altura final.
    c: Twitter username: Ahí ponemos el login de Twitter.
    d: Número de actualizaciones a exhibir: Ponemos las que queramos mostrar, si ponemos 1, muestra todos(no es aconsejable), recomiendo de 2 hasta 5 comentarios.
    e: Mostrar link a su página twiter: Muestra un link texto (Sigueme en twitter) que nos lleva a nuestra página en twitter. Se marca si se quiere mostrar.
     f: Mostrar imagen link twitter: Lo mismo que lo anterior pero el link es con una imagen. Se desmarca si no se quiere mostrar.
    g: Color del link: Ahí ponemos el color que tendrán los link.
    h: Color de fuente: Es el color del texto del comentario.

Cada ves que se efectué un cambio apretar en actualizar para ver como esta quedando.



Acá se ve como cambie por 4 comentarios, el color del texto, color de los link y cambie la imagen por el  link en texto.



6- Ya efectuado todos los cambios apretar en guardar, igualmente después se puede editar nuevamente.

Ahora solo lo colocan en el lugar que prefieran simplemente arrastrando como cualquier otro gadget.

La diferencia que tiene este gadget es que esta en español. 

Ejemplo:

La imagen y texto con el link a su página twitter.
A lo último del comentario muestra los minutos, horas y días en español.
Un icono de twitter al inicio de cada comentario.

Crea un Botón de tu blog para la Barra de Google


Puedes darles a tus lectores la posibilidad de añadir un botón de tu blog en la barra de Google así pueden tener acceso directo o realizar búsquedas en tu blog.

Para empezar descargar el archivo que tenemos que modificar con nuestros propios datos para después alojarlo a un servidor.

Descargar slashdot_button.xml

Acá mostraré de que se trata el archivo slashdot_button.xml y que modificar.

<?xml version="1.0" encoding="UTF-8"?>
<custombuttons xmlns="http://toolbar.google.com/custombuttons/">
<button>
<title>¿Cómo se Hace...?</title>
<feed>http://loseasi.blogspot.com/feeds/posts/default?alt=rss</feed>
<description>¿Cómo se Hace...?</description>
<search charset="UTF-8">http://loseasi.blogspot.com/search?q={query}</search>
<site>http://loseasi.blogspot.com/</site>
<icon mode="base64" type="image/x-icon">
AAABAAYAEBAAAAEACABoBQAAZgAAACAgAAABAAgAqAgAAM4FAAAwM
AAAAQAIAKgOAAB2DgAAEBAA
AAEAIABoBAAAHh0AACAgAAABACAAqBA
AAIYhAAAwMAAAAQAgAKglAAAuMgAAKAAAABAAAAAgAAAA

AQAIAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAAAAGpti/8JGaf/ChvA/wkbsv8GEYH/BxFm/0BFcf9JTGv/BQ+B/w0fvf8ZLdL/Gymx//Dw8P/Nzc7/LTm9/1xp6P8RIsb/CBmr/wobs/9cYpT/gIOc/wgW
mf8ZJ8X/ZnHh/3t/qP+8vcL/cXWo/2htpf8wPLf/TVTI/8TEyP/r6+v/g4ap/2lupv/HyMv/v728......................mucho mas...........................................AAAAAAAA==
</icon>
</button>
</custombuttons>


Todo lo que esta en rojo hay que cambiarlos por sus datos e imagen.

Para que se entienda que son cada una.

Entre las etiquetas <title></title> ahí va el titulo del blog.

Entre las etiquetas <feed></feed> ahí va la URL Feed del blog.

Esto es para que salgan en el botón las ultimas entradas y así poder ver las actualizaciones del blog.(En lo personal no lo utilizo.)

Entre las etiquetas <description></description> ahí va la descripción que mostraremos al colocar el puntero del ratón encima del botón.

Entre las etiquetas <search></search> ahí va la URL del blog seguido de /search?q={query} para el buscador.

Entre las etiquetas <site></site> ahí va la URL del blog.

Entre las etiquetas <icon></icon> ahí va imagen que se mostrara en el botón.

Como verán la imagen lleva una codificación base64 (texto plano). (esta codificación también se utiliza en diseño web para que no se puedan robar las imágenes.)

Pueden ser imágenes BMP, ICO, GIF y JPEG de 16 x 16 (si es mas grande no importa); tan sólo deberás codificarlas en texto ASCII mediante base64. (página online para hacerlo.)
Solo subirla donde dice "examinar" y apretar en "Convert the source data" luego copiar y pegar el código generado.

Se modifica abriendo el archivo slashdot_button.xml con un editor que puede ser el bloc de notas.

Guardar los cambios.

Después de hacerle sus propias modificaciones ya hay que alojarlo al servidor.

Ahora solo queda crear un enlace para poder añadir el botón con tan sólo un clic.

Cómo enlazar tu sitio a tu botón:
http://toolbar.google.com/buttons/add?url=url

Donde url señala el archivo XML del botón personalizado.

Ejemplo:
<a href="http://toolbar.google.com/buttons/add?url=http://página del olojamiento/slashdot_button.xml">Añadir botón</a>

Este es solo un ejemplo ustedes pueden crear otro tipo de enlaces como un botón, etc...


Dedicado a Rosa del Escaparate.

Y no se olviden de visitar DeJoTaS Radio.