22 diciembre 2010
Chuleta para Blogger
27 marzo 2009
Los Sidebar
Vamos a empezar hablar sobre los sidebar o columna, como todos saben es la parte lateral del blog, bien sea a la derecha o la izquierda. Es una parte fundamental en blog, ya que ahí podrás poner todo lo relacionado con tu blog (Archivos, enlaces, imágenes, videos, script, texto, reloj, calendario, e/o).
Vamos a identificar la parte de códigos (HTML/CSS) que le corresponde a los sidebar. "Todo lo explicado, esta basado en la plantilla mínima"
- Lo primero: Parte CSS
#sidebar-wrapper {
width: 220px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
Width (ancho) Esta parte es muy importante ya que aquí le daremos el tamaño al sidebar.
- Segundo: Parte CSS
Lo encontraremos en el /* Sidebar Content.
/* Sidebar Content
----------------------------------------------- */
.sidebar {
color: $sidebartextcolor;
line-height: 1.5em;
}
.sidebar ul {
list-style:none;
margin:0 0 0;
padding:0 0 0;
}
.sidebar li {
margin:0;
padding-top:0;
padding-$endSide:0;
padding-bottom:.25em;
padding-$startSide:15px;
text-indent:-15px;
line-height:1.5em;
}
.sidebar .widget, .main .widget {
border-bottom:1px dotted $bordercolor;
margin:0 0 1.5em;
padding:0 0 1.5em;
}
.main .Blog {
border-bottom-width: 0;
}
Aquí haremos cambios en de estilo en el sidebar, como por ejemplo: cambiarle el color, colocarle margenes y el estilo de las lista en el sidebar. Es algo muy fácil de modificar te invito a visitar estos tutoriales, para así entender más de sobre los CSS.
- Tercero: Parte HTML
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Followers1' locked='false' title='Seguidores' type='Followers'/>
<b:widget id='BlogArchive1' locked='false' title='Archivo' type='BlogArchive'/>
</b:section>
Por lo general así encontraras estas secciones donde cada sección comenzara por la etiqueta <b:section> y terminara con la etiqueta </b:section> y dentro de la sección veremos las etiquetas widget (artilugios) que son lo elementos que le agregas al blog.
Según la página de ayuda de Blogger tienen que ser únicos y adaptarlos a los siguientes atributos:
- id - (obligatorio) un nombre exclusivo, que consta únicamente de letras y números.
- class - (opcional) algunos nombres de clase habituales son "navbar", "header", "main", "sidebar" y "footer." Si cambias las plantillas más adelante, estos nombres ayudarán a Blogger a determinar la mejor forma de transferir el contenido. Sin embargo, puedes utilizar otros nombres si lo prefieres.
- maxwidgets- (opcional) el número máximo de artilugios que se pueden permitir en esta sección. Si no se especifica límite, significa que no existe.
- showaddelement - (opcional) puede ser "yes" o "no", donde "yes" es la opción predeterminada. Determina si la pestaña "Elementos de página" mostrará el vínculo "Añadir un elemento de página" en esta sección.
- growth - (opcional) puede ser "horizontal" o "vertical", donde "vertical" es la opción predeterminada. Establece si los artilugios de esta sección se ordenan uno al lado de otro o uno encima del otro.
Cada artilugios (widget) también tiene unos atributos a seguir:
<b:widget id='Followers1' locked='false' title='Seguidores' type='Followers'/>
<b:widget id='BlogArchive1' locked='false' title='Archivo' type='BlogArchive'/>
- id - (obligatorio) consta únicamente de letras y números, y cada uno de los ID de la plantilla deben ser exclusivos. El ID de un artilugio sólo se puede modificar eliminando el artilugio en cuestión y creando uno nuevo.
- type - (obligatorio) indica el tipo de artilugio, el cual debe ser uno de los tipos válidos de la lista que se especifica más abajo.
- locked - (opcional) puede ser "yes" o "no", donde "no" es la opción predeterminada. Un artilugio con este atributo no se puede mover ni suprimir de la pestaña "Elementos de página".
- title - (opcional) el título que se muestra del artilugio. Si no se especifica ninguno, se empleará un título predeterminado, como "List1".
- pageType - (opcional) puede ser "all", "archive", "main" o "item", donde "all" es la opción predeterminada. El artilugio se mostrará únicamente en las páginas del blog que se hayan establecido para ello. (Todos los artilugios se muestran en la pestaña "Elementos de página", independientemente de su atributo pageType).
Al final lo verán de esta estructura, donde <b:section></b:section> van dentro de la etiqueta <div id='sidebar-wrapper'> </div> :
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Followers1' locked='false' title='Seguidores' type='Followers'/>
<b:widget id='BlogArchive1' locked='false' title='Archivo' type='BlogArchive'/>
</b:section>
</div>
Dentro de las etiquetas widget hay unos ID existente para diferenciar cada artilugios:
- BlogArchive
- Blog
- Feed
- Header
- HTML
- SingleImage
- LinkList
- List
- Logo
- BlogProfile
- Navbar
- VideoBar
- NewsBar
Referencia en Ayuda de Blogger
Seguiremos explicando más en el próxima entrada. :)
03 marzo 2009
Tips para el blog
Páginas
- Una página “acerca de”: muchas veces, los visitantes de tu blog querrán saber algo más de la persona que escribe, especialmente si les han gustado tus posts. No hace falta que entres en muchos detalles. Con una pequeña biografía tuya que le de una idea al lector acerca de quien eres, es suficiente.
- Un formulario o una manera de contacto: para que contacten contigo de manera privada para cualquier cuestión. Considera esto de bastante importancia porque lo que te quieran decir puede ir desde una oferta (de trabajo, de colaboración…) a avisarte de algún fallo que ocurra en el blog. Si no puedes recurrir a un formulario, recuerda nunca escribir tu mail tal cual (usuario@servicio.dominio), sino pon una imagen o “disfraza” la dirección (usuario_at_servicio.dominio, por ejemplo).
- Aviso legal: en muchos países, las leyes exigen dar a conocer el usuario que es lo que se hace con los datos que provee. Estos avisos suelen incorporar información acerca de la política de privacidad, entre otras cosas, y pueden variar dependiendo de cada país. Infórmate al respecto de como es en el tuyo.
- Una indicación clara acerca de la licencia que usas para tu contenido: ésta página no es tan imprescindible, más que nada porque si no está especificado, tu contenido siempre estará bajo la licencia clásica de copyright: no se puede hacer nada con él sin tu permiso (aunque esto del copyright automático puede variar según el país). Sin embargo, si deseas difundir tu trabajo mediante licencias flexibles, como CC o GNU/FDL, puedes recurrir a un widget en la barra lateral, aunque resulta mejor y más claro usar una página que explique los términos de uso de manera más detallada, como la de este blog.
Widgets
- Una casilla de búsqueda: facilítales a tus visitantes la posibilidad de encontrar información en tu blog. Un buscador incorporado es una invitación al usuario para que busque más contenido, especialmente en los blogs temáticos. Además, si usas Adsense, puede ser una vía más de ingresos.
- Una clasificación por categorías y una nube de etiquetas: soy de los que piensan que las categorías y las etiquetas no son excluyentes, sino que ambas permiten al usuario localizar con más facilidad la información. Siempre que sea posible, usa ambas cosas (en Blogger, por ejemplo, no se puede). También puedes mostrar un archivo con clasificación por fechas.
- Enlaces de suscripción: sea por RSS o por correo electrónico. De hecho, es muy recomendable dar al visitante las dos opciones. Mucha gente usa principalmente el correo electrónico como receptor de información y agradecen la posibilidad de no tener que recurrir a un lector de feeds.
- Blogroll: los blogrolls cumplen muchas funciones en un blog. Dan una noción aproximada de los intereses del autor, sirven como orientadores para encontrar sitios similares e incluso pueden servir como índice de fuentes de los artículos. En el caso de que tengas un blog temático, considera tener dos blogrolls: uno con los blogs que lees habitualmente (personal) y otro con aquellos relacionados con el tema que tratas usualmente.
- Enlaces a otros sitios tuyos: si escribes en otros sitios, hazlo saber; si tienes otras web propias o en las que colaboras, dilo bien alto. Tú debes ser el primer promotor de tu trabajo.
- Enlaces a tus cuentas “sociales”: ¿tienes cuenta en Twitter? ¿O en Facebook? Ahórrales a tus visitantes tener que buscarte por todos estos servicios (a menos que desees permanecer escondido). Además, cada vez resulta más fácil relacionar estos servicios con tu blog por medio de los diferentes widgets que ellos mismos ofrecen.
Anteriormente publique también:
26 febrero 2009
Migrando el Feed de Feedburner
http://feeds2.feedburner.com/VistosBuenos
Todos aquellos que se ha suscrito en este feed:
http://feeds.feedburner.com/VistosBuenos
Pueden estar tranquilos ya que según anunciaron todos los que haya migrado su feed a Google, la antigua URL del feed seguirá funcionara correctamente.
Pueden ver el post que preparo Vagabundia a cerca del tema para los que tenga duda, pero un proceso fácil y rápido es cuestión de mucha tranquilidad…
13 febrero 2009
Entradas de Ayuda para el blog (Recopilación)
- 3 Columnas en mínima black
- Accesos al panel de blogger desde el blog
- Añadir 3 columnas en la sección del crosscol
- Añadir 3 columnas en la sección del footer
- Añadir a Favoritos
- Añade Marcadores Sociales
- Banner en el encabezado de mínima black
- Bordes redondeados solo con css
- Botón ir arriba
- Cajas de Texto de Gema Blog
- Cambiar aleatoriamente la imagen del titulo
- Cambiar la plantilla sin perder los widgets
- Cambiar tamaño columnas plantilla mínima
- Comentarios en una Imagen
- Como añadir un favicón a tu blog o página web
- Código No-Follow
- Crear Widget para que agreguen enlace a tu blog
- Decorando Enlaces
- Desplegar contenido oculto (Bloqueas Animados)
- Dividir secciones en la plantilla
- e-referrer expandible
- Efecto opacidad en la Plantilla
- Entradas Aleatorias
- Entradas Relacionadas por Categorías
- Expandir textos o imágenes
- Faviconera Adaptable
- Fecha tipo Calendario en tus entradas
- Ideas para aumentar tus visitas (promoción)
- Imagen del perfil en los comentarios
- Imágenes que se agrandan
- Menú circular
- Menú de enlaces con imágenes previas
- Menú despegable
- Menú despegable con color
- Menú expansible en el Sidebar
- Modificar interlineado
- Mostrar las entradas de cada etiqueta en forma de menú expandible
- Mostrar los últimos post y comentarios en pestañas
- Mostrar títulos de todas o últimas entradas
- Navbar mostrar u ocultar
- Navbar fantasma
- Nube de Etiquetas en el nuevo Blogger
- Nube de Etiquetas en movimiento (new)
- Paginación en Blogger
- Personalizar los comentarios
- Personalizar los títulos del sidebar
- Publica con la primera letra en grande
- Recuperar el Lápiz de edición
- Sacar el titulo y la descripción del blog
- Scrollbars en cualquier parte del Blog
- Texto con imagen al pasar el ratón
- Truco leer mas
- Tutorial JQuery
- Últimos post en la sidebar
10 febrero 2009
Lista de enlaces (Ayuda de Blogger)
E
n el blog de Vagabundia he visto una entrada sobre opciones que nos ofrece la página de Ayuda de Blogger, me pareció muy interesante y quiero compartirla, para así aprender un poco más de lo que nos ofrece la plataforma de Blogger.Veamos la lista hecha por JMiur:
- Administrar la cuenta y condiciones del servicio
- Acceso
- Perfiles
- Configuración
- Privacidad y seguridad
- Políticas de Blogger
- Informar sobre mensajes ilegales
- Mi privacidad y seguridad
- Complementos
- Blogs de equipo, autores y lectores
- Feeds y sindicación
- Dominios personalizados
- Mail-to-Blogger
- Blogger móvil
- BlogThis
- Publicación en FTP
- Plantillas, diseños y complementos
- ¿Qué es una plantilla de entrada?
- ¿Puedo recuperar una entrada perdida?
- El editor de entradas de Blogger
- ¿Qué es una URL?
- ¿Qué es el escritorio?
- ¿Cómo puedo editar el texto que he escrito?
- ¿Cómo puedo crear un vínculo a otra página web?
- ¿Cuáles son los límites de mi cuenta de Blogger?
- ¿Cómo puedo modificar la fecha/hora de mi entrada?
- ¿Cómo creo un borrador de entrada?
- ¿Cuál es la diferencia entre 'borrador' y 'publicación'?
- ¿Cómo puedo encontrar una entrada antigua?
- ¿Qué es una entrada?
- ¿Cuánto tarda mi entrada en publicarse en Internet?
- ¿Cómo funcionan los saltos de línea?
- ¿Por qué no veo todos los botones de formato de texto?
- ¿Por qué mis actualizaciones no aparecen en mi página web?
- ¿Por qué está inhabilitado mi blog?
06 febrero 2009
Tutoriales recomendados
Iván de Zona Cerebral creo estos tutoriales y servirán mucho para los que quieren aprender a diseñar o conocer más sobres las plantillas:
Como crear una plantilla para Blogger - Primera parte: Composición y estructura.
Como crear una plantilla para Blogger - Segunda parte: Temática y estilo.
Crea tu propia plantilla para Blogger - Tercera parte: Codificación.
Como crear una plantilla para blogger - Cuarta parte: Distribución.
Arzet de Ateneu Popular crearon estos otros turoriales, aquí aprenderás de manera muy sencilla sobre los CSS:
Maestro CSS, destripando estilos. Cap. 1 - Resetea tu CSS
Maestro CSS, destripando estilos. Cap. 2 - La estructura
Maestro CSS, destripando estilos. Cap. 3 - La estructura (y2)
Maestro CSS, destripando estilos. Cap. 4 - Selectores y demás
Maestro CSS, destripando estilos. Cap. 5 - Selectores y demás (y2)
Maestro CSS, destripando estilos. Cap. 6 - Propiedades (de la A a la Z)
Maestro CSS, destripando estilos. Cap. 7: Propiedades de posicionamiento (position, top, bottom, left, right, float)
Maestro CSS, destripando estilos. Cap. 8: Propiedades de posicionamiento (clear)
Maestro CSS, destripando estilos. Cap. 9: Propiedades de visualización (display)
Maestro CSS, destripando estilos. Cap. 10: Propiedades de visualización (overflow, visibility,clip)
Maestro CSS, destripando estilos. Cap. 11: Propiedades de visualización (white space, z-index)
Maestro CSS, destripando estilos. Cap. 12: Propiedades de capa(height, width, max-height, max-width, min-height, min-width)
Además esta Chuleta CSS con conceptos básico, la recomiendo.
En esta página LibrosWeb.es comparten unos libros completamente gratis sobre XHTML, CSS, Javascript, PHP y Ajax.
22 agosto 2008
10 Cosas que hay que hacer, al abrir un blog en Blogger
Francisco de Blog and Web, ha publicado un interesante entrada que va hacer muy útil para todos aquellos que han abierto un blog o tienen uno y no saben que hacer, es una buena herramienta, espero que vaya a ser de mucha utilidad.
- Escribe la descripción de tu blog. Ve a la pestaña de “Configuración” y en la opción “Básico” encontraras el campo a llenar para poner una descripción a tu blog. Esto es útil para visitantes nuevos en tu blog y puede serlo para los buscadores.
- Busca un buena plantilla. Existen varios sitios con plantillas blogger donde puedes encontrar gran diversidad de diseños. No bases tu elección solamente en lo gráfico (cabeceras, botones, iconos, etc) sino también en la estructura (número de columnas, accesibilidad, etc) y recuerda siempre leer las instrucciones de cada plantilla pues muchas veces son importantes para la correcta visualización de la misma.
- Compra un dominio y úsalo con tu blog. Siempre he dicho que un dominio debe ser la primer inversión de un blogger y viendo que por menos de 10 dolares podemos tener nombre propio con muchas ventajas, esto es muy recomendable. Ve como agregar tu dominio en blogger.
- Cambia el feed de tu blog por el de feedburner. Feedburner es un servicio de google que te permite tener estadísticas de las personas que te leen por este medio. Desde el panel de control de blogger es posible agregar feedburner a tu blog.
- Corrige el enlace de comentarios. Un pequeño detalle que mejora la accesibilidad de tu blog. Para Corregir el enlace de comentarios hay que hacerlo de forma manual.
- Cambia las imágenes de tu plantilla a un nuevo alojamiento. Muchas plantillas tienen hospedadas las imágenes en servicios gratuitos que limitan la cantidad de accesos a ellas (ancho de banda) lo que provoca que halla momentos donde ninguna imagen del blog se vea. Alojarlas en Blogger parece la mejor opción, en otro post explicaremos como hacerlo.
- Agrega los gadgets básicos en tu barra lateral. En la pestaña “Diseño” opción de “Elementos de página” es posible agregar gadgets, los más básicos son: Etiquetas, Archivo del blog (en modo de lista) y Enlaces de suscripción.
- Inserta el formulario de comentarios en la página individual de tus entradas. Como esta característica esta aun esta en fase de pruebas es necesario hacerlo de forma manual en plantillas modificadas o de forma automática únicamente para las plantillas por defecto de blogger.
- Agrega tu código de seguimiento de estadísticas. Ya sea que uses Google Analytics, SiteMeter u otro sistema de estadísticas es importante no olvides agregar su código de seguimiento antes de la etiqueta que se encuentra en la pestaña “Diseño”, opción de “Edición de HTML”, justo hasta el final del código.
- Agrega tu blog a las herramientas de Google. Las herramientas de google te permiten seguir estadísticas de búsqueda y errores relacionados a tu sitio. Su uso es muy intuitivo y gratuito, pero también puedes ver el tutorial de Eric Lander para guiarte.
Imagen y texto tomados de Blog and Web
24 julio 2008
ABC de los Blog
27 enero 2008
100 Tips para Blogger y WordPress
Pasando por el Blog de C@balas Virtuales, me encontré con el post “50 Tips para Blogger a tener en cuenta”, que fue escrito por Blog en Serio. El escribió 100 tips entre trucos, hacks y forma de… (Como el reseña en su blog) y que son 50 para Blogger y 50 para WordPress. Y que todos esos tips, trucos, o hacks fueron tomados de varios blog de ayuda.
ABRIR LISTA | CERRAR LISTA
BLOGGER:
WORDPRESS:
-
Condicionar -mediante pago- la lectura de artículos y páginas
-
Incorporar enlaces entrantes de Technorari en el Administrador
-
Solucionar el fallo de la carga automática del theme default
Vistos En: C@balas Virtuales
Original de: Blog en Serio
10 enero 2008
Los 101 tips para un bloguero
- • Si aún no, empieza a bloguear hoy
- • Escribe sobre algo que ames
- • Si empiezas a bloguear en serio compra tu propio dominio
- • Asegúrate que el nombre del dominio es igual al nombre del blog
- • Un nombre corto y fácil de recordar.
- • Usa Blogger
- • Usa Wordpress y sus plugins.
- • Bloguea consecutivamente
- • Escribe al menos 5 posts por semana
- • Corrige y escribe bien sin falta de ortografías
- • La Sidebar cuanto menos imágenes mejor
- • Interactúa con otro bloggers
- • Deja comentarios significativos
- • Contesta a tus visitantes en los comentarios
- • Si el blog te sirvió deja siempre un comentario
- • Haz un backup de tu blog (recomiendo uno cada semana mínimo)
- • Deshazte del calendario del SideBar
- • Encuentra tu hueco sabiamente.
- • Participa en foros online
- • Pon un link a tu blog en la firma
- • Haz ligero tu blog y que cargue rápido
- • El contenido es el rey
- • Personaliza tu Plantilla o Témplate
- • Pon la Vía o en Enlace del Post
- • Simplifica la manera de llegar
- • Apaláncate en los enlaces sociales
- • Juega en redes de blogs
- • Escribe listas de “TOP 10″
- • Haz que tu Blog sea rápido al abrirse
- • Usa pings
- • Escribe con tus Propias Palabras el Post
- • Haz tus artículos cortos y rápidos
- • Introduce tu blog en Directorios
- • Si el Blog te gusto mételo entre tus links
- • Usa FeedBurner
- • Usa tu sentido del humor
- • Sé generoso
- • Anima a tus lectores a que se suscriban
- • Ten algunos posts en borradores para las emergencias
- • Anima tus lectores a que envíen tus posts a Digg, Meneame,…
- • Pon un enlace RSS en cada página.
- • Usa post en “serie”
- • Devuelve comentarios
- • Devuelve Links
- • Usa fuentes legibles
- • Visita de vez en cuando blogs nuevos y salúdales
- • Haz que el Leer Mas de los post se abra en la misma página
- • Haz un Blog INTERESANTE, y luego piensa en ADSENSES
- • Piensa bien en la temática del blog y sigue esa línea
- • Usa Google Analytics
- • Usa Histats para ver tus visitantes, no tiene publicidad en pop ups
- • Haz entrevistas por correo
- • Sé tu mismo, si puedes pon tu nombre de verdad
- • Evita el contenido duplicado de los post por no observar
- • Usa un lector RSS
- • Lee el máximo de blogs posibles
- • Céntrate en el contenido y no pongas nada que no esté relacionado
- • No olvides los blogs que te gusten
- • Pon una foto tuya en alguno de tus blogs
- • Créate tu propia página de publicidad
- • Usa Meta Tags prudentemente
- • Aprende lo básico de Html
- • Usa imágenes siempre que puedas dentro de los Post
- • Crea Encuestas para tus lectores
- • Coloca la publicidad siempre que tengas un blog interesante
- • Sé paciente no quieras ser Famoso en unos meses
- • Considera tener un compañero/a para ayudarte en el blog
- • Envía artículos a los directorios os recomiendo Corank
- • Comparte tu trabajo propio con otros blogs
- • Comparte lo que has hecho para otros
- • Lee BlogEsfera e inscríbete
- • No abarrotes tu sidebar con iconos tu blog se hace lento al abrir
- • Deshazte de las laaaargas listas de blogroll o simplifícalas
- • Experimenta toda clase de trucos html en un Blog de Pruebas
- • Technorati te hace saber quién puso algo relacionado con tu blog
- • Enlaza a otros blogs siempre que sea posible
- • Haz fácil que tus lectores contacten contigo
- • Usa Títulos que se sepa de que va el post con una simple mirada
- • Ofrece suscripciones por mail
- • Contesta siempre a las preguntas
- • Contesta siempre a los comentarios
- • No te olvides de Blogger Draft
- • Activa la suscripción a los comentarios
- • Ofrece herramientas y links
- • Escribe con un toque personal
- • Conviértete en un experto en tu materia
- • No dependas de los enlaces a posts
- • Siempre aporta tu opinión
- • Usa colores simples
- • Participa en proyectos de blogs
- • Conoce a otros bloggers personalmente
- • Lista tus productos favoritos
- • Ten voz
- • Organiza tus categorías
- • Habla directamente con tus lectores
- • Crea una estructura de URL eficiente
- • Pon enlaces funcionales en el pie
- • Sé creativo-@, adapta las ideas aprendidas para crear tú
- • Pon videos que vayan relacionados con tu blog
- • Considera añadir PodCasts
- • Crea una lista de “101″ propia, si eres capaz!!


