Como crear un tabla en blogger

Para crear una tabla en blogger es necesario que tengamos ciertos conocimientos basicos para poder entender como funciona una tabla. Los principales codigos que se utilizan son:
table.- Esto indica que comienza una tabla o acaba.
tr.- Esta es una etiqueta que se usa para crear una nueva fila.
td.- Esta es una etiqueta que se utiliza para crear una nueva columna.
Bien conociendo estos conceptos basicos procedemos a crear el codigo para crear una tabla.

<table border=1><td>Columna 1, fila 1</td><td>Columna 2, fila 1</td><td>Columna 3, fila 1</td><td>Columna 4, fila 1</td><tr><td>Columna 1, fila 2<td>Columna 2, fila 2<td>Columna 3, fila 2<td>Columna 4, fila 2</td></table>

Ahora veamos un ejemplo:

Columna 1, fila 1	Columna 2, fila 1	Columna 3, fila 1	Columna 4, fila 1
Columna 1, fila 2	Columna 2, fila 2	Columna 3, fila 2	Columna 4, fila 2

En este ejemplo hemos creado una tabla con 4 columnas y 2 filas; para aplicar algo similar a esto en nuestro blog unicamente debemos crear las tablas siguiendo el ejemplo del codigo dado anteriomente, y colocarlo en la parte de creacion de entradas en Edicion de HMTL cada vez que queramos crear un tabla para un post.

Leer mas »

Etiquetas: Blogger,Diseño

Usar etiquetas en movimiento en blogger

Esta es una buena funcionalidad que puede ayudar al diseño de una pagina, en la cual las etiquetas se muestran en movimiento en forma circular y que al poner el mouse sobre ellas se podran seleccionar, se puede decir que son etiquetas animadas; para utilizar esto debemos introducir ciertos codigos html en nuestra plantilla.

Esta es una imagen congelada de como se mostraran las etiquetas:

Para agregar esta funcionalidad debemos:

1. Ir a la pestaña "Diseño" y luego seleccionar la opcion "Edicion de HTML".

2. Sin expandir plantillas de artilugios buscamos el siguiente codigo:

<b:section class='sidebar' id='sidebar' preferred='yes'>

3. Ahora debajo de eso pegamos el siguiente codigo:

<b:widget id='Label99' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://halotemplates.s3.amazonaws.com/wp-cumulus-example/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a></div>
<script type='text/javascript'>
var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
// uncomment next line to enable transparency
//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0x333333");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "100");
so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");
so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

4. Guardamos los cambios y listo, tendremos esta nueva funcionalidad instalada.

Leer mas »

Etiquetas: Blogger,Diseño

Agregar una caja de texto

Muchas veces necesitamos poner cajas de texto para facilitar la lectura de codigos en una entrada, para agregar una caja de texto simplemente deben ir a la parte de Edicion de HTML en la creacion de entradas y colocar el siguiente codigo:

<div align="center">
<div style="background-color: white; border-color: black; border-style: solid; color: black; height: 300px; overflow: scroll; width: 600px;">
<span style="color: black; font-family: tahoma; font-size: 85%;"><b></b></span>
<div align="center">
<span style="color: black; font-family: tahoma; font-size: 85%;"><b>TEXTO</b></span>
</div>
<span style="color: black; font-family: tahoma; font-size: 85%;"></span>
</div>
</div>
<b></b>

Los numeros en rojo pueden cambiar la altura y el ancho de la caja; despues de colocar el codigo en la parte de Edicion HTML regresan a la seccion de Redactar (en Blogger), alli les saldra la caja y en la parte de TEXTO lo reemplazan con el texto o codigo deseado.

Leer mas »

Etiquetas: Diseño,HTML

Agregar un Gadget solo en la pagina principal

Esto es una forma muy facil de que un gadget que colocamos en un blog se presente solo en la pagina principal, para realizar eso debemos seguir los siguientes pasos:

1.Añadimos el gadget que queremos que aparezca solo en la pagina principal, y le ponemos un nombre como por ejemplo:Publicidad

2.Vamos a la opcion Diseño - Edicion HTML y expandimos plantillas de artilugios.

 3.Presionamos Control + F para abrir la barra de busqueda y ponemos el titulo del gadget creado en este caso Publicidad, alli encontraremos el codigo asi:

<b:widget id='HTML5' locked='false' title='Publicidad' type='HTML'>
<b:includable id='main'>

   <!-- only display title if it's non-empty -->
   <b:if cond='data:title != &quot;&quot;'>
     <h2 class='title'><data:title/></h2>
   </b:if>
   <div class='widget-content'>
     <data:content/>
   </div>

  <b:include name='quickedit'/>

</b:includable>
</b:widget>

4.Ahora a esa seccion debemos de agregarle los siguientes codigos:

<b:widget id='HTML5' locked='false' title='Publicidad' type='HTML'>
<b:includable id='main'>

