TRUCOS y cosas para BLOGER http://nestavista.com/2008/08/como-insertar-flash-en-blogger.

html

Mircoles 27 De Agosto De 2008

Cmo Insertar Flash en Blogger

Me gusta 9

Ya que he decidido publicar algunos experimentos que realic hace algn tiempo en flash, entonces surgi en mi la necesidad de construir el cdigo necesario parapoder incrustar flash (.swf) en Blogger y as poder mostrarles el resultado de las animaciones. Para insertar un archivo flash en Blogger lo nico que necesitas es tener a la mano el formato bsico de manera que tu animacin se pueda ver tanto para Internet Explorer ("object") como para Firefox ("param"). Entonces sera el siguiente: <center> <object id="movie" type="application/x-shockwave-flash" data="URL_Archivo_swf" width="438" height="315"> <param name="movie" value="URL_Archivo_swf"> <param name="wmode" value="transparent"> </object> </center> Ahora, lo nico que debers cambiar son lo que est pintado de rojo. URL_Archivo_swf: es la ruta donde se encuentra alojado tu archivo .swf (x Ejem: http://www.midominio.com/miarchivo.swf)

width: es el ancho que tiene tu archivo .swf height: es el alto que tiene tu archivo .swf

http://ciudadblogger.com/2009/06/cabecera-del-blog-en-flash.html
Me han preguntado mucho cmo poner la cabecera del blog en flash como en el blog dewallpapers gratis. Primero debes tener ya creada la cabecera en flash en formato .swf y alojada en un hosting, esta debe tener el ancho que tiene tu actual cabecera.

Para plantillas antiguas originales de Blogger

Entra a Diseo | Edicin de HTML, busca este cdigo y cambia el tamao del height a 0px: #header { width : 960px; margin : 0 auto; height : 300px; padding : 0; } Abajo de este cdigo pega esto y cambia lo que se indica: #header-flash { margin: 0; padding: 0; position: relative; height: 260px; /* cambia este valor por la altura de tu cabecera en flash */ } Ms abajo busca esta etiqueta: <div id='header-wrapper'> Y abajo de ella pega esto: <div id='header-flash'><center><object width="960" height="260"><param name="movie" value="URL del archivo en flash" /><param name="allowFullScreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="wmode" value="transparent" /><embed src="URL del archivo en flash" type="application/x-

shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="960" height="260" wmode="transparent"></embed></object></center></div> Ya slo cambia la URL del archivo en flash por el enlace donde lo tengas alojado y modifica el ancho (width) y alto (height) del archivo. Dale vista previa y si todo est bien guarda los cambios.

Para plantillas hechas con el Diseador de Plantillas de Blogger

Busca esta lnea: .Header h1 { Justo arriba de ella agrega esto: .Header h1 {display:none;} #header-flash { margin: 0; padding: 0; position: relative; height: 260px; /* cambia este valor por la altura de tu cabecera en flash */ } Luego busca esta otra lnea: <div class='region-inner header-inner'> Y debajo de ella agrega este cdigo: <div id='header-flash'><center><object width="960" height="260"><param name="movie" value="URL del archivo en flash" /><param name="allowFullScreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="wmode" value="transparent" /><embed src="URL del archivo en flash" type="application/xshockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="960" height="260" wmode="transparent"></embed></object></center></div> De igual forma cambia la URL del archivo en flash por el enlace donde lo tengas alojada tu cabecera en flash y modifica el ancho (width) y alto (height) del archivo.

<div id='header-flash'><center><object width="920" height="150"><param name="movie" value="http://dl.dropbox.com/u/38411574/encabezado%20motivados%20flash2.swf" /><param name="allowFullScreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="wmode" value="transparent" /><embed src="http://dl.dropbox.com/u/38411574/encabezado%20motivados%20flash2.swf" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="920" height="150" wmode="transparent"></embed></object></center></div>

Con esos simples pasos tendrs una cabecera animada en flash dentro de tu blog.

http://www.taringa.net/posts/info/6573994/Alojar-Archivos-_swf-y-Obtener-Url-de-un-archivo-_swf.html Alojar Archivos .swf y Obtener Url de un archivo http://www.blogdelujo.com/2009/07/alojar-archivos-en-sites-de-google-y.html

http://dl.dropbox.com/u/38411574/encabezado%20motivados%20flash.swf

http://www.tecnologiadiaria.com/2007/10/crear-una-pagina-inicial-fija-en-blogger.html

Crear una pgina inicial fija en Blogger

Hoy da se me plante una pregunta sobre cmo puede darse a un blog un esquema similar al de una pgina web, donde slo se muestre una portada y por ms que se escriban nuevos artculos, stos no desplacen al texto que haca de portada principal. La solucin se me ocurri despus de unos minutos y expongo aqu. Lo que se desea es dejar un texto como si fuera una entrada fija de manera que simule ser una pgina web esttica fija, para sto no se deben mostrar los artculos recientes sino hasta que se acceda a Vinculos en un men o en alguna seccin del texto de bienvenida, todo esto para los blogs de Blogger. DESBLOQUEANDO RESTRICCIONES DE BLOGGER Blogger por defecto solo permite aadir algunos elementos de pgina que aparecen en ciertas secciones de la estructura principal del Blog, es decir, cuando accedemos a la seccin de Plantilla> Elemtentos de Pgina nos encontramos con algo como sto:

Lo que haremos ser desbloquear algunas opciones ocultas que nos permitirn aadir ms elementos en distintas nuevas zonas de la estructura, para ello iremos a Plantilla> Edicin de HTML (antes que nada, descargmonos la plantilla original como copia de seguridad), alli clic en la opcin Expandir plantillas de artilugios y luego (usando CTRL+F) buscaremos todos los textos donde haya esto: showaddelement=no Y los reemplazaremos por: showaddelement=yes Luego de eso, guardamos los cambios (Guarda Plantilla) y vamos a la seccin Plantilla> Elementos de Pgina y veremos que ahora hay nuevas opciones de adicin de elementos quedando algo as:

Con eso el desbloqueo est hecho y podremos aadir nuevos elementos que podremos usar para personalizar nuestra pgina de inicio (fija) en nuestro blog de Blogger. OCULTANDO LAS ENTRADAS DEL BLOG Para que solo se muestre el texto de inicio ve al panel de Blogger donde dice Configuracin> Formato y lo dejamos como se muestra: Mostrar Entradas: 0 Da clic donde sobre Aadir nuevo elemento de pgina al cuadro que se muestra en la imagen.

Luego seleccionamos el nuevo elemento, elige la opcin HTML/Javascript.

Alli tenemos dos campos: Ttulo y Contenido. En ttulo podemos poner algo representativo como Bienvenidos, Editorial, Inicio, etc. En contenido deben usar un texto de inicio (ser lo que se mostrar como pgina de inicio), pueden usar todos los cdigos HTML que deseen, pronto estar posteando una referencia simple de HTML. Guardan los cambios y listo. Debemos recordar que la pgina fija se mantendr siempre por encima de todos los posts por lo que lo ideal sera crear una entra fija no muy grande, de manera tal que siempre aparezca en la parte superior pero no desve la atencin de las entradas inferiores. Saludos.

http://ciudadblogger.com/2011/11/aumentar-el-titulo-del-blog-o-imagen-de.html
Esto de las transiciones con CSS3 es algo que a todos encanta por la variedad de efectos que podemos obtener y sin necesidad de utilizar ningn script, todo es CSS. Uno de estos efectos que me han preguntado es cmo hacer para que la imagen de la cabecera (o el ttulo del blog en caso de que no tengamos imagen) pueda aumentar al pasar el cursor con este efecto suave y deslizante.

Primero hay que procurar tener la imagen en un tamao grande, esto es para que no se pixele al aumentarse. Con esto quiero decir que si por ejemplo, la imagen de la cabecera aumentar a 400px de ancho entonces el ancho original de la imagen debe ser de 400px o ms. Luego, hay que saber las medidas que tendr la imagen cuando est pequea, para eso tendremos que sacar las medidas proporcionalmente para que no se desproporcione al reducirla (ves? te dije que algn da te servira) Ahora s, entra en la Edicin HTML de la plantilla y agrega antes de ]]></b:skin> lo siguiente: #header img { width:200px; /* Ancho de la imagen en su estado normal */ height:200px; /* Alto de la imagen en su estado normal */ -moz-transition: all 1s; -webkit-transition: all 1s; -o-transition: all 1s; } #header img:hover { width:400px; /* Ancho de la imagen al pasar el cursor */ height:400px; /* Alto de la imagen al pasar el cursor */ -moz-transition: all 1s; -webkit-transition: all 1s; -o-transition: all 1s; } Cambia los valores de width y height, width es el ancho de la imagen, y height el alto, en color verde vers a cul corresponde cada una. Si lo crees conveniente puedes agregar unos mrgenes para que la imagen no parezca que se va hacia la derecha, es decir, que d la impresin que el zoom es desde el centro, para ello agrega debajo de #header img:hover { esto:

