🔒
Hay nuevos artículos disponibles. Pincha para refrescar la página.
AnteayerSalida Principal

Añadir notas a pestañas, widgets de listas y temporizador en Firefox Nightly

4 Febrero 2026 at 11:16
Por: victorhck

En Firefox Nightly podemos experimentar con nuevas funciones como añadir notas a las pestañas, o añadir widgets de crear listas o un temporizador enla página de nueva pestaña

Imagen con los distintos logotipos del navegador Firefox según sea la versión final, la beta, Nightly

Firefox Nightly es la versión en desarrollo del navegador Firefox. En esta versión en desarrollo podremos disfrutar antes que en la versión estable de nuevas funcionalidades que se irán mejorando y corrigiendo y que quizás lleguen a la versión final tiempo después, o quizás nunca si se decide que no son necesarias o útiles.

Desde que ofrecieron repositorios propios para poder instalar el paquete rpm, tengo instalado esta versión en mi equipo y de vez en cuando exploro las novedades que van incluyendo. Echemos un vistazo…

Notas en las pestañas

Una novedad es la de poder añadir notas a las pestañas que tenemos abiertas. Haciendo clic derecho sobre una pestaña podremos escoger la opción Añadir nota y una ventana en la que introducir un pequeño texto sobre algo que queramos recordar al abrir dicha pestaña.

Eso nos añadirá un pequeño icono de una nota en la pestaña, visible incluso si fijamos la pestaña. Al poner el cursor por encima veremos el contenido de la nota y haciendo clic derecho sobre ella podremos modificar el texto de la nota o eliminarla.

Puede resultar útil para tener un recordatorio de algo que queremos recordar al abrir de nuevo ese enlace.

Otro nuevo experimento de Firefox es la posibilidad de añadir un par de widgets en la página de pestaña nueva. Primero en Ajustes → Firefox Labs tendremos que habilitar la opción: Listas y temporizadores en Página de inicio de Firefox. Con eso, nos creará un par de widgets.

Widget de listas en la página de nueva pestaña

Uno para poder crear listas con diversos elementos y tenerlas siempre a mano. A día de hoy, estas listas no se sincronizan entre dispositivos. Se pueden exportar a texto al portapapeles. Y todo permanece en local en nuestro equipo. De momento admite 10 listas de 100 elementos cada una lo que no es poco.

Permite reordenar los elementos de la lista, marcarlos como realizados, editarlos o borrarlos.

Para mis gusto preferiría que los nuevos elementos que se añaden en la lista se pusieran debajo de los actuales y no por encima. Igual que cuando escribimos una lista en un papel, aunque se pueden reordenar.

Widget de temporizador en la página de nueva pestaña

Mediante otro Widget, también podremos establecer un temporizador que podremos modificar al tiempo que necesitemos y que nos permitirá establecer periodos de descanso o de concentración o utilizarlos como mejor nos parezca.

Existe otro widget que muestra el tiempo meteorológico, pero de momento sólo está disponible en ciertos países, aunque es algo que personalmente no me interesa en la página de nueva pestaña del navegador.


Además de la vista dividida y la posibilidad de gestionar de manera más pormenorizada el uso de IA en nuestro navegador que habrás podido leer en otras webs, yo he querido reseñar este par de mejoras que pronto llegarán a la versión final de Firefox. Y además de todo esto siguen corrigiendo errores, añadiendo mejoras en el uso del navegador Firefox.

Navegador que sigo utilizando y por el que sigo apostando como alternativa a el omnipresente Chrome de Google en sus diversos disfraces.

Enlaces de interés

victorhck

Imagen con los distintos logotipos del navegador Firefox según sea la versión final, la beta, Nightly

Da más estilo a Fastfetch con las configuraciones que incorpora

2 Febrero 2026 at 11:22
Por: victorhck

Fastfetch incluye una serie de configuraciones ya creadas que dan más estilo a la información de tu equipo que muestra en la terminal este software

Fastfetch mostrando información en mi terminal del equipo con colorines, iconos, etc.

Por mi cuenta de Mastodon compartí algunas capturas de pantalla de mi terminal en openSUSE mostrando diferentes configuraciones ya creadas e incluidas en Fastfetch como la que puedes ver más arriba.

