jorgef2011

El gigante de internet Google anunció hace algunos meses un cambio en el diseño de los canales de YouTube,este diseño solo estaba disponible para un pequeño número de usuarios. Pero Ahora ya se encuentra disponible este nuevo diseño más atractivo al alcance de todos. Este nuevo diseño fue nombrado Youtube One Channel ,incluye una fotografía de cabecera, parecida a la timeline de Facebook y google plus.La imagen tendrá que tener, como mínimo, una resolución de 2120 pixeles por 1192 pixeles.Tambiem permite que cada usuario elija y organice los videos o las listas de reproducción como desee para hacer que cada canal sea único. Youtube con este nuevo diseño lo que quiere que los canales se vean perfectamente en todas las plataformas posibles, ordenadores, tablets o smartphones. En este momento este cambio no será automático sino que habrá que hacerlo manualmente. Para el que quiera el nuevo diseño solo tiene que ir a la página de Youtube One Channel , al final de la página, hacer click en el botón para cambiar el canal. Después con unos pocos pasos el usuario podrá elegir que verán sus suscriptores, subir un trailer , cambiar la foto de la cabecera,o añadir enlaces a web o redes sociales Enlaces al nuevo diseño de youtube javascript:void(0)

bueno este gadget nos va a mostrar las estadísticas del sitio cuantos días tiene el blog cuantas entradas,post,cuantos seguidores tienen en twitter y cuantos comentarios tienen en el blog ya por ahí estaba andando este gadget pero en ciudad blogger le añadieron los días online del blog bueno yo le boy a añadír lo de los seguidores de twitter y hare algunos cambios mas y ya quedaría mas completo cuando lo pongan en su sitio les quedaría como el que yo tengo puesto en mi sitio a la izquierdaPara implementarlo solo entra a Diseño > Elementos de la página > Añadir un gadget > HTML/Javascript y ahí pegar todo este codigo:<script language='javascript' type='text/javascript'>function snfbc(json){document.write(parseInt(json.value.items[0].feed.entry.circulation));}function xfeedburner(uri){if(uri){document.write('<sc'+'riptsrc="http://pipes.yahoo.com/pipes/pipe.run?_id=e61a81bcdb1660ebf8bc1a7c130f1f7b&_render=json&uri='+uri+'&_callback=snfbc" type="text/javascript"></s'+'cript>');} else{return false;}}function sntwitter(json){document.write(parseInt(json.followers_count));}function xtwitter(user){if(user){document.write('<scr'+'ipt src="http://twitter.com/users/show/'+user+'.json?callback=sntwitter" type="text/javascript"></scr'+'ipt>');} else{return false;}}</script><div class='widget-content'><center><div style="float: left;"><img style="width: 53px; height:65px;" src="http://dl.dropbox.com/u/25944020/tubegrafica4.gif"/></div><div style=" float: left; text-align: left; font-size:12px;"><script> function DiasOnline(Dia, Mes, Year, Texto) { Meses = new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"; Hoy = new Date(); Inicio = Date.parse(Meses[Mes - 1] + " " + Dia + " " + Year); Resultado = Math.round((Hoy.getTime() - Inicio) / 86400000); document.write(Resultado + " " + Texto); } DiasOnline(11, 8, 2011, "" );</script> días online<br/><script style="text/javascript">function showpostcount(json) {document.write(parseInt(json.feed.openSearch$totalResults.$t,10));}</script><script src="/feeds/posts/default?alt=json-in-script&callback=showpostcount"></script> entradas<br/><script type="text/javascript"> xtwitter("tubetrucos" </script> Seguid en twitter<br/><script src="/feeds/comments/default?alt=json-in-script&callback=showpostcount"></script> comentarios</div><div style="clear: both;"></div></center></div>Cambien lo que esta en rojo por lo que ustedes quieran que muestre.Lo que esta en naranja es la url de la imagen .Lo que esta en azul debes de poner la fecha en que hicistes tu blog.Lo que esta en verde deben poner el user id de twitterEl link para esta entrada es http://fasetube.blogspot.com/2011/10/gadget-de-estadisticas-del-sitio.htmlMas trucos y herramientas en tube el blog de todas las herramientas trucos gadget y mucho mas para tu sitio.Visitenos en http://fasetube.blogspot.com/

En un post,entrada anteriormente les explique de una forma de enviar las entradas automaticamente hacia twitter y facebook mediante twitterfeed.com la cual es una vía muy buena pero casualmente mirando en mi cuenta de feedburner vi que tienen la misma opcion igual sin necesidad de hacer nada simplemente vas a tu cuenta de feedburner y le das click a Socialize escoges a donde quieres twitter o facebook o otras redes, lo configuran a sus gustos y mas abajo les muestra como va a mostrarse le dan click a activate y es todo sus entradas directo a sus redes sociales.Aquí les muestro un ejemplo:

Los mapas en los sitios web(sitemaps)son importantes ya que han dado prueba de su utilidad. Los administradores de los sitios lo utilizan como herramientas que permiten orientarse rápidamente en los archivos, es una herramienta de muy buena utilidad ya que puedes encontrar lo que buscas mas rápido,muchas empresas lo usan para mostrar los servicios que brindan ya que con este código les muestra todo. también Los mapa en los sitios (sitemaps) informan a Google acerca de todas tus entradas de tu sitio web que no podrían detectar de otra forma. Los "sitemaps", son listas que incluyen las entradas,páginas que integran los sitios web. La creación y el envío de un sitemap permite a Google conocer todas las páginasde un sitio, incluyendo las URL que los procesos de rastreo habituales de Google podrían no detectar.Como poner un mapa en tu sitio es muy facil acontinuacion les boy a bridar el codigo que deben poner paraobtener el resultado.Para ponerlo en tu blog crea una página estática o una entrada normal, luego en el editor de entradas en la parte superior derecha pincha en Edición de HTML y pega el siguiente código:<script style="text/javascript"src="http://dl.dropbox.com/u/25944020/tube-Scripts-tabindex.js"></script><script src="http://LA-URL-DE-TU-SITIO/feeds/posts/default?max-results=10000&alt=json-in-script&callback=loadtoc"></script>Ejemplo: en mi caso quedaria así<script src="http://fasetube.blogspot.com/feeds/posts/default?max-results=10000&alt=json-in-script&callback=loadtoc"></script>http://fasetube.blogspot.com/http://fasetube.blogspot.com/2011/10/poner-un-mapa-en-tu-sitio-sitemap.html

Etiquetas basicas de html HTML es el lenguaje por el cual construimos una página web. Este lenguaje se basa principalmente en etiquetas, con las cuales vamos construyendo los diferentes apartados de nuestra web. Es imprescindible conocer estas etiquetas y su funcionamiento para poder crear o al menos modificar una página web. * <HTML>: indica el comienzo del documento HTML. * <HEAD>: indica que empieza la cabecera de la página. En ella se suele poner el título (<title> de la web, una descripción y otras informaciones relacionadas con el contenido de la página. * <BODY>: es el cuerpo de la página, donde va lo que se ve en el navegador al cargar una web. En el body van los textos, las imágenes y todos los contenidos de la web. * <H1>, <H2>, etc.: son los títulos o encabezados. Se utilizan para establecer determinados textos de la página como titulares, suelen tener un tamaño de fuente mayor para diferenciarlos del resto del texto. Son importantes en el posicionamiento en buscadores. * <A>: define los enlaces. * <TABLE>: es una tabla, y dentro de esta tenemos filas <TR> y celdas <TD>. * <P>: el texto dentro de esta etiqueta forma un párrafo. * <IMG>: imágenes. * <BR>: salto de línea. * <UL>: los textos dentro de esta etiqueta se estructuran en listas. Mediante el uso de <LI> definimos cada guión dentro de la lista, y usando <OL> en lugar de <UL> tendremos listas ordenadas. * <B> y <STRONG>: se utilizan para resaltar el texto. * <U>: texto subrayado. * <I>: texto en cursiva. Ejemplo de página básica <html> <head> <title>Título de la página</title> </head> <body> <h1>Encabezado de la página</h2> <h3>Encabezado de menor tamaño</h3> <p>Este es el texto de un párrafo.</p> <p>Este es el texto de otro párrafo. Dentro de este párrafo, pueden ir palabras <b>en negrita</b>, <i>en cursiva</i> o lo que quieras.</p> <p>También podemos poner listas como la siguiente:</p> <ul> <li>Guión número uno.</li> <li>Guión número dos.</li> <li>Guión número tres.</li> </ul> </body> </html> Consejo de Atributos bgcolor=?> <body Establece el color de fondo, usando nombres o valores hex text=?> <body Establece el color del texto, usando nombres o valores hex link=?> <body Establece el color de los enlaces, usando nombres o valores hex vlink=?> <body Establece el color de los enlaces, usando nombres o valores hex alink=?> <body Establece el color de los enlaces con un clic Etiquetas de texto <pre> </ pre> Crea texto preformateado <h1> </ h1> Crea un título grande <h6> </ h6> Crea un título pequeño <b> </ b> Crea texto en negrita <i> </ i> Crea texto en cursiva <tt> </ tt> Crea, o máquina de escribir estilo de texto-teletipo <cite> </ cite> Crea una cita, por lo general en cursiva <em> </ em> Hace hincapié en la palabra (con cursiva o negrita) <strong> </ strong> Hace hincapié en la palabra (con cursiva o negrita) size=?> <font </ font> Ajusta tamaño del fuente, de 1 a 7) color=?> <font </ font> Juegos de color de la fuente, usando nombres o valores hex Enlaces <a href="URL"> </ a> Crea un hipervínculo <a href="mailto:EMAIL"> </ a> Crea un enlace de correo <a name="NAME"> </ a> Crea una ubicación de destino dentro de un documento <a href="#NAME"> </ a> Enlaces a ese lugar de destino en otra parte del documento Formato <p></p> Crea un nuevo párrafo align=?> <p Alinea un párrafo a la izquierda, derecha o al centro <br> Inserta un salto de línea <blockquote> </ Span> Sangría de texto de ambos lados <dl> </ dl> Crea una lista de definiciones <dt> Precede cada definición de término <dd> Precede cada definición <ol> </ ol> Crea una lista numerada <li> </ li> Precede a cada elemento de la lista, y añade un número <ul> </ ul> Crea una lista con viñetas align=?> <div Un tag genérico utilizado para grandes bloques de formato de HTML, también se utiliza para hojas de estilo Elementos gráficos <img src="name"> Agrega una imagen <img src="name" align=?> Alinea una imagen: izquierda, derecha, centro;, superior, medio fondo <img src="name" border=?> Ajusta tamaño del borde alrededor de una imagen <hr> Inserta una regla horizontal size=?> <hr Establece el tamaño (altura) de la regla width=?> <hr Establece la anchura de la regla, en porcentaje o valor absoluto noshade> <hr Crea una regla sin una sombra Tablas <table> </ table> Crea una tabla <tr> </ tr> marcha cada fila en una tabla <td> </ td> Pone en marcha cada celda de una fila <th> </ th> Pone en marcha la cabecera de la tabla (una celda normal, con negrita, texto centrado) Atributos de la tabla border=#> <table Establece el ancho de borde alrededor de celdas de la tabla cellspacing=#> <table Ajusta la cantidad de espacio entre las celdas de la tabla cellpadding=#> <table Ajusta la cantidad de espacio entre el borde de una celda y su contenido width=# <table o %> Establece la anchura de la mesa - en píxeles o como porcentaje del ancho del documento align=?> <tr o align=?> <td Establece la alineación de la celda (s) (a la izquierda, centro o derecha) valign=?> <tr o valign=?> <td Establece la alineación vertical de la celda (s) (, superior, media o inferior) <td colspan=#> Establece el número de columnas de una celda debe abarcar <td rowspan=#> Establece el número de filas de una célula debe abarcar (por defecto = 1) <td nowrap> Evita las líneas dentro de una célula se rompa para adaptarse a Frames Marcos <frameset> </ frameset> etiquetas en un documento marco, también se pueden anidar en otros conjuntos de marcos rows="value,value"> <frameset Define las filas dentro de un conjunto de marcos, utilizando el número de píxeles, o el porcentaje de ancho de w cols="value,value"> <frameset Define las columnas dentro de un conjunto de marcos, utilizando el número de píxeles, o el porcentaje de ancho de <frame> Define un marco único - o región - dentro de un conjunto de marcos <NOFRAMES> </ noframes> Define lo que aparecerá en navegadores que no soporten marcos Marcos Atributos src="URL"> <frame Especifica que el documento HTML se debe mostrar name="name"> <frame Nombres de la estructura, o de la región, por lo que puede ser objetivo de otros marcos marginwidth=#> <frame Define los márgenes izquierdo y derecho del marco, debe ser igual o superior a 1 marginheight=#> <frame Define los márgenes superior e inferior del marco, debe ser igual o superior a 1 scrolling=VALUE> <frame Establece si el marco tiene una barra de desplazamiento, puede ser igual a "sí", "no", o "auto. Valor" El valor por defecto, como en los documentos ordinarios, es automático. noresize> <frame Impide que el usuario cambiar el tamaño de un marco Formularios Para las formas funcionales, tendrá que ejecutar un script CGI. El HTML sólo crea la apariencia de un formulario. <form> </ form> Crea todas las formas </select> <select name="nombre" múltiples size=?> </ select> Crea un menú desplegable. Tamaño establece el número de elementos de menú visible antes de yo u necesidad de desplazarse. <option> Pone en marcha cada elemento de menú <select name="NAME"> </ select> Crea un menú desplegable <option> Pone en marcha cada elemento de menú <textarea name="nombre" cols=40 rows=8> </ textarea> Crea un área de la caja de texto. Establecer el ancho de las columnas, filas ajustar la altura. <input type="checkbox" name="NAME"> Crea una casilla de verificación. Texto siguiente etiqueta. <input type="radio" name="nombre" value="x"> Crea un botón de radio. Texto sigue etiquetas <input type=text name="foo" size=20> . Crea una línea de texto y un área. Tamaño establece la longitud, en caracteres. <input type="submit" value="NAME"> Crea un botón Enviar <input type="image" border=0 name="NAME" src="name.gif"> type="image" Crea un botón Enviar con una imagen type="reset"> <input Crea un botón de reinicio http://miespaciogratis.com/

En el dia de hoy les voy a mostrar una forma sencilla de obtener un efecto de movimientos en los botones de redes sociales el cual al pasar el mouse por encima este va a girar a 360 grados y otras opciones mas que les voy a mostrar a continuacion, este efecto lo vamos a optener mediante css.la forma mas cencilla. Para ponerlo en nuestro sitio solo debemos seguir el siguiente paso muy sencillo. Vamos a diseño >>> Añadir un gadget >>>HTML/Javascript Añadir >>> y una ves abierta la ventana pegamos el siguiente codigo: Primer ejemplo: pueden ver el ejemplo en tubetrucos <style> p#redessociales1 img:hover{ -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; -moz-transform: rotate(-360deg); -webkit-transform: rotate(-360deg); -o-transform: rotate(-360deg); -ms-transform: rotate(-360deg); transform: rotate(-360deg); } </style> <p id="redessociales1"> <a href="http://tubetrucos.com"><img style="width: 60px; height: 60px;" src="http://dl.dropbox.com/u/25944020/twitter.png" title="añadir a twitter" /></a><a href="http://tubetrucos.com"><img style="width: 60px; height: 60px;" src="http://dl.dropbox.com/u/25944020/facebook.png" title="añadir a Facebook" /></a><a href="http://tubetrucos.com"><img style="width: 60px; height: 60px;" src="http://dl.dropbox.com/u/25944020/google%2B.png" title="añadir a google+" /></a><a href="http://tubetrucos.com"><img style="width: 60px; height: 60px;" src="http://dl.dropbox.com/u/25944020/rss%20%282%29.png" title="añadir a RSS Feed" /></a><a href="http://tubetrucos.com"><img style="width: 60px; height: 60px;" src="http://dl.dropbox.com/u/25944020/you-tube.png" title="añadir a youtube" /></a> </p> Segundo ejemplo: pueden ver el ejemplo en tubetrucos <style> p#redessociales2 img{ -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } p#redessociales2 img:hover{ -moz-transform: rotate(70deg); -webkit-transform: rotate(70deg); -o-transform: rotate(70deg); -ms-transform: rotate(70deg); transform: rotate(70deg); } </style> <p id="redessociales2"> <a href="http://tubetrucos.com"><img style="width: 60px; height: 60px;" src="http://dl.dropbox.com/u/25944020/twitter.png" title="añadir a twitter" /></a><a href="http://tubetrucos.com"><img style="width: 60px; height: 60px;" src="http://dl.dropbox.com/u/25944020/facebook.png" title="añadir a Facebook" /></a><a href="http://tubetrucos.com"><img style="width: 60px; height: 60px;" src="http://dl.dropbox.com/u/25944020/google%2B.png" title="añadir a google+" /></a><a href="http://tubetrucos.com"><img style="width: 60px; height: 60px;" src="http://dl.dropbox.com/u/25944020/rss%20%282%29.png" title="añadir a RSS Feed" /></a><a href="http://tubetrucos.com"><img style="width: 60px; height: 60px;" src="http://dl.dropbox.com/u/25944020/you-tube.png" title="añadir a youtube" /></a> </p> Tercer ejemplo: pueden ver el ejemplo en tubetrucos <style> p#redessociales3 img{ -moz-transition: all 0.8s ease-in-out; -webkit-transition: all 0.8s ease-in-out; -o-transition: all 0.8s ease-in-out; -ms-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } p#redessociales3 img:hover{ -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } </style> <p id="redessociales3"> <a href="http://tubetrucos.com"><img style="width: 60px; height: 60px;" src="http://dl.dropbox.com/u/25944020/twitter.png" title="añadir a twitter" /></a><a href="http://tubetrucos.com"><img style="width: 60px; height: 60px;" src="http://dl.dropbox.com/u/25944020/facebook.png" title="añadir a Facebook" /></a><a href="http://tubetrucos.com"><img style="width: 60px; height: 60px;" src="http://dl.dropbox.com/u/25944020/google%2B.png" title="añadir a google+" /></a><a href="http://tubetrucos.com"><img style="width: 60px; height: 60px;" src="http://dl.dropbox.com/u/25944020/rss%20%282%29.png" title="añadir a RSS Feed" /></a><a href="http://tubetrucos.com"><img style="width: 60px; height: 60px;" src="http://dl.dropbox.com/u/25944020/you-tube.png" title="añadir a youtube" /></a> </p> Una ves puesto el codigo del que van a usar le dan a guardar y van a ver como les quedo. Nota: Lo que que esta en color rojo deben sustituirlo por la url que tienen en la red social de la red social. Lo que esta en color naranja es la url de la imagen esa la pueden sustituir por otra que sea de su agrado. Lo que esta en color amarillo es el titulo que quieren que aparesca al poner el mouse encima de la imagen y lo mismo con los demas. En los tres ejemplo es lo mismo a cambiar. Si decean cuando lo coloquen en su sitio publiquen un comentario para ver como les quedo.

Codificador html Hola para muchas personas se les hace muy facil esta funcion de codificar el codigo html para mostrarlos en las web o blog o forum ect, pero para otras ni siquieran saben lo que deben hacer o a donde pueden ir para hacerlo ,pues aquí lo pueden hacer completamente gratis simplemente pones el codigo html que quieres mostrar en algun sitio le das a codifique y vas a obtener el resultado debajo lo copias y lo pegas donde lo quieres mostrar y es todo van a poder mostrar el codigo que quieran. para provarlo o para obtener los codigos vayan aquí

Anteriormente meses atrás si queríamos tener páginas independientes en nuestro blog de Blogger, como las que tienen en Wordpress, había que hacer algunos cambios en nuestra plantilla, lo que a veces resultaba engorroso, ya que entre plantillas hay diferencias en el código que hacían que los códigos que encontrábamos en algunos sitios no siempre se adaptaban bien a nuestra plantilla.afortunadamente después de un tiempo blogger implementó la opción de crear paginas independientes.La diferencia de una entrada común era que no aparecía en la página de inicio como las entradas normales, tampoco tendría ni fecha ni etiquetas, y no aparecería en los feeds del blog.También tendría una url más corta que los posts, ya que seria del tipo: http://TU-BLOG.blogspot.com/p/pagina.html.Blogger primero nos brindo la opción de 10 paginas independientes pero con el tiempo ya no nos bastaba con 10 entonces había que recurrir a algunos trucos para obtener mas.Pero por fin ya no mas trucos por ahora ya que blogger recientemente añadió 10 mas ahora tenemos para crear hasta un máximo de 20 páginas independientes que bien se nota estamos mejorando cada día mas.Para crearlas o administrarlas bastará con acceder a la sección "Creación de entradas", y allí a "Editar páginas", donde podremos crear nuevas páginas o editar las que ya hayamos creado.Si quieres mostrar las paginas independientes en la pagina principal en la barra lateral hay un gadget, titulado precisamente "Páginas", que podemos agregar para mostrar todas las páginas independientes en un menú.http://fasetube.blogspot.com/http://fasetube.blogspot.com/2011/10/mas-de-20-paginas-independientes-en.html

La etiqueta base La etiqueta base es uno de esos códigos html que nunca tenemos en cuenta. Suena demasiado complicado y su definición parece oscura: <base target="content" /> Establece el destino por defecto de los enlaces de una página web, fundamentalmente, cuando se utilizan frames. Por otro lado, sabemos que agregando el atributo target="_blank" a cualquier enlace, se fuerza a que este se abra en una nueva ventana o en una nueva pestaña: <a href="direccion_URL" target="_blank"> enlase </a> Si quisiéramos que TODOS los enlaces de una página se abrieran en una nueva ventana pero no queremos agregar el atributo a cada uno de ellos, podemos establecer el valor de BASE para que lo haga. Inmediatamente después de <head>, agregamos: <base target="_blank" /> Mucha prudencia, esto afecta a todos los enlaces, incluyendo aquellos que utilizan JavaScript así que, su uso es bastante limitado http://miespaciogratis.com/1_24_Etiqueta-base.html

Hoy les voy a compartir un paquete de emoticones,caritas que encontre hace unos dias para mi son espertaculares tienen muy buena calidad y nos sirven para msn para los comentarios de cualquier sitio web hay mucha variedad tienen para escoger la que deceen disfruteno y espero que les guste .descargar paquete de emoticones http://www.tubetrucos.com/2011/10/paquete-de-593-emoticones-de-calidad.html