Cómo crear una plantilla de tags jerárquicos
El sistema de tags jerárquicos provee una funcionalidad similar a la taxonomía para clasificar artículos pero con mayor flexibilidad. Esta funcionalidad de Prontus combina el orden jerarquizado de las taxonomías con la libertad de catalogar múltiples veces de los tags. En este tutorial aprenderás cómo crear plantillas para listas de tags jerárquicos, y dónde ubicarlas.
Última modificación: Viernes 21 de agosto de 2020
Para poder procesar vistas para los tags jerárquicos en Prontus debe existir el directorio /[nombre del sitio]/plantillas/multitag/
. una vez ubicado el directorio, debes crear (en caso de que no exista), el archivo "default.html
". Este archivo funciona de forma analoga a como lo hacen los archivos para las portadas taxonómicas y de tags. Por defecto tener el nombre "default.html". Para cambiarle de nombre (por ejemplo para usar otro formato, como JSON), debes modificar la configuración de tu webserver. Puedes ver cómo hacer esto en el artículo plantillas de tags jerárquicos.
Una vez creado el archivo "default.html" debes editarlo según tu sitio lo requiera. El siguiente es un ejemplo mínimo con las marcas necesarias para la generación de las vistas de tags jerárquicos.
<h2>Ejemplo de usoArtículos de Tags jerárquicos</h2>
<ul class="content_det">
%%loop%%
%%nif(_fid eq "fid_autor")%%
<li class="item">
<div class="art_content">
%%if(txt_titular_friendly)%%<a href="%%_fileurl%%"><h3 class="public-tit">%%titular_friendly%%</h3></a>%%/if%% %%nif(txt_titular_friendly)%%
<a href="%%_fileurl%%"><h3 class="public-tit">%%_titular%%</h3></a>%%/nif%%
<ul class="datos-art">
<li >
%%_loop_multitag_seccion%%<a href="/%%_prontus_id%%/%%_multitag_seccion_friendly%%" class="tit"> %%_multitag_seccion_nom%%</a> %%/_loop_multitag_seccion%%
</li>
<li >
%%_loop_multitag_tema%%<a href="/tema/%%_multitag_tema_friendly%%/p/1" class="tit"> %%_multitag_tema_nom%%</a>%%/_loop_multitag_tema%%
</li>
<li>
%%_loop_multitag_subtema%%<a href="/tema/%%_multitag_subtema_friendly%%/p/1" class="tit"> %%_multitag_subtema_nom%%</a>%%/_loop_multitag_subtema%%
</li>
</ul>
</div>
</li>
%%/nif%%
%%/loop%%
</ul>
Del codigo anterior se destaca el uso del _loop_multitag_seccion:
%%_loop_multitag_seccion%%
<a href="/%%_prontus_id%%/%%_multitag_seccion_friendly%%" class="tit"> %%_multitag_seccion_nom%%</a>
%%/_loop_multitag_seccion%%
Donde se ejecuta un loop para recorrer todos los multitag tipo sección que tiene asignado un articulo. Los datos que en este ejemplo se usan son: _multitag_seccion_friendly que contiene el enlace a la pàgina multitag y _multitag_seccion_nom que contiene el texto del nombre del multitag_seccion.
Lo mismo ocurre para los multitag tema:
%%_loop_multitag_tema%%
<a href="/tema/%%_multitag_tema_friendly%%/p/1" class="tit"> %%_multitag_tema_nom%%</a>%%/_loop_multitag_tema%%
Las vistas de tags jerárquicos no se generan estáticamente al modificar artículos, sino que se generan dinámicamente cuando un usuario visita una página de un tag dado. Al visitar por ejemplo la página del tag "tutoriales-prontus", Prontus genera esa página dinámicamente y crea un archivo de caché, que cargará la próxima vez que un usuario visite ese tag. Para eliminar estas páginas cacheadas y volver a procesar las plantillas de tags jerárquicos y generar las salidas según los artículos publicados, debes visitar la página Publicar → Administrar Tags Jerárquicos del panel de administración de Prontus.
En esta vista debes hacer click en el botón "Borrar caché de Multitags".
Debes dar click en el mensaje de confirmación en el botón "Continuar"
Una vez finalizado el proceso de regeneración de las portadas de Tags Jerárquicos se mostrará el siguiente mensaje:
Finalmente podrás revisar y copiar los links a cada una de las portadas de tags jerárquicos haciendo click en el siguiente icono:
Una vez definida tu plantilla de tags jerárquicos y algunos tags, vas a necesitar que los usuarios puedan visitar esos listados de tags. Para esto una alternativa es generar una interfaz de selección. Puedes crear de forma independiente vistas de listas de articulos para vistas de sección, temas y subtemas de forma independiente, (Ver Ejemplo para plantilla de selectores)
En /[nombre del sitio]/plantillas/multitag/
crea el siguiente archivo (En caso de que no exista), "secciones.html
" y coloca el código:
<select class="form-control" name="multitag-search-secciones" id="multitag-search-secciones">
<option value=""> -- Selecciona -- </option>
%%loop%%
<option value="%%value%%">%%name%%</option>
%%/loop%%
</select>
En /[nombre del sitio]/plantillas/multitag/
crea el siguiente archivo (En caso de que no exista), "temas.html
" y coloca el código:
<select class="form-control" name="multitag-search-temas" id="multitag-search-temas">
<option value=""> -- Selecciona -- </option>
%%loop%%<option value="%%value%%">%%name%%</option>%%/loop%%
</select>
En /[nombre del sitio]/plantillas/multitag/
crea el siguiente archivo (En caso de que no exista), "subtemas.html
" y coloca el código:
<select class="form-control" name="multitag-search-subtemas" id="multitag-search-subtemas">
<option value=""> -- Selecciona -- </option>
%%loop%%
<option value="%%value%%">
%%name%%
</option>
%%/loop%%
</select>
Regenerar
Una vez creadas o editadas las vistas de multitags, debes regenerarlas haciendo click en el botón "Actualizar vistas de Multitags"
Los Archivos generados se encontraran en el directorio /[nombre del prontus]/site/multitag/ con los nombres secciones.html, temas.html, subtemas.html de la siguiente forma:
Combo de Secciones:
/[nombre del prontus]/site/multitag/secciones.html
Combo de Temas:
/[nombre del prontus]/site/multitag/temas.html
Combo de Subtemas:
/[nombre del prontus]/site/multitag/subtemas.html
Una vez generadas las vistas de Tags Jerárquicos de Secciones, Temas y Subtemas podemos hacer uso de ellas en cualquier Portada que deseemos. En el siguiente ejemplo verás como se implementan las vistas en una portada que hemos llamado "inicio.html", ubicada en /[nombre del sitio]/plantillas/edic/nroedic/port/ haciendo uso del siguiente código:
<div class="row">
<div class="col-sm-4">
<!--#include virtual="/%%_prontus_id%%/site/multitag/secciones.html"-->
</div>
<div class="col-sm-4">
<!--#include virtual="/%%_prontus_id%%/site/multitag/temas.html"-->
</div>
<div class="col-sm-3">
<!--#include virtual="/%%_prontus_id%%/site/multitag/subtemas.html"-->
</div>
</div>
El código completo del archivo de la portada "inicio.html" quedaría de la siguiente forma:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Ejemplo de Portada con Vistas de Tags Jerárquicos</title>
</head>
<body class="pro-inicio">
<header class="header-container">
<!--# include file="/%%_prontus_id%%/site/edic/base/port/_m_header.html" -->
</header>
<div id="main-content" class="container">
<section id="encabezado">
%%loop1(destacado)%%
%%if(_loopcounter == 1)%%
<h1>%%_titular%%</h1>
%%if(_txt_bajada)%%
%%_txt_bajada%%
%%/if%%
%%/if%%
%%/loop%%
</section>
<section id="busqueda" class="container">
<h2>Buscar </h2>
<div class="row pro-buscar">
<div class="col-sm-9 nopad">
<form id="searchform-multitags" method="get" action="">
<div class="row">
<div class="col-sm-12">
<h4>Por categorías</h4>
</div>
</div>
<div class="row">
<div class="col-sm-4">
<!--#include virtual="/%%_prontus_id%%/site/multitag/secciones.html"-->
</div>
<div class="col-sm-4">
<!--#include virtual="/%%_prontus_id%%/site/multitag/temas.html"-->
</div>
<div class="col-sm-3">
<!--#include virtual="/%%_prontus_id%%/site/multitag/subtemas.html"-->
</div>
<div class="col-sm-1">
<button id="busca_mtag" class="btn btn-default" type="submit"><span class="fas fa-search"></span></button>
</div>
</div>
</form>
</div>
</div>
<h2 id="titulo_busqueda" style="display:none">Resultados de la búsqueda</h3>
<section id="search-resultados" style="display:none">
</section>
</section>
</div>
<footer class="footer-container">
<!--# include file="/%%_prontus_id%%/site/edic/base/port/_m_footer.html" -->
</footer>
<!--# include file="/%%_prontus_id%%/js-local/_includedjavascripts_port.html" -->
</body>
</html>
Archivos adjuntos
Conceptos Básicos
¿Qué es Prontus?
Estructura de directorios
Glosario
Navegadores soportados
Tutoriales
Instalación de Prontus CMS
Implementar un nuevo sitio en Prontus
Cómo crear un FID
Cómo crear una plantilla de artículo
Cómo crear una plantilla de portada
Cómo crear plantillas de formulario
Cómo implementar un formulario
Cómo implementar un buscador
Cómo implementar un buscador Elasticsearch
Cómo crear una plantilla de taxonomía
Cómo crear plantillas de tags
Cómo crear una plantilla de listado
Cómo crear una plantilla de tags jerárquicos
Implementar carga de videos en Prontus
Integración de Redes Sociales
Instalación y Configuración
Requerimientos
Configuración del servidor
Base de datos
Asegurar la plataforma
Instalación con Wizard Prontus
Ajustes post-instalación
Archivos de configuración de Prontus
Friendly URLs
Friendly URLs para imágenes
SSI en Prontus
Logs de Eventos
Ejecutar procesos periódicamente con cron
Debugging
Plantillas
Plantillas de FID
Plantillas de artículo
Plantillas de portada
Plantillas de taxonomía
Plantillas de artículos relacionados
Plantillas de tags
Plantillas de listado
Plantillas de tags jerárquicos
Plantillas de mapa de taxonomía
Plantillas de mapa de tags
Marcas
Tipos de marcas
Diccionario de marcas
Marcas para texto
Marcas de lógica
Marcas de despliegue
Marca Menú y Panel
Parsing de marcas en formularios Prontus
Funcionalidades
Funcionalidades SEO en Prontus CMS
Multivistas
Galería de Imágenes
Buscador Multivista
Buscador
Buscador Elasticsearch
Calendarios
Imprimir artículos
Posting de contenidos
Plugins
Post-procesos
Prontus functions
Implementar copias de seguridad automáticas con Dropbox
Implementar múltiples ediciones
Regeneración masiva de artículos via línea de comandos