Estas configuraciones ya están creadas y sólo necesitas utilizar la que más te guste. Vamos a ver dónde se ubican, echarles un vistazo, y utilizar la que más nos guste.

Podemos echar un vistazo a las configuraciones instaladas de manera predeterminada con el siguiente comando:

fastfetch --list-presets

Veremos que hay una lista de archivos .jsonc que son los que contienen las distintas configuraciones para que la información que ofrece fastfetch se vea de una manera u otra.

Esas configuraciones suelen estar en la ruta /usr/share/fastfetch/presets/ y otras en la misma ruta, pero dentro de la carpeta examples.

Podemos ejecutar fastfetch con la configuración que queramos mediante la opción -c y especificando el archivo que queremos que utilice:

fastfetch -c all.jsonc

Y así ir recorriendo todas las opciones. Pero ¿Por qué no hacerlo mediante un script? Con este script, irá ejecutando fastfetch con todas las opciones encontradas:

#!/usr/bin/env bash

# Obtener las rutas donde pueden haber archivos de configuración
data_paths=$(fastfetch --list-data-paths)

# Recorrer cada ruta
for path in $data_paths; do
    # Verificar que la ruta exista
    if [ -d "$path" ]; then
        # Buscar archivos con extensión .jsonc en la ruta
        jsonc_files=$(find "$path" -type f -name "*.jsonc")

        # Recorrer cada archivo .jsonc encontrado
        for jsonc_file in $jsonc_files; do
            clear
            echo "=============================="
            echo "Archivo de configuración: $jsonc_file"
            echo "=============================="
            echo

            # Ejecutar fastfetch con el archivo de configuración
            fastfetch -c "$jsonc_file"

            echo
            echo "Pulsa cualquier tecla para continuar..."
            read -n 1 -s
        done
    else
        echo "La ruta $path no existe o no es un directorio válido."
    fi
done

Ya sabes lo guardas en un archivo (por ejemplo ff_demo.sh), le das permisos de ejecución (chmod +x ff_demo.sh) y lo ejecutas (./ff_demo.sh).

Haremos un recorrido por todos los temas instalados en nuestro equipo. Si alguno nos gusta y queremos reemplazar el actual predeterminado que utiliza fastfetch, simplemente copiaremos el archivo deseado a la nueva ubicación como en el siguiente ejemplo:

cp /usr/share/fastfetch/presets/16.jsonc ~/.config/fastfetch/default.jsonc

Si no existe la carpeta fastfetch dentro de .config en tu home tendrás que crearla.

Ahora al ejecutar de nuevo fastfetch utilizará la nueva configuración, que podrás modificar añadiendo o quitando cosas para dejarlo como a ti te guste.

Si decides volver a la configuración original predeterminada, simplemente borra el archivo que has copido en .config y ya estaría.

¡Ah! Otra cosa, supongo que para que algunas configuraciones se muestren correctamente deberás utilizar en la terminal una fuente Nerd Font para que se muestren algunos iconos.

Enlaces de interés

victorhck

Fastfetch mostrando información en mi terminal del equipo con colorines, iconos, etc.

Cómo usar mjpg-streamer para hacer un streaming desde la webcam del portátil

29 Enero 2026 at 11:42
Por: victorhck

mjpg-streamer toma archivos JPG de cámaras web, sistemas de archivos u otros complementos de entrada compatibles con Linux-UVC y los transmite como M-JPEG a través de HTTP a navegadores web, VLC y otro software.

Un Tux sentado, el pinguino mascota de Linux, enfrente de una terminal.

Mediante este software libre publicado bajo una licencia GNU GPL, que realmente es muy ligero de uso que podemos ejecutarlo en un equipo de bajos recursos como una Raspberry por ejemplo, podremos transmitir via streming vídeos que captamos con nuestros dispositivos de vídeo.

En mi caso he instalado el software en mi portátil viejo con openSUSE Tumbleweed y utilizo su webcam integrada para emitir en streaming el vídeo. Pudiéndolo ver incluso fuera de mi red local, veamos cómo.

El software lo conocí gracias a un artículo publicado en el blog Un bruto con Debian:

Así que quise probarlo yo mismo en mi openSUSE.

