Imagen Background usando Views Template

Instrucciones
  1. Añadimos el campo imagen a nuestro contenido antes de crear la vista.
     
  2. Creamos una vista del tipo "Fields o Campos" y añadimos los campos que deseamos mostrar.
     
  3. Copiamos la plantilla "views-view-fields.html.twig" desde el módulo views y lo copiamos en las plantillas de nuestro tema personalizado
     
  4. Creamos la estructura con los divs donde queremos poner nuestra imagen de fondo
     
  5. Configuramos la vista para que muestre la URL de la imagen
     
  6. En el template o plantilla declaramos una variable con nuestro campo imagen y luego podremos imprimir nuestro background.
Código
{# 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>
Copiar

Snippet relacionados