margin-top:-10px; margin-left:-30px; Puedes jugar con esos valores hasta que des con los correctos. Pero si no usas una imagen como cabecera entonces tambin puedes aplicar este efecto al ttulo del blog.

Nombre de mi blog

El procedimiento es similar; agrega antes de ]]></b:skin> esto: #header h1 { -moz-transition: all 1s; -webkit-transition: all 1s; -o-transition: all 1s; } #header h1:hover { font-size:80px; /* Tamao del texto al pasar el cursor */ color:#FF00FF; /* Color del texto al pasar el cursor */ margin-left:-30px; /* Margen izquierdo */ -moz-transition: all 1s; -webkit-transition: all 1s; -o-transition: all 1s; } Aqu es menos complicado pues no tienes que saber las medidas de ninguna imagen, slo debes poner el tamao de la fuente que tendr el ttulo del blog al pasar el cursor. Aunque por supuesto puedes agregar ah otras propiedades como un color diferente, y tambin puedes usar los mrgenes para que el texto se aumente desde el centro, pero si no quieres estas dos ltimas opciones puedes eliminarlas sin problema. Y as de sencillo puedes tener tu cabecera del blog con efecto de zoom al pasar el cursor, aunque, lamento desilusionar a los usuarios de Internet Explorer pues ellos no vern ningn efecto de deslizamiento. Otra razn ms para usar un navegador moderno.

