Mura CMS Personalizando Carpetas

Una carpeta en Mura CMS es un tipo de nodo especial que puede servir para muchas funciones diferentes. En su esencia, una Carpeta está diseñada para tomar las páginas secundarias debajo de ella y mostrarlas en un formato de lista. El caso de uso más común para esto es un blog, una carpeta en su Administrador del sitio llamada "Blog", donde cada página debajo es una publicación de blog separada. Cuando visita la página del blog en el sitio web, todas las publicaciones se enumeran por orden de Fecha de publicación (definida en el administrador del sitio):

La carpeta del blog en el administrador del sitioLa página del blog tal como aparece en la parte delantera del sitio.

Cambiando la salida de la carpeta en Mura

Fuera de la caja, Mura le brinda una tonelada de flexibilidad para cambiar la salida de sus carpetas, sin tener que tocar ningún código. Cuando edite una carpeta, notará que hay una pestaña de "Opciones de visualización de lista":

En esto, puede editar el tamaño de la imagen e incluso determinar qué campos de datos desea mostrar:

Al cambiar algunas configuraciones en el blog y agregar un poco de CSS, puedes avanzar mucho con las carpetas de Mura:

Creación de una pantalla de carpeta personalizada

Si aún no puede lograr lo que desea con las personalizaciones de carpetas listas para usar de Mura, también puede crear su propia salida de carpeta.. 

1. Crea una extensión de clase personalizada para la carpeta

Como explicamos en el tutorial de las Extensiones de clase, las Extensiones de clase son una forma de agregar atributos a un nuevo subtipo de página. Las Extensiones de clase también se pueden usar como un gancho para que Mura intercepte un subtipo en particular y cambie su comportamiento predeterminado. Para hacer esto, necesitamos crear una nueva carpeta con un Subtipo de Blog.

Ahora podemos crear una nueva carpeta de Blog con este subtipo y conectarla en nuestro código.

La salida predeterminada de la carpeta proviene de siteID /includes/dsp_folder.cfm. Necesitamos copiar ese archivo y moverlo a siteID / includes / themes / themeName / display_objects / custom / extensions /dsp_Folder_Blog.cfm

Nota: El título de su archivo puede distinguir entre mayúsculas y minúsculas según el sistema operativo del servidor. Se recomienda que titule su archivo en el mismo caso que el nombre de sus atributos extendidos.

Nota: cambiando el nombre a dsp_Folder_Blog.cfm e incluyéndolo en el / extensiones En nuestro directorio, Mura utilizará automáticamente ese archivo en lugar de la salida de la carpeta predeterminada cuando se realice una Carpeta / Blog. Esto funcionará para todos los subtipos de contenido en este directorio con la sintaxis dsp_ Type _ SubType .cfm

2. Editar la salida de contenido.

Ahora que Mura está registrando nuestra carpeta personalizada en lugar de la predeterminada, podemos ingresar a nuestro archivo personalizado y modificarlo como lo decidamos. Cuando abre el archivo, las primeras 130 líneas de código son toda la lógica básica que querrá mantener para que ciertos aspectos de su carpeta funcionen, como la paginación, los filtros de categoría, etc.. No edites esta lógica a menos que realmente sepas lo que estás haciendo.!

La parte del archivo que realmente le preocupa comienza alrededor de la línea 133:

#variables. $. dspObject_Include (thefile = 'dsp_content_list.cfm', fields = variables. $. content ("displayList"), type = "Portal", iterator = variables.iterator, imageSize = variables. $. content ("ImageSize "), imageHeight = variables. $. content (" ImageHeight "), imageWidth = variables. $. content (" ImageWidth ")) #

Lo que hace este código es tomar toda la lógica de la carpeta por encima de él, luego pasarlo a través de un archivo llamado dsp_content_list.cfm. dsp_content_list.cfm es un extremadamente archivo complejo, que tiene todo tipo de lógica para mostrar todos los elementos posibles y los arreglos para los elementos de la carpeta (es decir, todas las opciones que vio en la Lista de opciones de visualización arriba). Ya que queremos rodar nuestra propia salida para nuestro blog, en realidad reemplazaremos este blog de código completo con nuestro propio iterador y recorreremos los elementos del blog usando nuestro propio marcado.

Como aprendimos en el tutorial de los iteradores de Mura, los iteradores de Mura son una manera de tomar contenido de un feed y recorrerlo utilizando su propio marcado. En la lógica principal del archivo dsp_folder_blog.cfm, todos los contenidos de la carpeta se están cargando en su propio iterador (variables.iterator), listo para repartirse.

Ya que el archivo ya tiene su carpeta lista para usar en un iterador, todo lo que tenemos que hacer es recorrer el contenido y mostrar nuestra pantalla:

 
# item.getTitle () #

# item.getTitle () #

# item.getSummary () #

Nota 1: cuando configuramos el ít variable en la línea 6, que es el acceso efectivo al alcance del contenido para cada elemento del bucle. Entonces cuando hacemos algo como:

# item.getTitle () #

Es lo mismo que si estuviéramos accediendo al alcance del contenido dentro de una plantilla de diseño:

# $. contenido ('título') #

Nota 2: He creado un tamaño de imagen personalizado en la configuración de mi sitio Mura llamado blog-img Eso es 400x200. La ventaja de hacer esto es que los usuarios pueden controlar el recorte de la imagen para que aparezca en la salida..

Ahora, cuando representamos la página final, podemos ver el mismo contenido del blog, representado en nuestro nuevo marcado:

La creación de diseños de carpetas personalizados es una excelente manera de crear temas creativos y sólidos sin tener que preocuparse por romper la funcionalidad central de Mura. Este método se puede utilizar para diferentes casos de uso al desarrollar sus temas, como Blogs, Portafolios, Páginas de equipo, etc..