Recursos para Blog y web: Tutoriales

var imagenamor = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiE_TLnBHnVjrTFm0u-1PIhjV4MnCTiqRMFmkdAYey5dvKcpQxRbBgCavUoZ-xngqCuHLRkT3ZVJE3GjgfCWyIqGmmjm9W-ZPb9fG0tCJI59f1hLd-xMPXYI3AqbHg1bQtIY8vWIXsU0xM/s1600/corazon.gif"

var ns4arriba = (documento.capas) ? 1 : 0

var ie4arriba = (document.all) ? 1 : 0

var dombrowser = (document.getElementById) ? 1 : 0

var dx, xp, yp

var am, stx, orzuelo

var i, doc_ancho = 1024, doc_alto = 768

funcion amor() {

establece_dimensiones()

dx = nueva matriz ()

xp = nueva matriz ()

yp = nueva matriz ()

am = nueva matriz ()

stx = nueva matriz ()

pocilga = nueva matriz ();

for (i = 0; i < numero; ++ i) {

dx[i] = 0

xp[i] = Math.random()*(doc_ancho-50)

yp[i] = Math.random()*doc_alto

am[i] = Math.random()*20

stx[i] = 0.02 + Math.random()/10

orzuelo[i] = 0.7 + Math.random()

si (documento.capas) {

si (yo == 0) {

document.write("<nombre de la capa=\"punto"+ i +"\" izquierda=\"15\" ")

document.write("superior=\"15\" visibilidad=\"mostrar\"><img src=\"")

document.write(imagenamor + "\" border=\"0\"></layer>")

} más {

document.write("<nombre de la capa=\"punto"+ i +"\" izquierda=\"15\" ")

document.write("superior=\"15\" visibilidad=\"mostrar\"><img src=\"")

document.write(imagenamor + "\" border=\"0\"></layer>")

}

} else if (document.all || document.getElementById) {

si (yo == 0) {

document.write("<div id=\"punto"+ i +"\" estilo=\"POSICIÓN: ")

document.write("absoluto; Z-INDEX: "+ i +"; VISIBILIDAD: ")

document.write("visible; ARRIBA: 15px; IZQUIERDA: 15px;\"><img src=\"")

document.write(imagenamor + "\" border=\"0\"></div>")

} más {

document.write("<div id=\"punto"+ i +"\" estilo=\"POSICIÓN: ")

document.write("absoluto; Z-INDEX: "+ i +"; VISIBILIDAD: ")

document.write("visible; ARRIBA: 15px; IZQUIERDA: 15px;\"><img src=\"")

document.write(imagenamor + "\" border=\"0\"></div>")

}

corazon()

}

función corazón() {

for (i = 0; i < numero; ++ i) {

yp[i] += orzuelo[i];

if (yp[i] > doc_alto) {

xp[i] = Math.random()*(doc_ancho-am[i]-30)

yp[i] = 0

stx[i] = 0.02 + Math.random()/10

orzuelo[i] = 0.7 + Math.random()

establece_dimensiones()

}

dx[i] += stx[i];

if (documento.todo) {

var imagen = eval("punto" + i )

imagen.style.posLeft = xp[i] + am[i]*Math.sin(dx[i])

imagen.style.posTop = yp[i]

}

más si (documento.capas) {

var imagen = eval("document.dot" + i)

imagen.izquierda = xp[i] + am[i]*Math.sin(dx[i])

imagen.top = yp[i]

}

más si ( documento.getElementById ) {

var imagen = documento.getElementById( "punto" + i)

imagen.estilo.izquierda = xp[i] + am[i]*Math.sin(dx[i]) + 'px'

imagen.estilo.top = yp[i] + 'px'

}

setTimeout("corazón()", velocidad)

}

function establece_dimensiones() {

if (self.innerHeight) {

doc_ancho = self.innerWidth - 50

doc_alto = self.innerHeight - 21

} else if (document.documentElement && document.documentElement.clientHeight) {

doc_ancho = documento.documentElement.clientWidth

doc_alto = documento.documentElement.clientHeight - 25

} else if (documento.cuerpo) {

doc_ancho = documento.cuerpo.clientWidth

doc_alto = documento.cuerpo.clientHeight - 25

}

//]]>

</script>

<lenguaje de script='javascript' type='text/javascript'>

amor()

</script>

Fuente: https://inyectandotecnologia.blogspot.com/2015/11/corazones-cayendo-en-la-pagina-de.html

domingo, 26 de junio de 2022

8 widgets realmente útiles para toda web empresarial

Los widgets son pequeñas aplicaciones que suelen ser insertadas en las páginas web a través de código embebido o HTML. Se insertan para dotar a las páginas de más funcionalidades que ayuden a mejorar la comunicación con los visitantes, desarrollar una gestión más efectiva de la web, así como generar más oportunidades de negocio. Además, se trata de funciones adicionales para una web que no requieren invertir recursos y esfuerzos en programación. En esta lista, verás los widgets más útiles para webs de pequeñas y medianas PYMES.

Un ejemplo de widget, para que te hagas una idea, sería un vídeo de YouTube. Insertar un vídeo permite al webmaster ofrecer contenido multimedia a sus visitantes sin tener que desarrollar o pagar por una herramienta específica para ello, así como por su espacio de almacenamiento.

La mayoría de los widgets recomendados en este artículo pertenecen a aplicaciones online que funcionan con un modelo freemium. Es decir, una versión básica gratuita y una Premium de pago con ventajas técnicas más avanzadas. Voy a enfocarme solo en sus versiones gratuitas y que recomiendo a los usuarios de Webnode para que los inserten en sus páginas web.

Fuente: https://wwwhatsnew.com/2015/02/12/8-widgets-realmente-utiles-para-toda-web-empresarial/

Widgets/ gadgets para insertar en tu blog

Gadget o Widget significa literalmente artilugio, aparato, dispositivo, son en definitiva pequeñas herramientas que se suelen añadir en las barras laterales de nuestros blogs para hacerlos más atractivos, por ejemplo podemos añadir el típico reloj, contador de visitas, álbum de fotos, vídeos, la frase del día, citas, reproductores de música y un largo etcétera, sólo un consejo no es bueno abusar de todos estos gadgets pues a parte de llenar el blog de objetos, ralentiza la carga del mismo.

A continuación vamos a realizar una pequeña recopilación de algunos:

Clustrmaps: crea un mapa donde aparecen con puntos rojos los visitantes de mi blog.
Flag Counter: muestra el número de visitantes de cada país mostrando su bandera.
Avatar parlanchín: muestra un avatar creado con nosotros, incluso grabando lo que queramos decir con nuestra propia voz.
Flickr: muestra presentaciones de fotos desde una cuenta de flickr, http://www.flickrslideshow.com
Relojs: muestra el típico reloj en tu blog, tienes más de 100 modelos donde elegir.
El tiempo: widget típico que muestra el tiempo de tu localidad en tu blog: Eltiempo.es | Tutiempo.net
Traduce tu blog: herramienta de traducción de Google a otros idiomas.
Feed Wind, muestra los últimos post de otros sitios en tu blog.
La palabra del día, muestra una palabra cada día en otro idioma, su traducción y pronunciación.
Wolfram Alpha: gadget de recursos de ciencia y matemáticas, conversores, calculadoras, etc..

Fuente: https://www.tecnosalva.com/los-mejores-widgets-gadgets-para-insertar-en-tu-blog/

Enlaces animados en JavaScript: Código listo para agregar a tu Blog!

Una forma de que los visitantes conozcan otras páginas que tu consideras importantes dentro de tu blog y sin ocupando el menor espacio es utilizando un pequeño código JavaScript para mostrar una lista de enlaces a tu elección en un mismo recuadro. Los enlaces irán cambiando automáticamente por lo que sólo debes elegir las páginas que consideres más relevantes y colocarlas en el script.

CLIC AQUI: http://www.pczeros.net/2010/03/enlaces-animados-en-javascript.html

Tutorial para agregar accesorios al blog gratis

Si ya está familiarizado con Blogger este pequeño tutorial puede resultar algo obvio, pero si recién te inicias el mismo te será de gran ayuda.
Aquí te mostraré paso a paso como agregar los accesorios para el blog gratis, que encuentras en PCzeros a tu blogger, a tu blogger.

Si ya tienes una página web o un sitio creado por ti, no creo que agregar algunos de los accesorios o trucos que aquí encuentras te provoque alguna dificultad, y si tu bitácora no es de blogger seguro que el procedimiento es similar (publicaré luego otros tutoriales para los otros sub dominios)

Has clic en las imágenes para ampliarlas

Primero haces clic en diseño
Clic en añadir gadget
Clic en HTML / JavaScrip
Pegar el el código

Gadget cambia color fondo Blog: Código listo para agregar!

Gadgets que cambia el color de fondo del blog o página web.
Qué te parece tener en tu blog un gadget en el que los visitantes puedan hacer clic y cambiar el color de fondo de tu blog a su gusto. Sí, sólo hacen clic y el color de fondo cambia, muy atractivo verdad?

Lo puedes probar a continuación:

Para poner este gadget sólo debes de copiar el siguiente código y pegarlo en tu blog (diseño > agregar gadget > Html/JavaScrip y pegaas el código)

CLIC AQUI: http://www.pczeros.net/2010/06/gadget-cambia-color-fondo-blog.html

Agregar Cámara de Vigilancia al BLOG: Códigos listos para insertar!

Desde hace ya más de 10 años te venimos trayendo los mejores gadgets para tu blog en Blogger, y también para otras plataformas! Desde el popular pájaro que vuela por el blog hasta el muy útil traductor con banderas...

Esta vez te traemos una simpática cámara de vigilancia para Blogger que vigilará cuando tu no estás je! Puedes ver un ejemplo de este gadgets para blogger justo arriba de esta página, allí tenemos el código instalado y funcionando.

Si quieres agregar esta camarita de seguridad gif, es muy sencillo, simplemente elige el diseño que más te guste y copia el código en tu sitio:

Cámara tradicional para página web

viernes, 24 de junio de 2022

Poner flores cayendo en el Blog

Tutorial bien FLORAL para todos aquell@s que quieran darle un toque especial a sus blogs y sitios. Se trata de incrustar un código que nos permitirá tener distintos tipos de flores cayendo por nuestro blog.

Este tutorial es muy fácil, lo primero que hay que tener en cuenta es que solamente hay que copiar y luego pegar uno de los códigos, que les mostraré a continuación, en uno de los gadget o widget de tu blog, que lo puedes agregar en la configuración del mismo en Diseño de Página o Elemento.

Ahora elige el que más te gusta y cópialo.

Clic aquí: https://www.bebloggera.com/2015/06/pon-flores-cayendo-en-tu-blog.html

jueves, 23 de junio de 2022

Efectos en Blog

» Empezando

martes, 24 de mayo de 2022

Las Vistas Dinámicas disponibles en Blogger

CLIC AQUI: http://www.ciudadblogger.com/2011/09/las-vistas-dinamicas-ya-disponibles-en.html

lunes, 23 de mayo de 2022

Título del blog en movimiento

Este truco es para poner el título del blog en movimiento. ¿Dónde se mueve? Arriba en la ventana del explorador, abajo en el botón de la barra de herramientas y en la pestaña de la ventana. Puedes ver un ejemplo haciendo click en este blog de pruebas.

Hacerlo es muy sencillo, sólo entra en Plantilla | Edición de HTML y después de <head> pega lo siguiente:

<script>
//<![CDATA[
var txt=" Título del blog ";
var espera=100;
var refresco=null;
function rotulo_title() {
document.title=txt;
txt=txt.substring(1,txt.length)+txt.charAt(0);
refresco=setTimeout("rotulo_title()",espera);}
rotulo_title();
//]]>
</script>

Cambia lo que está en rojo por el título de tu blog y listo.

http://www.ciudadblogger.com/2009/03/titulo-del-blog-en-movimiento.html

lunes, 16 de mayo de 2022

Cómo colocar un Fans Box de Facebook flotante y deslizante para tus blogs

Útil tutorial para que puedan colocar el fans box de facebook flotando de manera que al tocarlo se deslice, como el que tenemos en nuestro blog.

Como siempre, ya saben que tienen que ir a la configuración de plantilla de HTML de su blogger, ser muy cuidados@s y seguir los pasos que les comentare a continuación...

Lo primero es buscar con las teclas Ctrl+F el código </head> y antes de éste coloquen el siguiente código:

Fuente: https://www.bebloggera.com/2011/09/como-colocar-un-fans-box-de-facebook.html

Tutorial: Miniatura de tus fotos de Instagram en tu Blog!

Hay una web que permite generar el código para agregarlo en los blogs y nos permite dar toda la configuración que queramos, esta página es SnapWidget que de manera gratuita nos permite

configurar el widget.

Lo primero es entrar en la página de SnapWidget luego, bajamos hasta el formulario de ingreso de datos. Ahí basta con ingresar lo solicitado, entre lo más relevante tenemos:

Username: ingresa el user de la cuenta que quieres mostrar.
Hashtag: ingresa el hashtag que quieres mostrar, aquí ustedes deben elegir, es el user o el hashtag.
WidgetType: es la forma en que se muestran las miniaturas, pueden ser en una grilla, slide, o l mapa de donde fueron tomadas (beta).

Clic aquí: https://www.bebloggera.com/2012/08/tutorial-miniatura-de-tus-fotos-de.html

Tutorial: Tu Blog en tu cuenta de Twitter

El siguiente tutorial te permitirá avisar de manera automática de las actualizaciones de tu blog a tus seguidores y amigos a través de Twitter sin la necesidad de que tu crees el tweet.

Esta opción la entrega Twitterfeed.

Twitterfeed es una herramienta que permite compartir los contenidos de tu blog con las redes sociales a través de Feed.

¿Cómo se hace? Pues ahora les diré como...

Te debes crear una cuenta en twitterfeed (Twitterfeed), lo cual es muy sencillo y se realiza en unos pocos pasos:

Paso 1: Selecciona “Register Now”

Te solicitará tu email y una contraseña para la cuenta.

Paso 2

Debes ingresar un nombre para el Feed, el nombre que desees (puede ser el nombre de tu blog).
Se solicita la URL del blog o la URL de RSS, en mi caso la URL del blog no funcionó por lo tuve que ingresar la URL del RSS.
Prueba el feed, ahí arroja si se pudo comunicar con el blog. En “Advanced Settings” puedes personalizar el tiempo en el cual se buscan actualizaciones, los que van desde cada 30 minutos a cada 24 horas.

Paso 3

Selecciona el servicio, en nuestro caso el de Twitter. También puedes agregar como servicio a Facebook y Linkedin.
Luego debes autorizar a twitterfedd a usar tu cuenta de Twitter, por lo que debes ingresar un nombre de usuario y su contraseña.

Al finalizar la autorización con Twitter vuelves a la interfaz principal de ingreso, donde podrás ver tu servicio activado, luego presionas “All Done” para finalizar el proceso y ¡Listo!

Tutorial: El pajarito de Twitter volando por tu blog

El código mediante el cual podréis añadir un lindo pajarito con un acceso a vuestra cuenta Twitter volando por vuestro blog.

Insertar este curioso pájaro en tu blog es realmente fácil.

Todo lo que deberás hacer será dirigirte al apartado Diseño / HTML y añadir un nuevo Gadget HTML para copiar el código que te dejamos a continuación:

var birdSprite='http://oloblogger.googlecode.com/files/birdsprite.png';

var targetElems=new Array('img','hr','table','td','div','input','textarea','button','select','ul','ol','li','h1','h2','h3','h4','p','code','object','a','b','strong','span');

var twitterAccount = 'http://twitter.com/USUARIO';

var twitterThisText ='';

tripleflapInit();

</script>

Para que al hacer clic en el pájaro, tus visitantes vayan hacia tu cuenta Twitter, deberás sustituir la siguiente línea:

var twitterAccount = 'http://twitter.com/USUARIO';

Donde dice "'http://twitter.com/USUARIO " tendrás que escribir la URL (Dirección Web) de tu cuenta Twitter. Y listo, para verificar que funciona puedes hacer clic en “Vista previa” antes de guardar los cambios realizados.

Tutorial: Badges de Instagram para nuesto Blog

Instagram (aplicación móvil para compartir fotos) dio a conocer una nueva funcionalidad para compartir nuestro perfil desde cualquier página web, esto es a través de Badges.

Las Badges no son más que widgets que podemos agregar en nuestros blogs para que todos tengan acceso a nuestro perfil, lo que podemos conseguir con unos sencillos pasos.

Hay que ingresar a la página de Instagram e iniciar sesión, luego seleccionar la nueva opción en nuestra cuenta "Badges".Aquí puedes seleccionar el ícono que más se ajuste a tu página y se te entregará un código que es el que debes copiar para luego pegar en tu blog... ¡Y listo!