Experto en Blogs

Nuevo Diseno!

2011-06-09T11:37:00.000-07:00

Hola a Todos a Este Nuevo Post, les Vengo a Decir que Ahora experto en blogs tiene un Nuevo diseño que es mas sencillo encontrar mi Twitter, y sus Actualizaciones, Con Nuevo Logo Nuevo Favicon, y Hablando de Favicon hoy les hare un Post Referente a la nueva aplicación de blogger para colocar los favicons en blogger mas Facilmente, saludos a todos.

Blogger Restablecido

2011-05-14T12:03:00.000-07:00

Ya Casi 48 Horas que En Blogger no podiamos Acceder por un Anuncio que nos Aparecia:

Blogger no está actualmente disponible

En estos momentos, Blogger no está disponible. Sentimos esta interrupción del servicio.

Consulta el estado de Blogger para obtener más información.

Aunque si Leemos la Entrada de Blogger Buzz todo se nos Quedara Claro:

Esto fue lo que sucedió: durante el mantenimiento programado para el miércoles a la noche experimentamos una corrupción de datos que afectó el comportamiento de Blogger. Desde ese momento, los bloggers y lectores de blogs pudieron haber experimentado una variedad de anomalías, incluyendo disrupciones intermitentes del servicio, entradas que desaparecieron y blogs que redireccionaron a blogs no buscados o a páginas de error. Una pequeña porción de usuarios de Blogger (estimamos que el 0.16%) pudieron encontrar problemas adicionales específicos a sus cuentas. Ayer decidimos volver Blogger al estado previo al mantenimiento y nuestro servicio estuvo disponible a modo sólo de lectura mientras trabajábamos para reestablecer todo el contenido: éste fue el motivo por el que no pudieron publicar nuevas entradas. Volvimos a la versión de Blogger del miércoles 11 de mayo por lo que las entradas publicadas desde entonces fueron removidas temporalmente. Ahora, estamos trabajando para recuperar estas entradas.

a Algunas Personas se les Mostraron Diferentes Errores, y Bueno Eso Seria Todo, Hasta La Proxima.

Google Anuncia Nuevo Blogger

2011-03-17T15:25:00.000-07:00

Ya es Oficial, Google acaba de Anunciar La Nueva Interfaz de Blogger en El 2011, En un Video en el Cual Explica Todo lo Nuevo que Habra en Blogger, Aqui el Video:

Nuevo Editor de Post

Parecido a el Editor del Microsoft Word :D

Nuevo Escritorio de Blogger

Parecido a el Escritorio de Wordpresss (Pero no Tanto ;) )

Eso Seria Todo Lo Nuevo que Habra En Blogger. (También quiero Informarles que Experto en Blogs Mejorara Igual que Blogger su Interfaz!)

Agregar el Boton de "Me Gusta" de facebook

2011-02-11T11:33:00.000-08:00

Hola a todos, primero de todo, quisiera decirles, que me perdonen por no poder publicar todos estos dias, ya es 1 mes sin publicar, y espero que me perdonen, personalize un poco el blog para su comodidad.

Este botón de facebook se ah hecho muy famoso en estos ultimos años, y muchos de ustedes lo habran visto por otro blog, pero yo lo que intento es difundir mas el truco, bueno, sin mas Preambulos comenzemos.

Primero debemos ir a Diseño / Edición de HTML presionamos Control + F, para buscar mas Rapido
y buscamos este codigo: <data:post.body/>
Justo Abajo Pegamos:

<b:if cond='data:blog.pageType == "item"'>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=standard&show_faces=false&width=100&action=like&font=arial&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>
</b:if>

Detalles:

En las Partes marcadas en Negrita: Light y Like, lo podemos personalizar,
Si no quieres que diga: Me Gusta y Diga: Recomendar
lo Sustituimos por recommend
y si no queremos que el Botón sea Claro, y Sea Oscuro sustituimos Light por Dark

Y Eso seria Todo.

Plantilla Blogger: Blogger Evening

2011-01-08T16:34:00.000-08:00

Una Plantilla llamativa, Colorida, 2 Columnas, Slider, Menu, Iconos de Redes Sociales y mas.

¡Felices Fiestas!

2011-01-02T18:36:00.000-08:00