http://ciudadblogger.com/2010/10/cambiar-el-tamano-de-las-imagenes.html
Recuerdo que cuando estudiaba nunca faltaba el que protestaba diciendo que los temas que veamos en matemticas no eran trascendentes ya que no nos seran tiles en la vida cotidiana. Bueno, esto no es del todo cierto, y aqu veremos un claro ejemplo de cmo aplicar las matemticas para solucionar lo que puede resultar un problema con la presentacin del blog. Cuando hemos subido una imagen y deseamos cambiarle el tamao aplicando las propiedades width y height (ancho y alto respectivamente) podemos correr el riesgo de que la imagen quede desproporcionada y d una apariencia de deformacin. Esto sucede porque aplicamos un ancho sin saber cul es la medida proporcional que debe tener el alto de la imagen. Por lo que, si aplicamos las medidas correctas tendremos una imagen en proporcin de medidas, pero sino el resultado puede verse muy mal. Imagen en proporcin

Imagen desproporcionada

Por ejemplo, supongamos que tenemos una imagen de mide 1024px de ancho por 768px de alto y queremos reducir su tamao. Si quiero que el nuevo ancho de la imagen sea de 500px cul deber ser el alto de la imagen?

Si bien podemos gastar una hora atinando las medidas hasta que se ajuste al tamao ms parecido, tambin podemos solucionarlo de una manera rpida y precisa; y para hacerlo usaremos la tan conocida regla de tres. Es una ecuacin simple en la cual, para conocer la medida de X deberemos multiplicar A por B y dividirlo entre Y

Ok, ok, ahora en palabras cristianas que todos entendamos. Lo nico que haremos ser,multiplicar el ancho deseado por el alto original de la imagen. El resultado lo dividimos entre el ancho original de la imagen y el resultado ser el alto que estamos buscando.

Siguiendo el ejemplo anterior entonces multiplicamos el ancho deseado que ser de 500px por el alto original de la imagen que es de 768px. Eso nos da 384,000px y lo dividiremos entre el ancho original de la imagen que es de 1024px. El resultado es 375px.

Esto significa que si cambiamos la imagen a 500px de ancho entonces el alto de la imagen deber ser de 375px de alto para que quede a proporcin. Fcil no? #divImagen img { width:500px; height:375px; } Y si por el contrario, quisiramos saber el ancho de la imagen se sigue el mismo procedimiento pero a la inversa, es decir, multiplicamos el alto deseado por el ancho original. El resultado lo dividimos entre el alto original de la imagen, y lo que obtendremos ser el ancho que estamos buscando. Quiz puede parecer difcil por el miedo natural que les tenemos a las matemticas, pero es una ecuacin que con la prctica ser fcil de aprender y nos ayudar a tener imgenes en tamaos precisos. Generador flash on line

http://www.animacreation.com/ http://www.flashvortex.com/ http://www.effectgenerator.com/ cambiar fondos http://embelleciendotublog.blogspot.com/2011/12/fondo-n-212-emy.html La manera correcta de instalar un fondo es: (ya teniendo la plantilla mnima) Instrucciones ms detalladas en un tema, ver en ETIQUETAS)

1- Ir a DISEO y aadir un GADGET 2- Escojemos uno de HTML y pegamos el cdigo que aparece en el fondo que escogiste. Como ven no es dificil y lo mejor de todo que podemos ir cambiando de aspecto las veces que queramos, no les parece estupendo?? Generadores de flash http://www.pageplugins.com/