Recursos | Artículos Propios | Contador Gráfico HTML |
En algunas ocasiones los desarrolladores web necesitamos agregar contadores de visitas en páginas web estáticas HTML. Cualquier desarrollador con algo de experiencia puede implementar fácilmente un contador de visitas dentro de páginas dinámicas ASP, .NET, PHP, JSP, etc., pero la situación se complica un poco cuando necesitamos que la página en la que debe insertarse el contador sea estática.
En este artículo se explica resumidamente cómo crear un contador de visitas gráfico que funciona en páginas HTML, con el sustento de una página ASP externa. También se ofrece el código completo para que lo descargue y lo utilice en su sitio web.
Para poder utilizar este sistema se necesita un servidor web Windows (cualquier versión: Desde Personal Web Server hasta Windows 2016) con soporte al componente FileSystemObject (que viene por defecto con VBScript).
Se parte de la suposición que los archivos de esta aplicación se guardarán en una carpeta denominada "contador" ubicada en el raíz del sitio web http://www.mi-dominio/contador. Esta carpeta debe tener asignados permisos de lectura y escritura.
El conteo de las visitas se lleva en una base de datos Access.
Se explicará resumidamente como funciona este contador de visitas, más abajo hay un link para descargar la aplicación.
El truco consiste en insertar en la página HTML, dentro del <BODY>, la etiqueta de una imagen <IMG> de 1x1 pixels que no invoca a una imagen, sino a una página ASP denominada "contador.asp" que hace dos cosas:
- Incrementar al contador en uno en la base de datos Access.
- Generar una página JavaScript denominada "contador.js".
Código: <img src="http://www.mi-dominio/contador/contador.asp" width="1" height="1">
Luego, en la posición en la que se desea que aparezca el contador, se invoca a la página que contiene el código JavaScript de cliente. Este código es el que muestra el número de visitas.
Código: <SCRIPT language=JavaScript src="http://www.mi-dominio/contador/contador.js"></SCRIPT>
El script "contador.js" contiene la secuencia de imágenes que formarán el número de visitas. Cada imagen es un archivo GIF con cada dígito 0.gif contiene la imagen del cero, 1.gif contiene la imagen del uno, y así.
Las imágenes de los dígitos puede crearlas cada uno o descargarlas desde la web. Un buen lugar para conseguir decenas de juegos de dígitos gratuitos es el siguiente: clic aquí
El Contador de Visitas en Funcionamiento |
A continuación puede observar el contador de visitas gráfico en funcionamiento. Nos gustaría que el valor mostrado fuera real :) pero se eligió un número inicial de varios dígitos para que luzcan mejor los juegos de gráficos. Observe además que esta es una página HTML convencional esto no quita que el contador pueda insertarse también en una página dinámica.
Puede descargar todos los archivos de esta aplicación compactados en un ZIP haciendo click aquí.
Este archivo ZIP contiene:
- La base de datos Access.
- El script "contador.asp".
- Un juego de dígitos gráficos.
- Una página HTML de ejemplo llamada "contador.htm".
Descárguelo, descomprímalo y luego abra el script "contador.asp" con un editor de texto plano o con un programa de diseño web en la vista de código. Sólo deberá cambiar en este archivo el valor de la constante "Dominio", asignando el dominio en donde instalará el contador de visitas HTML.
Edite también la página de ejemplo "contador.htm" indicando el nombre de su dominio en la llamada a los scripts "contador.asp" y "contador.js".
Nota: El archivo "contador.js" es generado automáticamente al ejecutar por primera vez la página que contiene el contador.
©Argentina-Hosting.Com https://argentina-hosting.com
|