Hola Amigos, Primero que todo, Feliz Año Nuevo, que se cumplan todos sus deseos que no se cumplieron el Año Anterior, yo les quiero informar que de hoy en adelante publicare mas seguido
(se lo que piensan, este tipo dice puras mentiras, dejara de postear como 2 dias despues)
pero ahora estare mas atento a este blog que aprecio mucho, me encanta recibir sus comentarios, ahora a este año le llamo "2011, Experto en blogs de Regreso ;)" espero que sigan visitandonos y ahora les mostrare otro post ;)
¡Adios! Atte: Admin.

Agregar Nieve en el Blog.

2010-12-18T16:15:00.000-08:00

Hoy en este tutorial mostrare como añadir nieve en el blog, pueden ver una prueba en mi blog
de pruebas.bueno primero vamos a Diseño/ Edición de HTML, y Buscamos </head>, justo antes pegamos:

y asi tenemos nieve en nuestro blog muy facilmente.

Review-Cyberbloggero: Un Talento Oculto en La Red

2010-12-18T16:05:00.000-08:00

Cyberbloggero es un blog muy bueno por sus diversas categorias en todo su blog, entre ellas:
Humor, SEO, Herramientas, Cyberbloggeadas, y 30 Categorias mas.

También por su Magnifico Diseño que Deslumbra todo su blog.

es Muy Interesante Leerlo, espero que lo Visiten, y se Hagan Seguidores.

Enlace/ Cyberbloggero.

Agregar Breadcrums a Blogger

2010-12-01T10:50:00.000-08:00

Como pueden Ver Arriba eso es un Ejemplo de Breadcrums ^
Lo podemos añadir muy facil a Nuestro blog Añadiendo unos Pequeños Codigos.

Pasos a Seguir:

Vamos a Diseño/ Edición de HTML / Expandimos Artilugios y Buscamos:

<b:includable id='main' var='top'>

Y justo Encima Pegamos el Siguiente Codigo:

<b:includable id='breadcrumbs' var='post'>

<b:if cond='data:blog.pageType == "item"'>
<p class='breadcrumbs'>
<span class='post-labels'>
<b:if cond='data:post.labels'>
Estas En:
<a expr:href='data:blog.homepageUrl' rel='tag'>Inicio</a> >
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == "true"'>
<a expr:href='data:label.url' rel='tag'> <data:label.name/></a>
</b:if>
</b:loop>
<b:if cond='data:post.title'>
> <b><data:post.title/></b>
</b:if>
</b:if>
</span>
</p>
</b:if>

</b:includable>

Ahora Buscamos

<b:if cond='data:post.dateHeader'>

y Justo Encima le Pegamos esta Linea:

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

Ahora en la Parte del CSS de la Plantilla, Mejor Dicho, ]]></b:skin> Pegamos justo antes el Siguiente Codigo:

.breadcrumbs {
background: #cccccc;
margin: 0 0 30px 0;
padding: 5px 10px 5px 10px;
border: 1px solid #E6E6E6;
}

Y asi tenemos los Breadcrums Listos :D

Configuracion Avanzada:

Lo que esta en Color Azul, Es el Texto que lo Podemos Editar, y el Color que también lo podemos Editar.

Plantilla Blogger: Personal Press

2010-11-06T06:34:00.000-07:00

Personal Press plantilla blogger de prensa es una plantilla para blogger limpia y elegante Convertido de WordPress a Blogger Template
. Características de esta plantilla:
Lleva 2 Columnas, Leer mas, widget de Redes sociales Listo, y mucho más. Esta plantilla adecuada para todo tipo de blogs.

Creador de la Plantilla:/ BloggerzBible

Agregar Marcadores Sociales a Nuestro Blog

2010-11-01T11:40:00.000-07:00

Despues de un Tiempo Sin Publicar, Les Traigo un Gran Articulo, Como Añadir Marcadores Sociales a Nuestro Blog, Primero Vamos a Diseño / Edición de HTML / Expandir Artilugios
y Buscamos el Siguiente Codigo:

<div class='post-footer-line post-footer-line-3'>

si no lo encontramos buscamos este Otro:

<p class='post-footer-line post-footer-line-3'>

Justo Abajo Pegamos:

<b:if cond='data:blog.pageType == "item"'>
<div align='right'>
<table border='0' cellpadding='2' cellspacing='0' width='260'><tbody>
      <tr>
        <td width='65'><a href='URL_DE_TU_FEED' title='Assine nosso Feed'><img src='http://www.ferramentasblog.com.br/imagens/icone-RSS.png'/> </a></td>

        <td width='65'><a href='URL_DE_TU_PERFIL_TWITTER' title='Sigueme en Twitter'><img src='http://www.ferramentasblog.com.br/imagens/icone-twitter34.png'/></a></td>

        <td width='65'><a href='URL_DE_TU_PERFIL_FACEBOOK' title='Amigos del Facebook'><img src='http://www.ferramentasblog.com.br/imagens/icone-facebook.png'/></a></td>

        <td width='65'><a href='mailto:TU_EMAIL' title='Contactanos ;)'><img src='http://www.ferramentasblog.com.br/imagens/icone-contato.png'/></a></td>
      </tr>
    </tbody></table></div>
</b:if>

Sustituimos lo "ROJO" por Nuestros Datos,
y Listo, Tenemos los Marcadores Sociales Agregados

Mensaje de Alerta con CSS

2010-10-16T15:47:00.000-07:00

Con un Mensaje de Alerta podemos avisar a nuestras visitas algun inconveniente, o al reves, que estamos
muy felices y ponemos el mensaje, por ejemplo, abajo del mensaje de los Comentarios de Este blog:

Comenzemos..
Primero Vamos a Diseño / Edición de HTML / justo antes de ]]></b:skin> Pegamos el Siguiente Codigo
Para Darle el Estilo CSS:

.alert {
background: #fff6bf url(http://i54.tinypic.com/5tz81w.png) center no-repeat;
background-position: 15px 50%; /* x-pos y-pos */
text-align: left;
padding: 5px 20px 5px 45px;
border-top: 2px solid #ffd324;
border-bottom: 2px solid #ffd324;
}

Lo que Esta Color Rojo es la Imagen de Alerta, la Podemos Cambiar por Cualquier Otra, Ahora
Para Añadir el Mensaje, Vamos a
Elementos de la Pagina/ Añadir un Gadget/ HTML Javacript
y Añadimos el Siguente Codigo:

<p class="alert">Aqui tu Mensaje</p>

Y Así Tenemos Nuestro Mensaje de Alerta.

Evita que te Copien Contenido de tu blog

2010-10-10T14:45:00.000-07:00

hoy les mostrare como evitar que copien de tu blog
este truco solo bloquea el click derecho del blog
es un truco muy sencillo, primero buscamos <body> y lo sustituimos por:

<body oncontextmenu='return false' onkeydown='return false'>

y listo, ya nadie podra copiar contenido de nuestro blog.

ATENCIÓN: Si tu blog Tiene Codigos (Como Este) Esos Codigos no se Podran Copiar.

Agregar caja de seguidores twitter en tu blog

2010-10-10T14:11:00.000-07:00

Podemos Añadir una "Caja de Seguidores Twitter" Como le Digo yo
muy facil solo añadiendo CSS y un codigo en un gadget, primero vamos a
diseño / Edición de HTML / Buscamos ]]></b:skin> y Justo Arriba Pegamos:

.box { background:url('img/bg-divider-box.gif') no-repeat center bottom; overflow:hidden; margin:1em 0; padding:2em 1.5em 3em; }
.twitter-box a { background:url('http://www.ferramentasblog.com.br/imagens/bg-twitter.jpg') no-repeat left top; display:block; height:49px; letter-spacing: -0.04em; padding:13px 0 0 70px; width:205px; }
.twitter-box strong .rss-box strong { display:block; font-size:13px; }

Ahora Vamos a Diseño / Elementos de la Pagina / Añadir un Gadget / HTML/Javascript

Ahora Pegamos el Siguiente Codigo:

<div class='box' id='social'>

    <div class='twitter-box'>
        <a href='http://twitter.com/TU NOMBRE TWITTER'><strong>Sigueme en Twitter »</strong><br/><script src='http://www.ferramentasblog.com.br/twitter/twitter-php.php?usuario=URL DE TU NOMBRE TWITTER' type='text/javascript'/> seguidores</a>
    </div>
