Plantillas de portada

Una plantilla de portada es esencialmente un archivo que contiene una o más áreas, implementadas usando las marcas LOOP: (%%loop1%% - %%/loop%%, %%loop2%% - %%/loop%%, ...). Dentro de cada LOOP puedes usar marcas de artículo. En el panel de administración, cada marca LOOP distinta se ve como un área distinta, en la que puedes agregar artículos mediante la interfaz drag&drop de Prontus. Cuando guardas una portada se procesa su plantilla: Prontus recorre cada LOOP y reemplaza las marcas de artículo por los valores correspondientes para cada artículo publicado en esa área.

subir

Consideraciones básicas

Debes ubicar las plantillas de portada en los directorios de plantillas de portada, dentro de  [nombre del prontus]/plantillas/edic/nroedic/. Por defecto existe un solo subdirectorio, port, de la vista principal, pero si habilitas multivistas habrán otros, siempre comenzando con el prefijo "port-", por ejemplo "port-movil".

Prontus guarda las portadas procesadas dentro de [nombre del prontus]/plantillas/site/edic/base/.  Para este ejemplo, al cargar contenido en la portada comunicaciones.html y guardar, verías un nuevo documento aparecer en [nombre del prontus]/site/edic/base/port/comunicaciones.html y [nombre del prontus]/site/edic/base/port/comunicaciones.html.

Puedes registrar una nueva portada manualmente, editando el archivo de configuración [nombre del prontus]/cpan/prontus_[nombre del prontus]-port.cfg, y agregando ahí un nuevo parámetro con el nombre de la nueva plantilla de portada, por ejemplo: PORT_PLTS = 'menu.html()'.

Si Prontus está con la opción multi-edición activa y se desea que esta nueva portada no genere multi-ediciones, entonces debe definirse además en el parámetro BASE_PORT, por ejemplo: BASE_PORT = 'menu.html'. Puedes aprender más sobre la funcionalidad de multi-ediciones en el artículo Implementar múltiples ediciones.

Para asociar un plantilla de portada a Prontus a traves del panel de administración, debes ingresar como usuario admin y visitar la página Administrar > Configuración > Portadas, y buscar el campo PORT_PLTS el cual se muestra a continuación.

En el campo Nueva portada verás el listado de portadas disponibles para agregar. Deberás además ingresar un nombre descriptivo para la portada y, si corresponde, seleccionar portadas paralelas.

subir

Estructura

La estructura de una plantilla de portada dependerá básicamente del diseño necesario para ese documento. La marca básica LOOP de Prontus permite definir áreas donde un usuario podrá cargar artículos, mostrando los datos como se haya definido.

Un ejemplo básico de áreas de portada es el siguiente:

...
%%loop1%%
<!-- incorporación de marcas que mostrará esta área --> 
%%/loop%% 

%%loop2%% 
<!-- incorporación de marcas que mostrará esta área --> 
%%/loop%% 
... 

Todas las marcas de artículo deben ingresarse dentro de las marcas %%loop(i)%% ... %%/loop%%. Puedes usar todas las marcas de artículo (reservadas o definidas por tí en los artículos) y de lógica dentro de la marca LOOP.

<section>
  %%loop1(destacado)%%
    %%if(txt_descripcion)%%
      %%txt_descripcion%%
    %%/if%%
    %%nif(txt_descripcion)%%
      %%vtxt_cuerpo(300)%%
    %%/nif%%
  %%/loop%%
</section>

Al usar marcas LOOP debemos considerar lo siguiente:

La sintaxis básica de las marcas LOOP es %%loop[n]%% ... %%/loop%%. Este bloque puede consistir de una o más líneas. Nota que el cierre de la marca es simplemente %%/loop%%, no %%/loop1%%. El número del loop no es opcional en las plantillas de portada.

Puedes agregar una descripción del área entre paréntesis luego del número de área: implementar un loop %%loop1(destacado)%% ... %%/loop%% resultará en esto:

Ese texto es puramente documental, sirve para entender mejor cuál es el propósito de esa área en el documento final.

Cada bloque delimitado por %%loop[n]%% ... %%/loop%% iterará tantas veces como artículos visibles se carguen en esa área. Concretamente, Prontus mostrará los artículos con alta, habilitados en esa área de esa portada, cuya fecha de publicación sea anterior a la actual y cuya fecha de expiración sea posterior a la actual.

Puedes repetir un mismo LOOP más veces dentro de una plantilla:

<header>
  %%loop1(destacado)%%
  <h2>%%_titular%%</h2>
  %%/loop%%
</header>
...
<section>
  %%loop1(destacados principales)%%
  %%txt_descripcion%%
  %%/loop%%
</section>

Al procesar la portada, Prontus iterará todos los artículos de esa área cada vez que encuentre esa marca LOOP. En este ejemplo, Prontus generará un bloque <header> con todos los titulares dentro de tags <h2> y luego un bloque <section> con todas las descripciones. En este caso, ten en cuenta que solamente se interpretará la descripción del último LOOP. En este caso, en el panel de administración verás esa área con la descripción "Destacados Principales", y no "Destacado".

Utilizando la marca reservada que define el tipo de artículo, es posible restringir un área especificando un tipo de artículo. Por ejemplo para definir el área 6 de manera que sólo pueda publicar artículos de tipo banner y botón, el código sería:

%%loop6(banners y botones%%
  %%if(_fid eq fid_banner)%%
      %%macro(macro_banner.html)%% 
  %%/if%% 
  %%if(_fid eq fid_boton)%% 
   %%macro(macro_boton.html)%% 
  %%/if%% 
%%/loop%

Puedes usar las marcas %%_loop_tags%% dentro de las plantillas de artículo y recorrer cada uno de los tags asociados  a un articulo. Para implementar el uso de los tags de un articulo en una plantilla de articulo y/o de portada se require recorrer el loop de tags asociados. Estas son las marcas disponibles:

• %%_loop_tags%% y %%_loop_tags%% para crear el listado
• %%_tag_id%% el id numérico del tag
• %%_tag_nom%% el tag como texto
• %%_tags_port%% 
• %%_tag_nom_vista%% el nombre de la vista específica para usar en plantillas de multivista
• %%_tag_url('all', 'tagport')%% permite generar la URL de una tagport específica para un tipo de artículo y plantilla.
• %%_fixed_tag_url%% la url amigable de la taxport si existe, la normal de otro modo

Un ejemplo de implementación (este código iría dentro de un %%loop%% de portada):

<div class="etiquetas">
  <span class="tag">Tags:</span>
    <ul>
    %%_loop_tags%%
      <li><a href="%%_fixed_tag_url%%" id="tag-%%_tag_id%%">#%%_tag_nom%%</a></li>
    %%/_loop_tags%%
  </ul>
</div>

La mayoría de las páginas web están compuestas por más de una página o template, lo cual es transparente para quien navega el sitio. En el caso de Prontus, esto se implementa creando portadas llamadas módulos o portadillas, y embebiendo esas portadas dentro de otras plantillas de portada o dentro de plantillas de artículo usando instrucciones PHP, SSI o de algún otro lenguaje de programación. Estás páginas que complementan la página principal (portada) como por ejemplo el encabezado o el footer, se denominan portadas complementarias o módulos. Dado que Prontus es un CMS que genera páginas estáticas, este modo de trabajar es mucho más eficiente que regenerar todos los artículos del sitio cuando cambiamos un enlace en el encabezado.

Por ejemplo, podemos tener un diseño en que el encabezado de todas las páginas está contenido en la portada _m_header.html. El nombre _m_header es absolutamente convencional. Para incluir esa portada dentro de otros documentos puedes usar una instrucción PHP como la siguiente:

<?php include $_SERVER['DOCUMENT_ROOT']."/%%prontus_id%%/site/edic/base/port/_m_header.html"; ?>

o puedes usar una instrucción SSI

<!--# include virtual="%%_prontus_id%%/site/edic/base/port/_m_header.html" -->

Puedes aprender más sobre cómo embeber módulos en Prontus en este artículo. Además, puedes aprender más sobre el uso de instrucciones SSI en el artículo sobre SSI en Prontus.

Nota: debes incluir el documento final, generado por Prontus en site/, y no la plantilla de portada.

No hay diferencias entre lo que puedes hacer en una portada "normal" y una portada complementaria. La diferencia está solamente en el uso. Típicamente una portada normal es un documento completo, mientras que una portada complementaria es comúnmente un bloque de código HTML (o de otro tipo) que embeberás en otro documento.

subir

Portadas paralelas

Las portadas paralelas sirven para mostrar el contenido de una portada de distintos modos: cada vez que guardes una portada, se actualizará la vista principal y las vistas paralelas. Por ejemplo, podrías querer generar junto a la portada noticias.html, una portada paralela en formato JSON para algún uso particular. Para esto, agregarías en el subdirectorio [nombre del prontus]/plantillas/edic/nroedic/port/ el archivo noticias.json, lo asignarías como portada paralela de la portada noticias.html, y al guardar esa portada, Prontus generaría los archivos [nombre del prontus]/site/edic/base/port/inicio.html y [nombre del prontus]/site/edic/base/port/inicio.json.

Nota: No es posible actualmente seleccionar una misma plantilla para múltiples usos, es decir, no puedes usar la plantilla "noticias.html" como portada principal y portada paralela a la vez, ni como portada paralela de dos portadas distintas.

subir

Portadas para Multivistas

Para las multivistas, por cada plantilla en el directorio principal debe existir una plantilla en cada subdirectorio de las otras vistas. Por ejemplo, si definiste la multivista "movil", existirán los directorios [nombre del prontus]/plantillas/edic/nroedic/port y [nombre del prontus]/plantillas/edic/nroedic/port-movil. Si creas una nueva plantilla de portada, "comunicaciones.html" en [nombre del prontus]/plantillas/edic/nroedic/port/comunicaciones.html, también deberás crear la plantilla análoga [nombre del prontus]/plantillas/edic/nroedic/port-movil/comunicaciones.html.

subir

XML de portadas

Cada vez que modificas y guardas una portada, Prontus genera un archivo XML en [nombre del prontus]/site/edic/base/xml/. Ese archivo tiene esta forma:

<?xml version="1.0" encoding="utf-8"?>
<PORT_DATA>
   <rowartic>
    <dir>20180830</dir>
    <file>20180830120729</file>
    <area>1</area>
    <ord>1</ord>
    <vb>1</vb>
    <pub>1</pub>
  </rowartic>
  <rowartic>
    <dir>20180830</dir>
    <file>20180830120644</file>
    <area>2</area>
    <ord>1</ord>
    <vb>1</vb>
    <pub>1</pub>
   </rowartic>
</PORT_DATA>

Con un bloque <rowartic> para cada artículo en esa portada. Ese elemento contiene:

• el directorio donde está almacenado el documento.
• el timestamp para acceder al archivo
• el área en que está publicado en la portada
• la posición en esa área
• si tiene visto bueno
• si tiene marca de publicación

El directorio xml/ contiene además un subdirectorio bak/ que contiene las 10 versiones más recientes del XML de cada portada, lo cual es útil en caso de accidentes: basta recuperar desde uno de esos backups el contenido de la portada.