En ese artículo anterior, se muestra cómo compilar el software para tenerlo funcionando. En mi caso, una rápida búsqueda en los repositorios de openSUSE me dió como resultado que ya estaba disponible para utilizarlo. Así que medianta un simple comando como sudo zypper in mjpg-streamer ya lo tenía instalado en mi equipo.

Es hora de probarlo. Así que abrí la tapa de la webcam de mi equipo y ejecuté este comando


mjpg_streamer -i "input_uvc.so -d /dev/video0" -o "output_http.so -p 1234"

Mediante el argumento de -i le estoy diciendo qué dispositivo de entrada utilizar para emitir el streaming. En mi caso es /dev/vidoe0 pero ¿será igual en tu caso?

Para saberlo puedes ejecutar esto:

for device in /dev/video; do udevadm info "$device" | { grep -q 'CAPABILITIES=.:capture:' && echo "$device" ;}; done

y te dará el dispositivo que podrás utilizar como entrada.

Mediante el argumento -o le decimos que queremos que emita en http levantando un servidor al que conectarnos desde otro equipo de nuestra red. Y un puerto diferente que utilizar, en mi caso he optado por el 1234, pero puedes utilizar el que quieras.

Con esto, si todo va bien ya estará emitiendo el streaming. A mí me da algunos errores del tipo: «UVCIOC_CTRL_ADD – Error at Pan (relative): Inappropriate ioctl for device (25)» pero son más bien informativos de que algunas funcionalidades no están soportadas por el dispositivo, pero se pueden ignorar.

Ahora comprobaremos si todo está funcionando bien. Lo primero sera testearlo desde el propio equipo. Para ello abrimos un navegador y metemos esta dirección: localhost:1234/?action=stream y deberíamos ver lo que captura la webcam del portátil.

Muy bien. Ahora vamos a otro equipo de nuestra red local y vamos a ver si también podemos acceder al streaming. Ahora necesitamos poner la IP del equipo que está ejecutando el software en vez de localhost: 192.168.1.42:1234/?action=stream

¿Vemos algo? si la respuesta es sí, genial!! Si no nos conecta a esa IP pero sí lo veíamos cuando ejecutábamos localhost, entonces quizás es problema del cortafuegos. Necesitamos abrir ese puerto para poder acceder. En openSUSE ejecuté:

sudo firewall-cmd --zone=public --add-port=1234/tcp --permanent
sudo firewall-cmd --reload

Y confirmar mediante:

sudo firewall-cmd --list-ports

Donde debería aparecer algo como: tcp/1234 confirmando que el puerto está abierto. Volvemos a navegar por la url anterior: 192.168.1.42:1234/?action=stream y debería ya aparecer nuestra emisión en streaming.

Al igual que en el artículo del bruto con Debian, también tuve que aumentar el número de frames capturado para ver una secuencia más real y fluida. Así que en mi caso también lo subí a 60 frames que especificamos mediante la opción -f

¿Podemos ver ese streming desde fuera de nuestra red local?

La respuesta es sí, pero utilizando un servicio de dns dinámica y tocando en nuestro router para redirigir el tráfico que hagamos a ese puerto a la IP de nuestro equipo local (que deberá ser siempre la misma).

Para esto yo he utilizado el servicio https://freemyip.com/

Así mi desde fuera de la red puedo acceder mediante la url:

http://midominio.freemyip.com:1234/?action=stream

Si no quieres que cualquiera pueda conectarse, igual es buena idea correr mjpg-streamer con contraseña mediante la opción -c

Yo a mayores lo que hago es incrustar el streming en un documento html y le digo a mjpg-streamer que para el servidor abra ese archivo. Así en una carpeta miusuario/www/ tengo uno archivo index.html con su archivo de estilo css y todo. Y dentro del index.html incrusto el streaming mediante un bloque iframe

 http://midominio.freemyip.com:1234/?action=stream

Y al final el comando completo de mjpg-streamer en mi caso quedaría así:

mjpg_streamer -i "input_uvc.so -d /dev/video0 -f 60" -o "output_http.so -p 1234 -w /home/victorhck/www/"

Y desde el navegador iría a la dirección:

http://midominio.freemyip.com:1234/