</div>
      </div>

Configuración Avanzada:
.lo ROJO lo sustituimos por Nuestro Nombre en Twitter.

.Lo AZUL lo Sustituimos por el Texto que Queramos colocar, por Ejemplo "Sigueme Ahora!" o Cualquier Cosa.

.Lo VERDE lo sustituimos por el texto que queramos sustituir por "Seguidores" lo Podemos Cambiar por cualquier cosa, Por Ejemplo "Amigos".

Entradas Relacionadas con Imagen (Personalizado)

2010-10-07T17:23:00.000-07:00

Ayer les Mostre como añadir entradas relacionadas con imagen pero añadiendo solo un gadget
pero hoy les mostrare como añadir entradas relacionadas con imagen, pero añadiendo codigos
en la plantilla.

Comenzemos..

Primero vamos a Diseño / Edición de HTML / Expandimos Artilugios /
(Presionamos Control + F para buscar mas Rapido)
y buscamos </head> y justo encima pegamos:

<b:if cond='data:blog.pageType == "item"'>
<style type="text/css">
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}

#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}

#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script type='text/javascript'>
var defaultnoimage="http://1.bp.blogspot.com/_u4gySN2ZgqE/SosvnavWq0I/AAAAAAAAArk/yL95WlyTqr0/s400/noimage.png";
var maxresults=6;
var splittercolor="#d4eaf2";
var relatedpoststitle="Entradas Relacionadas";
</script>
<script src='http://blogergadgets.googlecode.com/files/related-posts-with-thumbnails-for-blogger-pro.js' type='text/javascript'/>
</b:if>

En el Codigo se Encuentra el CSS donde podemos cambiarle el estilo, y un script que hara que
el truco funcione.

Ahora Buscamos:

<div class='post-footer-line post-footer-line-1'>

si no lo encontramos buscamos este otro codigo:

<p class='post-footer-line post-footer-line-1'>

Ahora Justo abajo del codigo que encontremos pegamos:

<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=6"' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs("<data:post.url/>");
</script>
</div><div style='clear:both'/>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://www.bloggerplugins.org/2009/08/related-posts-thumbnails-blogger-widget.html'><img style="border: 0" alt="Related Posts Widget For Blogger with Thumbnails" src="http://image.bloggerplugins.org/blogger-widgets.png" /></a><a href='http://bloggertemplates.bloggerplugins.org/' ><img style="border: 0" alt="Blogger Templates" src="http://image.bloggerplugins.org/blogger-templates.png" /></a>
</b:if></b:if>

y asi agregamos las entradas relacionadas con imagen.

Entradas Relacionadas con Imagen (Gadget)

2010-10-06T15:14:00.000-07:00

Anteriormente vimos Como añadir una lista de entradas al azar en la Sidebar, pero ahora les mostrare como
añadir entradas Relacionadas, pero en el Post Footer, Primero Accedemos a Esta pagina, y veremos el siguiente formulario:

donde dice "My blog has light text on a dark background" lo elegimos si nuestro blog tiene fondo
oscuro, si no lo dejamos como esta, ahora Clickamos "Get Widget!" y nos Aparecera la Siguiente
Pagina

Donde Esta el Cuadro es Donde Debemos Clickear Para Instalar el Widget, Luego cuando ya Toquemos
"ADD WIDGET" apareceremos en Diseño / Elementos de la Pagina, Guardamos los Cambios y listo,
tenemos las entradas Relacionadas Con Imagen.

Lista de Entradas al Azar

2010-10-01T16:46:00.000-07:00

Podemos mostrar una lista de entradas al azar, es muy fácil Utilizando un script podemos hacer que la lista se muestre a la perfección.

Vamos a Diseño/Elementos de la Pagina/Añadir un Gadget/ HTML/Javascript
y Pegamos el Siguiente Codigo:

<div id="random-posts">
<script type="text/javascript">
function getRandomPosts(json) {
var maxEntries = 5;
var numPosts = json.feed.openSearch$totalResults.$t;
var indexPosts = new Array();
for (var i = 0; i < numPosts; ++i) {
indexPosts[i] = i;
}
indexPosts.sort(function() {return 0.5 - Math.random()});
if (maxEntries > numPosts) {
maxEntries = numPosts;
}
var container = document.getElementById('random-posts');
var ul = document.createElement('ul');
for (i = 0; i < maxEntries; ++i) {
var entry = json.feed.entry[indexPosts[i]];
var li = document.createElement('li');
var a = document.createElement('a');
a.title = entry.title.$t;
for (var j = 0; j < entry.link.length; ++j) {
if (entry.link[j].rel == 'alternate') {
a.href = entry.link[j].href;
break;
}
}
a.appendChild(document.createTextNode(entry.title.$t));
li.appendChild(a);
ul.appendChild(li);
}
container.appendChild(ul);
}
</script>
<script src="http://tublog.blogspot.com/feeds/posts/summary?alt=json-in-script&callback=getRandomPosts&max-results=999" type="text/javascript"></script>
</div>

lo que esta en rojo lo sustituimos por nuestra información.
Pronto explicaremos como agregarlo en el Post Footer.

Sexy Marcadores para Hispanos

2010-09-28T20:03:00.000-07:00

hoy les enseñare a añadir marcadores sociales pero para personas de
habla hispana, este truco lo vi en Pizcos blog.
Pasos a Seguir:
ir a Diseño / Edicion de HTML / (Presionamos Contol + F para Buscar mas Rapido)
Buscamos ]]></b:skin> y justo antes pegamos:

div.marcadores {
height:65px;
position:relative;
width:480px;
}
div.marcadores ul.cat {
margin:0 !important;
padding:0 !important;
position:absolute;
bottom:0;
left:50px;
}
div.marcadores ul.cat li {
display:inline-block !important;
float:left !important;
list-style-type:none !important;
margin:0 !important;
height:60px !important;
width:60px !important;
cursor:pointer !important;
padding: 0 !important;
}
div.marcadores ul.cat a {
display:block !important;
width:60px !important;
height:60px !important;
font-size:0 !important;
color:transparent !important;
}

.cat-bitacoras, .cat-bitacoras:hover,.cat-delicious, .cat-delicious:hover,.cat-facebook, .cat-facebook:hover, .cat-meneame ,.cat-meneame:hover, .cat-technorati, .cat-technorati:hover, .cat-twitter, .cat-twitter:hover, .cat-wikio, .cat-wikio:hover {
background:url(URL ALOJAMIENTO IMAGEN) no-repeat !important;
}
.cat-bitacoras { background-position: left top !important; }
.cat-bitacoras:hover { background-position: left bottom !important;}
.cat-delicious { background-position: -70px top !important; }
.cat-delicious:hover { background-position: -70px bottom !important; }
.cat-facebook { background-position: -140px top !important; }
.cat-facebook:hover { background-position: -140px bottom !important; }
.cat-meneame { background-position: -210px top !important; }
.cat-meneame:hover { background-position: -210px bottom !important; }
.cat-technorati { background-position: -280px top !important; }
.cat-technorati:hover { background-position: -280px bottom !important; }
.cat-twitter { background-position: -350px top !important; }
.cat-twitter:hover { background-position: -350px bottom !important; }
.cat-wikio { background-position: -420px top !important; }
.cat-wikio:hover { background-position: -420px bottom !important; }

en "URL ALOJAMIENTO IMAGEN" lo sustituimos por la url de la imagen de arriba.
Ahora guardamos cambios, expandimos los Artilugios y
Buscamos <div class='post-footer-line post-footer-line-3'> y justo abajo pegamos:

<div class='marcadores'>
<ul class='cat'>
<li class='cat-bitacoras'><a alt='Bitacoras' expr:href='"http://bitacoras.com/anotaciones/" + data:post.url + "&title=" + data:post.title' target='_blank' title='Bitacoras'/></li>

<li class='cat-delicious'><a alt='Delicious' expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' target='_blank' title='Delicious'/></li>

<li class='cat-facebook'><a alt='Facebook' expr:href='" http://www.facebook.com/sharer.php?u=" + data:post.url + "&title=" + data:post.title' target='_blank' title='Facebook'/></li>

<li class='cat-meneame'><a alt='Meneame' expr:href='" http://meneame.net/submit.php?url=" + data:post.url + "&title=" + data:post.title' target='_blank' title='Meneame'/></li>

