En los extensos paisajes de la Orinoquía colombiana, donde el trabajo con el ganado hace parte de la identidad cultural del territorio, surge Cantos de Trabajo de Llano, un cortometraje documental que busca preservar y visibilizar una de las tradiciones orales más representativas de los Llanos colombo-venezolanos.
La producción, realizada en los municipios de Paz de Ariporo y Hato Corozal, en Casanare, retrata la profunda relación entre el hombre, el ganado y la naturaleza a través de expresiones ancestrales como el canto de vela, el canto de cabrestero y el canto de ordeño. Estas manifestaciones acompañan las labores diarias del llanero y funcionan como formas de comunicación, guía y conexión con el entorno.
Los Cantos de Trabajo de Llano fueron reconocidos por la UNESCO como Patrimonio Cultural Inmaterial de la Humanidad que requiere salvaguarda urgente, convirtiéndose en una de las declaratorias culturales más importantes para Colombia. Con más de 200 años de historia, esta tradición reúne cantos, silbos, gritos y llamados que hacen parte esencial de las dinámicas del trabajo ganadero en la región.
El documental, con una duración de 9 minutos y 50 segundos, fue desarrollado por realizadores que integran el Consejo Departamental de Cinematografía de Casanare, en articulación con el Ministerio de Cultura y la Gobernación de Casanare. La obra combina una mirada estética y sensible con una reflexión sobre la pérdida de identidad cultural y el distanciamiento de las nuevas generaciones frente a estas prácticas ancestrales.
Uno de los protagonistas del relato es Don Hermes Romero, portador certificado por la UNESCO y custodio de esta tradición desde hace más de cuatro décadas. Su testimonio aporta autenticidad y profundidad emocional a una narrativa que busca mantener viva la memoria sonora del llano.
A lo largo del documental también se exploran los orígenes de las letras, la función práctica de los cantos en el manejo del ganado y las preocupaciones frente al futuro de esta manifestación cultural. Más allá de una pieza audiovisual, Cantos de Trabajo de Llano se convierte en un ejercicio pedagógico y de memoria que invita a reconocer la importancia de proteger un patrimonio que trasciende las fronteras regionales.
La producción fue dirigida por Joseph Felipe Botia, quien además estuvo a cargo del guion e investigación. El equipo técnico contó con la producción de Artidoro Botía, la producción ejecutiva de Yeimi Rodríguez, dirección de fotografía de Valeria Porras y el diseño sonoro y montaje de Andrés Maldonado, entre otros profesionales comprometidos con la preservación cultural del territorio llanero.
Responsive Banner
.gradient-left {
background: linear-gradient(to right, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));
}
.right-image-gradient {
position: absolute;
top: 0;
left: -6px;
width: 60%;
height: 100%;
background: linear-gradient(to right, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));
z-index: 20;
pointer-events: none;
}
.banner-img {
filter: blur(3px);
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
aspect-ratio: 16/9;
min-height: 100%;
max-height: 100%;
max-width: 100%;
min-width: 100%;
display: block;
position: relative;
z-index: 10;
}
.popup {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
z-index: 1000;
justify-content: center;
align-items: center;
}
.popup iframe {
max-width: 90%;
max-height: 80%;
width: 100%;
aspect-ratio: 16 / 9;
}
play_circle
function openPopup() {
const popup = document.getElementById('videoPopup');
const iframe = popup.querySelector('iframe');
iframe.src = 'https://www.youtube.com/embed/u4cqE-FbIkQ?autoplay=1';
popup.style.display = 'flex';
document.addEventListener('click', closePopupOutside);
}
function closePopupOutside(event) {
const popup = document.getElementById('videoPopup');
if (event.target === popup) {
popup.style.display = 'none';
popup.querySelector('iframe').src = '';
document.removeEventListener('click', closePopupOutside);
}
}
// Función para procesar los módulos
function processModules(attempt = 1, maxAttempts = 5) {
// Obtener los módulos por sus IDs
const titleModule = document.getElementById('TITULO');
const subtitleModule = document.getElementById('SUBTITULO');
const dateModule = document.getElementById('FECHA');
const genreModule = document.getElementById('GENERO');
const bodyModule = document.getElementById('BODY');
const imageModule = document.getElementById('IMAGEN');
const creditsModule = document.getElementById('CREDITOS');
// Verificar si los módulos existen
if (!titleModule || !subtitleModule || !dateModule || !genreModule || !bodyModule || !imageModule || !creditsModule) {
console.error(`Intento ${attempt}: Uno o más módulos no se encontraron. Verifica los IDs: TITULO, SUBTITULO, FECHA, GENERO, BODY, IMAGEN, CREDITOS`);
console.log('TITULO existe:', !!titleModule);
console.log('SUBTITULO existe:', !!subtitleModule);
console.log('FECHA existe:', !!dateModule);
console.log('GENERO existe:', !!genreModule);
console.log('BODY existe:', !!bodyModule);
console.log('IMAGEN existe:', !!imageModule);
console.log('CREDITOS existe:', !!creditsModule);
if (attempt processModules(attempt + 1, maxAttempts), 1000);
} else {
console.error('Se alcanzó el máximo de intentos. No se encontraron todos los módulos.');
}
return;
}
// Ocultar los módulos originales
titleModule.style.display = 'none';
subtitleModule.style.display = 'none';
dateModule.style.display = 'none';
genreModule.style.display = 'none';
bodyModule.style.display = 'none';
imageModule.style.display = 'none';
creditsModule.style.display = 'none';
// Extraer el contenido
const titleText = titleModule.innerText.trim();
const subtitleText = subtitleModule.innerText.trim();
let dateText = dateModule.innerText.trim();
const genreText = genreModule.innerText.trim();
let bodyContent = bodyModule.innerHTML.trim();
let imageUrl = '';
// Procesar el contenido del cuerpo para respetar la estructura de párrafos y listas
const tempDiv = document.createElement('div');
tempDiv.innerHTML = bodyContent;
const processedContent = Array.from(tempDiv.children)
.map(child => {
if (child.classList.contains('paragraph')) {
return `
${child.innerHTML.trim()}
`;
} else if (child.tagName === 'UL') {
return child.outerHTML;
} else {
return child.outerHTML;
}
})
.filter(content => content && content.length > 0)
.join('');
bodyContent = processedContent || bodyContent;
// Depuración: mostrar el contenido del módulo IMAGEN
console.log('Contenido crudo del módulo IMAGEN (innerHTML):', imageModule.innerHTML);
console.log('Texto del módulo IMAGEN (innerText):', imageModule.innerText);
// Intentar obtener la URL de la imagen
const imageElement = imageModule.querySelector('img');
console.log('Elemento
![]()
encontrado:', imageElement);
if (imageElement && imageElement.src) {
imageUrl = imageElement.src;
console.log('URL extraída de
![]()
:', imageUrl);
} else {
console.log('No se encontró una etiqueta
![]()
en el módulo IMAGEN');
const textContent = imageModule.innerText.trim();
const urlMatch = textContent.match(/(https?:\/\/[^\s]+)/);
if (urlMatch) {
imageUrl = urlMatch[0];
console.log('URL extraída del texto:', imageUrl);
} else {
console.log('No se encontró una URL válida en el módulo IMAGEN');
imageUrl = 'https://telepacifico.com/images/default.jpg'; // Imagen por defecto
}
}
const creditsText = creditsModule.innerText.trim();
// Depuración: mostrar todos los valores extraídos
console.log('Valores extraídos:');
console.log('Título:', titleText);
console.log('Subtítulo:', subtitleText);
console.log('Fecha:', dateText);
console.log('Género:', genreText);
console.log('Cuerpo:', bodyContent);
console.log('URL de imagen:', imageUrl);
console.log('Créditos:', creditsText);
// Procesar links de redes sociales en el bodyContent
bodyContent = processSocialLinks(bodyContent);
// Crear el contenedor para el formato personalizado
const container = document.getElementById('news-container');
if (!container) {
console.error('El contenedor news-container no se encontró');
return;
}
// Construir el HTML manualmente
const imageHtml = imageUrl ? '
%20+%20)
' : '';
const creditsHtml = creditsText ? '
Crédito: ' + creditsText + '
' : '';
container.innerHTML = [
'',
'
',
'
' + titleText + '
',
'
' + subtitleText + '
',
'
',
'
',
imageHtml,
creditsHtml,
'
',
'
' + bodyContent + '
',
'
'
].join('');
console.log('HTML insertado en news-container:', container.innerHTML);
// Convertir la fecha a formato ISO 8601 si no lo está
let isoDate;
try {
const dateObj = new Date(dateText);
if (isNaN(dateObj)) {
console.warn('Fecha no válida, usando fecha actual como respaldo');
isoDate = new Date().toISOString();
} else {
isoDate = dateObj.toISOString();
}
} catch (e) {
console.warn('Error al parsear la fecha, usando fecha actual como respaldo', e);
isoDate = new Date().toISOString();
}
// Crear el script de Schema.org dinámicamente
const articleBodyText = bodyModule.textContent.trim(); // Usar textContent para texto plano sin HTML
const schema = {
"@context": "http://schema.org",
"@type": "ReportageNewsArticle",
"url": window.location.href,
"thumbnailUrl": imageUrl,
"headline": titleText,
"description": subtitleText,
"datePublished": isoDate,
"dateModified": isoDate,
"publisher": {
"@type": "NewsMediaOrganization",
"name": "Telepacífico",
"publishingPrinciples": "https://telepacifico.com/legal-web/terminos-y-condiciones",
"logo": {
"@type": "ImageObject",
"width": 512,
"height": 512,
"url": "https://telepacifico.com/templates/yootheme/cache/39/Logo_Vertical-397e89a3.webp"
}
},
"image": {
"@type": "ImageObject",
"width": 1024,
"height": 576,
"url": imageUrl
},
"mainEntityOfPage": {
"@type": "WebPage",
"@id": window.location.href,
"name": titleText
},
"inLanguage": {
"@type": "Language",
"name": "Spanish",
"alternateName": "es"
},
"about": [
{
"@type": "Thing",
"name": genreText
}
],
"author": {
"@type": "Organization",
"name": "Telepacífico",
"sameAs": "https://telepacifico.com/"
},
"articleBody": articleBodyText
};
const schemaScript = document.createElement('script');
schemaScript.type = 'application/ld+json';
schemaScript.textContent = JSON.stringify(schema);
document.head.appendChild(schemaScript);
console.log('Script de Schema.org agregado:', schemaScript.textContent);
}
// Función para procesar links de redes sociales y reemplazarlos con embeds/miniaturas
function processSocialLinks(bodyHtml) {
const parser = new DOMParser();
const doc = parser.parseFromString(bodyHtml, 'text/html');
const links = doc.querySelectorAll('a');
const scriptsToAdd = new Set();
links.forEach(link => {
let href = link.href.toLowerCase(); // Para facilitar la comparación
let originalHref = link.href; // Mantener el original para el embed
if ((href.startsWith('https://twitter.com/') || href.startsWith('https://x.com/')) && /\/status\/\d+/.test(href)) {
// Para este post específico, insertar ambos embeds (custom para desktop, estándar para mobile)
if (originalHref === 'https://x.com/TPNoticias_/status/1961083511328116845' || originalHref === 'https://twitter.com/TPNoticias_/status/1961083511328116845') {
const wrapper = doc.createElement('div');
wrapper.className = 'embed-wrapper';
// Custom embed para desktop
const customEmbed = doc.createElement('div');
customEmbed.className = 'desktop-embed custom-embed';
customEmbed.innerHTML = `
🚨 #Atención | Hostigamientos en Dagua ⚠️
Desde la cabecera municipal de Dagua, se reportan hostigamientos por parte de grupos al margen de la ley contra las autoridades.
La situación mantiene en alerta a la comunidad, que manifiesta temor y prefiere no salir de sus casas.
Seguiremos informando. #NoticiaEnDesarrollo
`;
wrapper.appendChild(customEmbed);
// Embed estándar para mobile
let standardHref = originalHref;
if (href.startsWith('https://x.com/')) {
standardHref = originalHref.replace('x.com', 'twitter.com');
}
const mobileEmbed = doc.createElement('div');
mobileEmbed.className = 'mobile-embed';
const blockquote = doc.createElement('blockquote');
blockquote.className = 'twitter-tweet';
const a = doc.createElement('a');
a.href = standardHref;
a.innerText = link.innerText || standardHref;
blockquote.appendChild(a);
mobileEmbed.appendChild(blockquote);
wrapper.appendChild(mobileEmbed);
link.parentNode.replaceChild(wrapper, link);
scriptsToAdd.add('twitter');
} else {
// Para otros posts de X, usa el embed estándar
if (href.startsWith('https://x.com/')) {
originalHref = originalHref.replace('x.com', 'twitter.com');
}
const blockquote = doc.createElement('blockquote');
blockquote.className = 'twitter-tweet';
const a = doc.createElement('a');
a.href = originalHref;
a.innerText = link.innerText || originalHref;
blockquote.appendChild(a);
link.parentNode.replaceChild(blockquote, link);
scriptsToAdd.add('twitter');
}
} else if (href.startsWith('https://www.instagram.com/') && (href.includes('/p/') || href.includes('/reel/'))) {
// Embed de Instagram
const blockquote = doc.createElement('blockquote');
blockquote.className = 'instagram-media';
blockquote.setAttribute('data-instgrm-permalink', originalHref);
blockquote.setAttribute('data-instgrm-version', '14');
// Añadir fallback: un enlace simple
const fallbackA = doc.createElement('a');
fallbackA.href = originalHref;
fallbackA.innerText = 'Ver en Instagram: ' + (link.innerText || originalHref);
blockquote.appendChild(fallbackA);
link.parentNode.replaceChild(blockquote, link);
scriptsToAdd.add('instagram');
} else if (href.startsWith('https://www.youtube.com/watch?v=') || href.startsWith('https://youtu.be/')) {
// Embed de YouTube (iframe con miniatura implícita en el player)
let videoId;
if (href.startsWith('https://youtu.be/')) {
videoId = href.split('https://youtu.be/')[1].split('?')[0];
} else {
const url = new URL(originalHref);
videoId = url.searchParams.get('v');
}
if (videoId) {
const iframe = doc.createElement('iframe');
iframe.width = '560';
iframe.height = '315';
iframe.src = `https://www.youtube.com/embed/${videoId}`;
iframe.frameBorder = '0';
iframe.allow = 'accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture';
iframe.allowFullscreen = true;
link.parentNode.replaceChild(iframe, link);
}
} else if (href.startsWith('https://www.facebook.com/') && href.includes('/posts/')) {
// Embed de Facebook
const div = doc.createElement('div');
div.className = 'fb-post';
div.setAttribute('data-href', originalHref);
// Añadir fallback: un enlace simple
const fallbackA = doc.createElement('a');
fallbackA.href = originalHref;
fallbackA.innerText = 'Ver en Facebook: ' + (link.innerText || originalHref);
div.appendChild(fallbackA);
link.parentNode.replaceChild(div, link);
scriptsToAdd.add('facebook');
}
});
// Añadir scripts necesarios al final del body si se usaron embeds
if (scriptsToAdd.has('twitter')) {
const script = document.createElement('script');
script.async = true;
script.charset = 'utf-8';
script.src = 'https://platform.twitter.com/widgets.js';
document.body.appendChild(script);
}
if (scriptsToAdd.has('instagram')) {
const script = document.createElement('script');
script.async = true;
script.src = 'https://www.instagram.com/embed.js';
document.body.appendChild(script);
}
if (scriptsToAdd.has('facebook')) {
if (!document.getElementById('fb-root')) {
const fbRoot = document.createElement('div');
fbRoot.id = 'fb-root';
document.body.appendChild(fbRoot);
}
const script = document.createElement('script');
script.async = true;
script.defer = true;
script.crossOrigin = 'anonymous';
script.src = 'https://connect.facebook.net/es_ES/sdk.js#xfbml=1&version=v18.0';
document.body.appendChild(script);
}
return doc.body.innerHTML;
}
// Ejecutar cuando el DOM esté cargado
document.addEventListener('DOMContentLoaded', function() {
processModules();
});
/* Estilos generales */
#news-container {
max-width: 1200px;
margin: 0 auto;
padding: 20px;
font-family: 'Encode Sans', sans-serif;
}
/* Estilos para pantallas grandes (desktop) */
@media (min-width: 768px) {
#news-container {
display: block; /* Flujo natural para el contenedor principal */
}
.header-meta {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 10px;
}
.news-date {
font-size: 0.9rem;
margin: 0;
}
.news-genre {
font-size: 0.9rem;
margin: 0;
text-transform: uppercase;
}
.social-icons {
display: flex;
justify-content: flex-end;
margin-bottom: 10px;
}
.social-icon {
font-size: 1.5rem;
margin-left: 10px;
color: #333;
text-decoration: none;
}
.social-icon:hover {
color: #007bff;
}
.news-title {
font-size: 2.5rem;
margin: 0;
position: relative;
padding-bottom: 10px;
font-weight: 700;
}
.news-title::after {
content: '';
position: absolute;
left: 0;
bottom: 0;
width: 100px;
height: 4px;
background-color: red;
}
.news-subtitle {
font-size: 1.5rem;
margin: 10px 0 20px 0;
font-weight: 400;
}
.content-wrapper {
position: relative; /* Contexto para el float */
overflow: hidden; /* Asegura que el contenedor respete el float */
}
.image-container {
float: right; /* Imagen flota a la derecha */
margin: 0 0 15px 15px; /* Espaciado para el texto */
max-width: 40%; /* Limita el ancho de la imagen */
}
.news-image {
max-width: 100%;
height: auto;
border-radius: 10px;
object-fit: cover;
}
.image-credits {
font-style: italic;
font-size: 0.9rem;
text-align: right;
background-color: #E5E5E5;
padding: 5px 10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
margin-top: 5px;
width: 100%;
}
.news-body {
font-size: 1rem;
line-height: 1.6;
}
.news-body p {
margin: 0 0 15px 0;
break-inside: avoid; /* Evita que los párrafos se rompan */
}
.news-body ul {
list-style-type: disc;
margin: 0 0 15px 20px;
}
.news-body li {
margin-bottom: 5px;
}
.news-body iframe, /* Para embeds responsivos */
.news-body blockquote {
max-width: 80%; /* Ajuste para hacer los embeds más pequeños en desktop (80% del ancho disponible) */
margin: 15px 0; /* Sin auto para alinear a la izquierda */
display: block; /* Asegura que sea un bloque centrado */
}
/* Ajustes específicos para embeds de X/Twitter estándar */
.news-body .twitter-tweet {
max-width: 500px; /* Ancho máximo fijo para Twitter embeds, ajusta según necesites */
}
/* Ajustes para Instagram */
.news-body .instagram-media {
max-width: 500px;
}
/* Ajustes para Facebook */
.news-body .fb-post {
max-width: 500px;
}
/* Estilos para el wrapper */
.embed-wrapper {
max-width: 80%;
margin: 15px 0; /* Sin auto para alinear a la izquierda */
}
/* Mostrar custom en desktop */
.desktop-embed {
display: block;
}
/* Ocultar estándar en desktop */
.mobile-embed {
display: none;
}
/* Estilos para el embed personalizado */
.custom-embed {
display: flex;
flex-direction: column;
padding: 15px;
border: 1px solid #ddd;
border-radius: 8px;
background-color: #f9f9f9;
}
.custom-embed .top-section {
display: flex;
flex-direction: row;
align-items: flex-start;
gap: 20px;
margin-bottom: 15px;
}
.custom-embed .media-content {
flex: 1;
}
.custom-embed .embed-video {
max-width: 100%;
height: auto;
border-radius: 8px;
}
.custom-embed .author-info {
flex: 0 0 150px;
text-align: center;
}
.custom-embed .avatar {
width: 50px;
height: 50px;
border-radius: 50%;
display: block;
margin: 0 auto 10px;
}
.custom-embed .username {
display: block;
font-weight: bold;
}
.custom-embed .username a {
text-decoration: none;
color: #1da1f2;
}
.custom-embed .timestamp {
display: block;
color: gray;
font-size: 0.8rem;
}
.custom-embed .post-content {
width: 100%; /* Horizontal full width */
}
/* Asegura que el texto fluya después del float */
.content-wrapper::after {
content: '';
display: block;
clear: both;
}
/* Estilos para h3 en el cuerpo (más grandes y en negrita) */
.news-body h3 {
font-size: 1.4rem;
font-weight: bold;
margin: 20px 0 10px 0;
}
}
/* Estilos para pantallas pequeñas (mobile) */
@media (max-width: 767px) {
#news-container {
display: flex;
flex-direction: column;
align-items: center;
}
.header-meta {
order: 1;
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
margin-bottom: 10px;
}
.news-date {
font-size: 0.8rem;
margin: 0;
}
.news-genre {
font-size: 0.8rem;
margin: 0;
text-transform: uppercase;
}
.news-title {
order: 2;
font-size: 1.8rem;
text-align: center;
position: relative;
padding-bottom: 10px;
margin-bottom: 10px;
font-weight: 700;
}
.news-title::after {
content: '';
position: absolute;
left: 50%;
bottom: 0;
width: 80px;
height: 4px;
background-color: red;
transform: translateX(-50%);
}
.news-subtitle {
order: 3;
font-size: 1.2rem;
text-align: center;
margin: 10px 0 20px 0;
font-weight: 400;
}
.content-wrapper {
order: 4;
width: 100%;
}
.image-container {
order: 5;
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
margin-bottom: 10px;
float: none; /* Sin float en móvil */
}
.news-image {
max-width: 100%;
height: auto;
border-radius: 10px;
object-fit: cover;
margin-bottom: 5px;
}
.image-credits {
font-style: italic;
font-size: 0.8rem;
text-align: right;
background-color: #E5E5E5;
padding: 5px 10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
width: 100%;
}
.social-icons {
order: 6;
display: flex;
justify-content: center;
margin-top: 10px;
margin-bottom: 20px;
}
.social-icon {
font-size: 1.3rem;
margin: 0 8px;
color: #333;
text-decoration: none;
}
.social-icon:hover {
color: #007bff;
}
.news-body {
order: 7;
font-size: 1rem;
line-height: 1.5;
margin-bottom: 20px;
}
.news-body p {
margin: 0 0 15px 0;
}
.news-body ul {
list-style-type: disc;
margin: 0 0 15px 20px;
}
.news-body li {
margin-bottom: 5px;
}
.news-body iframe, /* Para embeds responsivos en móvil */
.news-body blockquote {
max-width: 100%;
margin: 15px 0;
}
/* Ocultar custom en mobile */
.desktop-embed {
display: none;
}
/* Mostrar estándar en mobile */
.mobile-embed {
display: block;
}
/* Estilos para h3 en el cuerpo (más grandes y en negrita, ajustado para mobile) */
.news-body h3 {
font-size: 1.2rem;
font-weight: bold;
margin: 15px 0 8px 0;
}
}