Imagen Background usando Views Template

webmaster — Tue, 28 Feb 2023 19:58:09 +0000

Descripción

Este código permite imprimir una imagen de fondo utilizando vistas y plantillas mediante la declaración de una variable.

webmaster Mar, 28/02/2023 - 20:58

Instrucciones

Añadimos el campo imagen a nuestro contenido antes de crear la vista.
Creamos una vista del tipo "Fields o Campos" y añadimos los campos que deseamos mostrar.
Copiamos la plantilla "views-view-fields.html.twig" desde el módulo views y lo copiamos en las plantillas de nuestro tema personalizado
Creamos la estructura con los divs donde queremos poner nuestra imagen de fondo
Configuramos la vista para que muestre la URL de la imagen
En el template o plantilla declaramos una variable con nuestro campo imagen y luego podremos imprimir nuestro background.

{# Declaramos una variable y le asignamos el valor del campo sin etiquietas adicioales #}

{% set background_image = fields.yourimage_field.content|striptags|trim %}

<div style="background-image:url({{ background_image }});">
     <p>Nuestro contenido</>
</div>

Paginador

Categoría

Portada

Imagen cabecera con Bootstrap

webmaster — Tue, 28 Feb 2023 19:56:58 +0000