Así si apuntas con la webcam al rincón preferido de tus gaticos les podrás ver cómo duermen durante todo el día esperando a que llegues tu para empezar a correr por toda la casa…

Enlaces de interés

victorhck

Un Tux sentado, el pinguino mascota de Linux, enfrente de una terminal.

Video y materiales del taller virtual: pon tu radio en línea

22 Mayo 2025 at 15:33

Formación para aprender a transmitir audio por streaming.

Comenzamos el taller describiendo brevemente el funcionamiento de Internet y las diferencias entre los servidores para alojar contenido (como una página web) y los que necesitamos para transmitir por streaming. En este gráfico están resumidos los conceptos principales:

A continuación, resumimos en tres pasos lo requerimientos para operar una radio en línea: (1) instalar un software de transmisión como Butt (hay versiones para cualquier sistema operativo de escritorio) CoolMic (Android); (2) abrir una cuenta en un servicio de streaming; (3) ofrecer un link o un reproductor para que la audiencia escuche la transmisión.

Aquí está el video completo de la sesión. Recuerda que tienes todos estos pasos descritos en detalle en este artículo. Además, en nuestra web tienes una sección completa que agrupa todos los artículos sobre el tema donde comparamos software y servidores de streaming, o enseñamos el paso a paso de cómo colocar un reproductor HTML para la web que muestre las canciones que están sonando. ¡Visítala!

Ver el video en el Fediverso

Enlace

Sólo tienes que entrar a este enlace el día y hora indicados, con cualquier navegador web (Firefox, Chromium, Chrome, etc.), tanto desde la computadora como desde el celular.

https://meet.jit.si/TallerRadioEnLineaRadiosLibres

Horario

  • 08:00 Centroamérica y México.
  • 09:00 Colombia, Ecuador, Panamá y Perú.
  • 10:00 Bolivia, Chile, Cuba, República Dominicana y Venezuela.
  • 11:00 Argentina, Brasil, Paraguay y Uruguay.
  • 16:00 Europa.

Requisitos previos

Instala tu radio en línea en 5 minutos (¡y con software libre!)

1 Marzo 2025 at 18:51

Una guía rápida y resumida en 5 pasos para instalar una radio virtual para estar al aire en 5 minutos usando software libre. ¡Y todo con software libre (y gratuito)!

ATENCIÓN: Para quienes prefieran tomarse el proceso con más calma, pensando con tranquilidad en los contenidos (algo que aconsejamos si quieren tener cierto impacto) y conociendo todas las alternativas para la transmisión en línea, les recomendamos este curso virtual, libre, abierto y gratuito.

1. EQUIPOS

Para empezar con una radio online con una computadora es más que suficiente. Sobre todo si, principalmente, vas a transmitir música. Y para hablar puedes usar el micrófono integrado.

Si aspiras a producir un programa de radio, es decir, que hablen un par de personas y mezclar los diálogos con canciones es recomendable invertir en una pequeña consola o, mucho mejor, una tarjeta externa de sonido USB. En ambos casos la inversión será de entre 100 y 150 $USD; aunque insistimos, no es obligatorio. En relación precio/calidad Behringer es una buena opción. Por ejemplo, la consola Q802USB o la interfaz UMC202HD. En una categoría superior, aunque dentro de estos mismos presupuestos, podemos encontrar PreSonus AudioBox o M-Audio Air 192.

2. SERVIDOR DE STREAMING

El proceso técnico para transmitir radio en línea consiste en conectarte desde una computadora (o celular) a un servidor de streaming al que se le envía la señal de audio. Quienes quieran escucharnos se conectarán a ese servidor que les enviará el audio a través de un reproductor que coloques en tu página web o blog.

Hay muchas plataformas comerciales que ofrecen el servicio de streaming gratuito. Son empresas que intentan captar clientes regalando planes freemium para luego intentar venderles el paquete premium. Sin embargo, son una buena alternativa para comenzar.

PlataformaSoftwareCaracterísticasReproductor
Listen2MyRadioIcecast / Shoutcast5.000 oyentesUsa tu propio player / No https propia
MyRadioStreamShoutcast200 oyentes /
128 kbps
Obliga a usar su player
Caster FMIcecast400 oyentes /
128 kbps
Obliga a usar su player