<li class='cat-technorati'><a alt='Technorati' expr:href='" http://technorati.com/faves?add=" + data:post.url + "&title=" + data:post.title' target='_blank' title='Technorati'/></li>

<li class='cat-twitter'><a alt='Twitter' expr:href='" http://twitthis.com/twit?url=" + data:post.url + "&title=" + data:post.title' target='_blank' title='Twitter'/></li>

<li class='cat-wikio'><a alt='Wikio' expr:href='" http://www.wikio.es/vote?url=" + data:post.url + "&title=" + data:post.title' target='_blank' title='Wikio'/></li>
</ul>
</div>

y listo, tenemos los marcadores sociales en nuestro blog.

Menu de Colores con JQuery

2010-09-26T09:21:00.000-07:00

Hoy les traigo un menú horizontal, pueden ver un ejemplo en nuestro blog de pruebas.
JQuery le da un efecto de Desplazamiento suave hacia abajo El menú de colores tiene una animación suave a causa de una cosa llamada "flexibilización".

primero de todo debemos agregar el siguiente codigos justo antes de </head> :

Ahora Nececitamos Pegar el Script justo antes de </body>:

<script src='http://buildinternet.com/live/smoothmenu/js/jquery.easing.1.3.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$(".menucolor a").click(function(){
   $(this).blur();
});
$(".menucolor li").mouseover(function(){
   $(this).stop().animate({height:'150px'},{queue:false, duration:600, easing: 'easeOutBounce'})
});
$(".menucolor li").mouseout(function(){
   $(this).stop().animate({height:'50px'},{queue:false, duration:600, easing: 'easeOutBounce'})
});
});
</script>

En los 2 codigos se encuentran arriba esta el CSS que hay que añadir
y el efecto deslizante hacia abajo.

Ahora en un Elemento HTML/Javacript Pegamos el Siguiente Codigo:

<div class="menucolor">
<ul>
<li class="green"><p><a href="#">Pagina 1</a></p>
<p class="subtext">descripción 1</p></li>

<li class="yellow"><p><a href="#">Pagina 2</a></p>
<p class="subtext">descripción 2</p></li>

<li class="red"><p><a href="#">Pagina 3</a></p>
<p class="subtext">descripción 3</p></li>

<li class="blue"><p><a href="#">Pagina 4</a></p>
<p class="subtext">descripción 4</p></li>

<li class="purple"><p><a href="#">Pagina 5</a></p>
<p class="subtext">descripción 5</p></li>
</ul>
</div>

Cambiamos lo que Esta en Color "Rojo" por nuestros datos.
Lo vi En../Myestilodeyo

Generador de Letreros Para tu Blog

2010-09-24T12:27:00.000-07:00

Hoy les Mostrare como Añadir un Letrero Led a tu blog, primero vamos a esta pagina y colocamos nuestro texto, elegimos el tamaño y presionamos "Crea tu Letrero" Despues,hay dos opciones

Download Your Sign y Host to ImageShack

en "Download Your Sign" Descargamos el Letrero y en "Host to ImageShack" Obtenemos la URL del
Letrero.

ya son varios los que me an preguntado: ¿Como lo coloco en un Gadget?
lo podemos añadir en un Gadget HTML/ Javascript

<img src='URL DE TU IMAGEN'/>

en "URL DE TU IMAGEN" Colocas la URL que te da El Generador dandole click a
"Host to ImageShack"

¿Como Agrego Videos a Mi Blog?

2010-09-23T08:04:00.000-07:00

Con el Cambio de Youtube Algunas Personas (Algunas )
no saben como podemos agregar los videos a nuestro blog, el codigo HTML se encuentra abajo del video:

En "<Insertar>" nos Daran el Codigo:

Cambiamos el Tamaño, el Color, si queremos mostrarle el borde, etc.

Caja de Texto para Nuestros Blogs

2010-09-21T21:29:00.000-07:00

En una Caja de Texto podemos agregar codigos, información o cualquier otra cosa que nos llega para la cabeza, por ejemplo:

para crearla pegamos el siguiente codigo donde queramos ponerla:

<textarea rows="3" cols="20">Esto es una Prueba de la Caja de Texto EEB</textarea>