<b:if cond='data:blog.url == data:blog.homepageUrl'>

    <!-- only display title if it's non-empty -->
   <b:if cond='data:title != &quot;&quot;'>
     <h2 class='title'><data:title/></h2>
   </b:if>
   <div class='widget-content'>
     <data:content/>
   </div>

  <b:include name='quickedit'/>

</b:includable>
</b:if>
</b:widget>

5.Por ultimo guardamos los cambios realizados y ahora el gadget solo saldra en la pagina principal de su blog.

Leer mas »

Etiquetas: Diseño,HTML

Hosting de imagenes | ImagenGratis

Si necesitas subir imagenes para luego utilizarlas en tus paginas el mejor hosting suele ser ImagenGratis, el cual es un hosting gratuito muy facil y rapido de usar, en su pagina de inicio te permite escoger el archivo a subir, al igual que te permite redimensionar el tamaño de tu imagen. Puedes subir imagenes ilimitadamente pero el tamaño de las imagenes no debe exceder de 1MB, y deben estar en formatos JPG PNG BMP GIF; al finalizar de subirlas te da unos links para que la utilizes ya sea en formarto HTML, link para mostrar en foros, o url para mostrarla directamente.

Link aqui : ImagenGratis

Leer mas »

Etiquetas: Diseño,Hosting de Imagen

Crea botones online para tu blog

Da Button Factory es una aplicacion online que nos permite crear botones para nuestra pagina o blog de manera rapida y sencilla, cuenta con recursos un poco limitados pero puedes crear algo bueno con un minimo esfuerzo, esta en ingles pero no es nada del otro mundo, te permite elegir estilo de letra, tamaño de fuente, color de fondo, color de texto, forma del boton, y muchas cosas mas, al terminar el boton lo debes descargar y subirlo a un hosting de imagenes.
El boton de MundiBlog esta creado con Da Button Factory.

Link aqui: Da Button Factory

Leer mas »

Etiquetas: Diseño

Plantillas para blogger

Muchos de los bloggers deseamos poder presentar un buen sitio a nuestros lectores para esto debemos conseguir una plantilla de acuerdo a la tematica de tu blog, en la red podemos encontrar miles de plantillas gratis solo con poner Plantillas bloggers en el buscador google inmediatamente obtendremos cientos de resultados, el mejor sitio para hallarlas es sin duda Blogger Templates aunque otro que ofrece muy buenas plantillas es PB Templates este ultimo posee plantillas muy elegantes y adecuadas para los que quieran poner banner 125x125 en el blog asi como banners mas grandes para ganar un dinero extra. Lo unico que hay que hacer para subirlas a nuestro blog es ir a la Seccion Diseño, Edicion Html, luego la subimos y ya esta, normalmente tienes que modificar algunos codigos para dejar la plantilla a tu gusto pero no es nada del otro mundo, lo puedes hacer facilmente, ademas algunas plantillas descargadas bienen con instrucciones para que las puedas subir y modificar.

Leer mas »

Etiquetas: Diseño

Crear banners flash

Muchas veces hemos sentido la necesidad de crear banners flash (animados), podemos utilizar algunos programas pero la verdad que son dificiles de manejar, y el resultado muchas veces puede ser de pesima calidad y con mucho tiempo invertido, pero para todo hay solucion, encontre una herramienta online totalmente gratis, que te permite escoger la tematica, poner varias palabras para convencer el click, efectos especiales y muchas cosas mas, la verdad es muy buena porque ademas de poner el link a donde debe dirigirse, te da otra opcion para poner un pequeño boton donde puedes poner tu link de referidos de cualquier programa o tambien puedes darle otro uso, en fin deben probarla, el unico defecto es que solo se pueden hacer banners de 3 tamaños: 250x250, 468x60 y 160x600. El sitio es Crear Banners Gratis.

Leer mas »

Etiquetas: Diseño

Banner Fans, crea tus propios banners

Muchas veces hemos sentido la necesidad de crear banners, ya sea para promocionar nuestras paginas o  para algun otro proyecto, en la red existen muchos programas pero algunos son difiles de utilizar y por lo tanto no conseguiremos buenos resultados. En la internet tambien existen otras herramientas online para crear estos banners pero la mayoria te inserta su link (esto es odioso y le quita el profesionalismo a tu banner), pero tambien podemos encontrar herramientas tal como Banner Fans que no te pone ningun link, y ademas es facil de usar.

Puedes crear tu banner en poco tiempo claro los banners son algo sencillos pero lo puedes hacer rapido y sin problemas, su uso es facil, tiene una pequeña vista previa y abajo te da las opciones para cambiar el tamaño, presentacion, palabras, colores, etc... con esmero puedes crear algo bonito, al finalizar tu banner lo unico que tienes que hacer es obtener el codigo (Get the codes) o si prefieres lo puedes descargar; luego lo colocas donde deseas le das el link a seguir y listo ya esta tu banner asi de rapido y sencillo.

Miren este:

Leer mas »

Etiquetas: Diseño