De estas tres, que son las más conocidas, recomendamos la última. Caster FM tiene un reproductor propio que insertas en tu web y funciona en todos los navegadores. Explicamos estos detalles en el punto número 5.

También hay proyectos que no tienen fines comerciales y apoyan a organizaciones sociales y radios comunitarias. Puedes consultar más instituciones aliadas que ofrecen servicios web libres aquí.

Si tu emprendimiento es personal o comercial, te recomendamos cualquiera de los servicios comerciales de la primera tabla pero no estos. Estas cuentas tienen un objetivo comunitario y social, y requieren de un gran esfuerzo voluntario económico y humano para que se mantengan, por lo que es mejor que se destinen a organizaciones que realmente los necesitan. Recuerda que detrás de estas plataformas no hay empresas, sino personas que dedican su tiempo libre para que funcionen por lo que si puedes colaborar, ¡genial! Recuerda que “libre” no es sinónimo de “gratis” o “sin costo”.

Aquí tienes una comparativa más amplia sobre servicios de streaming.

PlataformaSoftwareCaracterísticasReproductor
YanapakIcecastProtocolo seguro httpsUsa tu propio player
Giss TVIcecastProtocolo seguro httpsUsa tu propio player
EsporaIcecastSin informaciónUsa tu propio player

3. SOFTWARE

Una vez que te has registrado en cualquiera de estas plataformas recibirás los datos de acceso al servidor para iniciar la transmisión: una dirección IP y un puerto; una contraseña, si es Shoutcast (software privativo); y, además, un punto de montaje y un usuario si es Icecast (software libre).

Para conectar con ese servidor de streaming y enviarle el audio necesitas un “transmisor”. En este caso, es un software que toma lo que suena en la tarjeta de sonido, lo codifica y lo envía al servidor. Recomendamos Butt, es libre, sencillo de usar, multiplataforma –tiene versiones para Windows, MacOs y GNU/Linux– y gratuito, aunque el desarrollador acepta donaciones.

Otro programa recomendable es Mixxx, un reproductor tipo DJ con el que puedes enviar directamente el streaming sin necesidad de otro software. Si quieres automatizar la programación recomendamos G-Radio (sólo disponible para GNU/Linux) que también se conecta directamente con tu servidor de streaming.Si usas la distribución libre para radios comunitarias GNU/Linux EterTICs todos estos programas ya vienen preinstalados.

Y para transmitir desde celulares Android Cool Mic. [Aquí tienes una tabla con más software con el que transmitir online].

Después de instalar cualquiera de estos programas deberás configurarlo con los datos que te ha enviado el proveedor de servicios.

4. CONFIGURAR LA TARJETA DE AUDIO Y EL SOFTWARE

Este paso dependerá mucho de los equipos y el sistema operativo que estés usando. Pero al software de transmisión deberás indicarle que señal transmitir y para eso requieren realizar algunas configuraciones en la tarjeta de sonido.

Si sólo tienes una computadora y quieres mezclar la música y la voz necesitarás configurar la tarjeta e indicarle a Butt que tome la señal del “Monitor de audio” (en Windows era “Mezcla estéreo”, quizás en las últimas versiones ha cambiado, tendrás que buscar en Internet cómo hacerlo ya que no trabajamos sistemas operativos privativos. También puedes probar con Voicemeeter, es gratis pero no libre).

Para optimizar la configuración del sonido y sacarle el máximo rendimiento en GNU/Linux puedes usar Jack, un potente motor para gestionar el audio. Nuestros compañeros de la Red de Radios Comunitarias y Software Libre Pablo López y Luis Salazar te explican en estos tutoriales “Como montar una radio tradicional y online con o sin consola en EterTICs GNU/Linux” y “Configurar JACK y realizar Streaming con Butt en GnuEterTics”.

Una vez que tenemos configurada la tarjeta de sonido, comenzamos a emitir.

5. UN REPRODUCTOR PARA QUE TE ESCUCHEN

Para que la audiencia se conecte a tu radio siempre puedes ofrecerle la URL del streaming, compuesta por la IP:puerto/punto_de_montaje. Al abrirla en cualquier navegador escucharán automáticamente la radio.

Pero siempre es más cómodo para la audiencia colocar un reproductor en la página web o blog de la radio, en el que dar play y escuchar.