lo que esta en rojo lo sustituimos por nuestro texto.

Dividir la Cabecera en Dos-Blogger

2010-09-21T17:43:00.000-07:00

Hace unos días en Ciudad Blogger me encontré con un truco muy interesante, es el truco de dividir la cabecera en dos podemos agregar banners, buscadores, o cualquier otra cosa, por ejemplo:

el procedimiento es para plantillas basadas en minima y también para las plantillas creadas por el diseñador
de plantillas.

Plantillas Creadas Por el Diseñador de Plantillas:
primero Entramos a Diseño/ Edición de HTML / y SIN Expandir los Artilugios Buscamos:

/* Header
----------------------------------------------- */

y Justo Abajo Pegamos:

.header {width:48%; float: left; margin:0 auto 1%;}
.header2 {width:48%; float: right; margin:0 auto 1%;}

Ahora Buscamos este Codigo y pegamos lo que esta en rojo:

<div class='region-inner header-inner'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Título del blog (cabecera)' type='Header'/>
</b:section>
<b:section class='header2' id='header2' showaddelement='yes'/>
<div style='clear: both;'/>
</div>

ahora guardamos los cambios y la cabecera va a estar dividida en 2 partes.

Para las Plantillas Antiguas:
igual vamos a Diseño/ Edición de HTML/ y SIN expandir la pantilla de artilugios
buscamos este codigo:

#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}

y en su lugar pegamos:

#header {
width: 48%;
float: left;
margin:0 auto 1%;
text-align: center;
color: #000;
}

#header2 {
width: 48%;
float: right;
margin:0 auto 1%;
text-align: center;
color: #000;
}

y ahora buscamos el codigo y pegamos lo que esta en rojo:

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Título de tu blog (cabecera)' type='Header'/>
</b:section>
<b:section class='header2' id='header2' showaddelement='yes'/>
<div style='clear: both;'/>
</div>

y ya, tenemos la cabecera dividida en dos partes.

Plantilla Blogger-Mystique

2010-09-15T16:39:00.000-07:00

2 columnas, Lateral derecho
    Esta plantilla es como para un bog de negocios, blogs personales
    De ancho fijo, 1 barra lateral.
    Color blanco, fondo oscuro.

    Esta es una de las mejores plantillas de siempre, sorprendente diseño, css gran codificación y con mucho estilo.
    efectos de varios niveles de menú de navegación superior, css agradable y java.

Menu Vertical Grey Button

2010-09-14T10:10:00.000-07:00

Hoy Acabo de hacer un menú muy llamativo, es gris, (uno de los colores que mas usa este blog )

es muy fácil aplicarlo a nuestro blog para poder agregarlo a nuestro blog sigan los siguientes pasos:

Vamos a Diseño/ Elementos de la página/ Añadir un Gadget/ HTML/Javascript

y pegamos el siguiente código:

<div id="menuverticalEEB">
<ul id="menueeb">
    <li><a href="#">Pagina Principal</a></li>
    <li><a href="#">Acerca del autor</a></li>
    <li><a href="#">Enlazame</a></li>
    <li><a href="#">Contactame</a></li>
</ul>
</div>
<style type="text/css">
#menueeb {
        float:left;
}
#menueeb li {
        background: url(http://i51.tinypic.com/110wwn7.png);
    margin:6px;
    padding:3px;
    border:1px solid #CCCCCC;
        width: 150px;
        text-align:center;
        font-family: Segoe UI, Arial;
        font-size: 14px;
   -moz-border-radius: 5px;
   -khtml-border-radius: 5px;
   -webkit-border-radius: 5px;
        color:cccccc;
}
#menueeb li:hover {
        background: url(http://i48.tinypic.com/t4wk0i.png);
        border:1px solid #cccccc;
        filter:alpha(opacity=80);
        -moz-opacity: 0.8;
        opacity: 0.8;
        -khtml-opacity: 0.8;
   -moz-border-radius: 5px;
   -khtml-border-radius: 5px;
   -webkit-border-radius: 5px;
}
#menueeb a:hover {
        color: #000000;
        text-decoration: none;
}
#menueeb a {
       color: #000000;
</style>

Lo que esta en rojo lo cambiamos por nuestra información.