Es importante saber que muchas de estas plataformas gratuitas no permiten colocar reproductores propios, sino que obligan a los oyentes a escuchar en una página propia en la que publicitan sus servicios. Otros ofrecen un reproductor propio con un código “embed” para insertar en la web. Actualmente son una buena opción porque Chrome desde la versión 80 no permite insertar reproductores con streaming que no sea seguro (bajo protocolo https://).

Para las cuentas que sí lo permiten, puedes colocar un sencillo reproductor HTML5 con el siguiente ejemplo (cambia con tu propia URL). Y en este tutorial explicamos cómo sumar el título de las canciones que están sonando.

<audio controls autoplay preload="none" src="http://XXX.XXX.XXX.XXX:XXXX/tu-punto-de-montaje"></audio>

Si tienes un blog en WordPress o quieres configurar el reproductor de otra forma aquí tienes un detallado tutorial sobre los reproductores HTML5 para radios en línea. También puedes usar Muses Audio Player.

¿Dudas y preguntas? ¡Escríbenos! O comparte tu experiencia en los comentarios.

Reproductor con estilo e imagen para una radio en línea

19 Marzo 2025 at 23:21

En la nueva pantalla pegamos el código del reproductor. Algunos proveedores de servicios te ofrecen sus propios reproductores. Si no lo tienes, de los que hemos probado (y han sido varios) los que mejor funcionan son los más sencillos HTML5. Además, funcionan en teléfonos celulares. Siempre y cuando el protocolo de tu streaming sea seguro sea seguro, es decir, comience con https://

[Recomendamos que una vez pegado el código sustituyas a mano todas las comillas (“)]

En source colocas la URL de tu streaming (la misma que usas para enviar la señal al servidor) y el type de transmisión. Si es mp3 escribes type=”audio/mpeg” si es ogg será type=”audio/ogg”. Si quieres que la radio comience a escucharse al abrise la página web deberás indicarlo con la palabra autoplay. Si lo borras tendrán que pulsar play para comenzar a escuchar.

<audio autoplay controls="controls"> <source src="https://radios.yanapak.org/radio_trama" type="audio/ogg" /> </audio> 

Si estás usando un servidor Shoutcast, tendrás que añadir un punto y coma (;) al final de la barra invertida de la URL, tal como se indica a continuación. Si tuviera “punto de montaje” como /stream o /live no hará falta el punto y coma.

<audio autoplay controls="controls"> <source src="https://185.85.29.166:8000/;" type="audio/mpeg" /> </audio> 

Si tienes nociones de CSS o diseño puedes jugar mucho más con la etiqueta de video. Meter una imagen de fondo, un marco de color. Por ejemplo, con este código quedaría algo así:

<style type="text/css">
#reproductor
{
position:absolute;
top: 50px;
left:0px;
display:block;
border: 1px solid #B40000;
background-color: #F1F1F1;
}
</style>
</br>
Síguenos en las Redes Sociales: Twitter:
<a href="https://twitter.com/RadiosLibres" target="_blank">@RadiosLibres</a>
</br>
<video id="reproductor" controls autoplay preload width="640" height="360" poster="http://radioslibres.net/wp-content/uploads/media/theme/images/RadiosLibres-Cabezal.png">
<source src="https://stream.codigosur.org:8000/kasandrxs.mp3" type="audio/mpeg">
</video>

Así se vería el reproductor:

alt_text

Tendrías que cambiar en la etiqueta video la URL del lugar donde este tu fotos, sino te saldrá el logo de radios libres:

poster="http://URL-de-tu-foto.png"

Reproductor para radio en línea con el título de la canción

23 Abril 2025 at 23:45

Desde que publicamos el tutorial sobre cómo instalar una radio en línea con un reproductor propio en HTML5, recibimos varias solicitudes sobre cómo incluir en el reproductor el título de la canción que está sonando en la radio. ¡Aquí tienes una posible solución para implementar aún sin saber mucho de programación web!

1. Pasos previos y requisitos

Es importante aclarar que, para que este título aparezca, cada tema debe tener la metadata correspondiente (metatags ID3). Son esas meta-etiquetas internas que tiene el archivo de audio (que no se escuchan) que indican al reproductor el título de la canción, artista que la interpreta, género, etc.

Los editores de audio como Audacity, al guardar el archivo, ofrecen la posibilidad de completarlas. Para editarlas puedes usar KID3, una aplicación -que viene instalada por defecto en Etertics GNU/Linux– que nos permite hacerlo fácilmente y en bloque para los archivos generales, tal como explica Pablo López en este titurial. Hay otras alternativas como EasyTag o MusicBrainz Picard.

El reproductor sirve en estos casos:

  • Un streaming que tenga instalado en el servidor Icecast, no para los que usan Shoutcast.
  • Un radio en línea que tenga un servidor propio, no para servicios gratuitos como Zeno, Listen2MyRadio o similares.
  • Es necesario que el servidor funcione bajo protocolo seguro https, suele fallar en los que no tienen la “s” (http).
  • Debe tener accesibles los datos a través de un archivo json (la mayoría tiene activada esta opción, de lo contrario habla con el adminsitrador).
  • El script está programado en javascript. Debes asegurarte de que tu sitio web permite este tipo de lenguaje.
  • Tienes que contar con persmisos de administración de tu página web y algunos conocimientos sobre HTML como, por ejemplo, saber colocar bloques HTML en tu CMS (WordPress, Drupal, o el que uses).

2. Comprobaciones

1.1. Ubica la dirección del streaming de tu radio

La dirección del streaming es la URL de transmisión. Si ya tienes un reproductor, es la dirección https configurada para el streaming. Esta dirección varía mucho en función de cómo esté configurado el servidor de streaming. Para confirmar que es correcta pega esa URL en un navegador y comprueba que se escucha la transmisión.

Por ejemplo: https://radios.liberaturadio.org/luisbeltran

O este otro: https://giss.tv:667/LaGaboneta.mp3 (La diferencia entre un reproductor y otro es el navegador. El de arriba es el nativo de Chrome y este de aquí abajo es el de Firefox).

1.2. Verifica que la página de datos del servidor está activa

Se conoce como server_status y, en principio, debería funcionar en todos los servidores Icecast. Sólo necesitas sustituir en la dirección anterior el punto de montaje de tu radio por status-json.xsl y pegarlo en el navegador.

En nuestro primer ejemplo sería: https://radios.liberaturadio.org/status-json.xsl

Y en el segundo: https://giss.tv:667/status-json.xsl

Esto mostrará todos los puntos de montaje disponibles en esa instancia, es decir, todas las radios en línea (streamings) existentes en el servidor. Si ves algo parecido a la imagen de aquí abajo significa que el archivo está disponible y puedes continuar (en Chrome se verá similar pero sin colores).

3. Código

Ahora sólo tienes que pegar el código javascrip de aquí abajo en tu página web para visualizar el reproductor. Si es WordPress utiliza un “bloque HTML”.

En este ejemplo estamos colocando un reproductor sencillo. Si quieres algo más elaborado en el que cambiar colores o incluir el logo de la emisora, consulta este manual.

Cargando información…

Código a copiar. En la línea const streamUrl = 'https://radios.liberaturadio.org/luisbeltran'; tendrás que remplazar la URL https://radios.liberaturadio.org/luisbeltran con tu dirección de streaming. Recuerda no borrar las comillas ni el punto y coma.

    <!-- Este es el reproductor de audio genérico que toma la URL del streaming por javascript -->

   <audio id="audioPlayer" controls>
        <source id="audioSource" type="audio/mpeg">
        Tu navegador no soporta el elemento de audio.
    </audio>
   
    <!-- Aquí se mostrará la canción que está sonando -->
    <div id="currentSong">Cargando información...</div>

    
   <script type="text/javascript">

            // Coloca aquí la URL de tu streaming, comprueba si pegas esa URL en un navegador la transmisión se escucha. No borres las comillas o el punto y coma final.
            const streamUrl = 'https://radios.liberaturadio.org/luisbeltran';


            async function fetchStreamInfo(streamUrl) {
                const url = new URL(streamUrl); // Extrae de la URL del streaming las disntitas partes
                const streamMount = url.pathname.split('/').pop(); // Obtener el punto de montaje
                const statusUrl = `${url.protocol}//${url.host}/status-json.xsl`; // Construye la URL del status-json

                try {
                        const response = await fetch(statusUrl);
                        if (!response.ok) throw new Error('Error en la red');

                        let data;

                        // Comprueba que el JSON existe
                        try {
                                data = await response.json(); // Para servidores con múltiples streams
                        } catch {
                                const text = await response.text(); // Para servidores con un único stream
                                data = JSON.parse(text);
                        }

                        // Verifica la estructura de datos
                        let stream;
                        if (data.icestats && Array.isArray(data.icestats.source)) {
                                // Para múltiples streams busca el correcto identificando el punto de montaje en el campo "listenurl"
                                stream = data.icestats.source.find(s => s.listenurl.includes(streamMount));
                        } else if (data.icestats.source) {
                                // Para servidores con un único stream la estructura json es diferente
                                stream = data.icestats.source;
                        } else {
                                throw new Error('Estructura de datos inesperada: ' + JSON.stringify(data));
                        }

                        // Mostramos la información del stream
                        const title = stream.title || 'Sin título';
                       
                        // El texto previo al título de la canción se puede modificar o eliminar, por defecto "Sonando:"
                        document.getElementById('currentSong').innerText = 'Sonando: ' + title;

                } catch (error) {
                        console.error('Error al obtener la información del stream:', error);
                        document.getElementById('currentSong').innerText = 'Error al cargar la información: ' + error.message;
                }
            }

            function setUpPlayer(streamUrl) {
                    document.getElementById('audioSource').src = streamUrl;
                    document.getElementById('audioPlayer').load();
                    fetchStreamInfo(streamUrl); // Llama a la función con la URL del stream
            }

            // Configuramos finalmente el reproductor
            setUpPlayer(streamUrl);
    
    </script>

4. Otros tutoriales

Quizás te pueden interesar estos artículos sobre radio en línea donde puedes aprender cómo instalar una radio en línea en 5 minutos o adaptar el reproductos con tu propia imagen.

Recursos y plataformas libres para comunicarnos y trabajar a la distancia

1 Abril 2025 at 23:29

Un listado de servicios libres (también gratuitos, aunque aceptan donaciones para mantenerlos activos) para que los medios comunitarios y organizaciones sociales usen alternativas abiertas y éticas, seguras y respetuosas de la privacidad, autónomas e independientes.

Un paso más en el camino hacia la soberanía tecnológica que exige el esfuerzo de todas las personas que integran estas organizaciones, poniendo recursos humanos y económicos para mantener la infraestructura y los servicios. Un esfuerzo para que las organizaciones lo usen en sus luchas pero sin olvidar a quienes están detrás de esas plataformas.

Entre [corchetes] están los idiomas de las plataformas. Clic en el ícono verde para acceder al servicio directamente.

OTROS SERVICIOS

Llistes de videotutorials de COMPETIC, ACTIC i altres

23 Diciembre 2024 at 22:57

He estat posant ordre al canal de videotutorials de COMPETIC / ACTIC i ja tinc casi tots els vídeos endreçats en llistes. Sé que no és el que se sol venir a buscar en el blog d’un webcòmic, però, mira, ja que hi he dedicat una estona us ho enllaço i potser us resulti útil o potser coneixeu algú a qui li pugui resultar útil. Està parit com a material didàtic per a un context d’escola d’adults però qualsevol interessat en millorar les seves habilitats TIC pot ser que li tregui una mica de suc a algun videotutorial. Alguns fan riure una mica però no sempre intencionadament. Comentaris, correccions i suggeriments són molt benvinguts.

Introduccions, presentacions i recursos:

ACTIC / COMPETIC Competències 1-3:

ACTIC / COMPETIC C4: Edició de text

ACTIC / COMPETIC C5: Edició d’imatge, so i vídeo

ACTIC / COMPETIC C6: Fulls de càlcul

ACTIC / COMPETIC C7: Bases de dades

ACTIC / COMPETIC C8: Presentacions de diapositives

Resolucions guiades de Projectes de COMPETIC de cursos anteriors:

GES, ESO i altres:

Com se sol dir, si us agrada algun vídeo, compartiu-lo, subscriviu-vos al canal, feu-li like o pengeu-lo al vostre Moodle o Classroom!

  • No hay más artículos
❌