[Resolved] WP Show Post Show title over image

Home Forums Support WP Show Post Show title over image

  • This topic has 7 replies, 3 voices, and was last updated 5 months ago by David.
Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1241207
    Javier

    Hello, on my home page I show the articles of different categories with wp show post. I would like some of them to show the title on the image, however I have only managed it in one of them.

    I have copied all the settings, but I don’t know how to make the title show with the background image.

    + Moda is correct, it shows the title on the image.

    Nevertheless, Zara displays the title below the image.

    How could the first configuration, that of + Moda, replicate?

    Thanks

    #1242211
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    It looks like the Moda one is using the Cards feature, where the other one isn’t. Can you check the Cards section of the settings?

    #1242477
    Javier

    Thanks for your help, but I can’t find the Cards feature option.

    By default, my GeneratePress theme (Dispatch) has different views configured for WP Show Post.

    For example, this also happens with sidebar. Sidebar displays the captions above the images and with an effect on the image when you hover your mouse, while Simple Sidebar does not.

    How could I replicate this in my wp show post lists?

    Is there a manual where this is explained in detail?

    Thank you

    #1242666
    David
    Staff
    Customer Support

    Hi there,

    to apply the card style in Dispatch you need to wrap this around your shortcode:

    <div class="wpsp-card">
    
    Your Shortcode goes here
    
    </div>

    The Dispatch Sites blog provides posts on how to use the Site:

    https://gpsites.co/dispatch/blog/

    #1246425
    Javier

    Hello, I have tried what you tell me but the CSS style does not apply. Also, on the home page you can see the div code.

    I leave it active so you can review it:

    Massimo Dutti

    Regalo día de la madre
    Ideas de regalo para el día de la madre, colección Massimo Dutti mujer primavera 2020
    Massimo Dutti 2019
    Novedades Massimo Dutti mujer otoño 2019, las tendencias de la temporada

    This is the code inserted in my home page with gutenberg:

    <h2>Estilo de Vida</h2>
    <p>[wp_show_posts name="Estilo"]<!-- using the Standard List --></p>
    <hr />
    <h2>Celebs</h2>
    <div class="wpsp-align">[wp_show_posts name="Celebrities"]</div>
    <p><!-- Using the Align List --></p>
    <hr />
    <h2>+ Moda</h2>
    <div class="wpsp-card">[wp_show_posts name="Moda"]</div>
    <p><!-- Using the Simple List --></p>
    
    <!-- wp:heading -->
    <h2><a href="https://www.modalia.es/moda/zara/">Zara</a></h2>
    <!-- /wp:heading -->
    
    <!-- wp:paragraph -->
    <p> [wp_show_posts name="Zara"] </p>
    <!-- /wp:paragraph -->
    
    <!-- wp:heading -->
    <h2><a href="https://www.modalia.es/el-corte-ingles/">El Corte Inglés</a></h2>
    <!-- /wp:heading -->
    
    <!-- wp:paragraph -->
    <p> [wp_show_posts name="Corte_Ingles"] </p>
    <!-- /wp:paragraph -->
    
    <!-- wp:heading -->
    <h2><a href="https://www.modalia.es/moda/massimo-dutti/">Massimo Dutti</a></h2>
    <!-- /wp:heading -->
    
    <!-- wp:paragraph -->
    <p><div class="wpsp-card"> [wp_show_posts name="Massimo_Dutti"] </div></p>
    <!-- /wp:paragraph -->
    
    <!-- wp:paragraph -->
    <p></p>
    <!-- /wp:paragraph -->
    
    <!-- wp:heading -->
    <h2>Modalia.es, mucho más que moda</h2>
    <!-- /wp:heading -->
    
    <!-- wp:paragraph -->
    <p>Modalia.es es una revista de moda creada en 2008 con el objetivo de informar sobre el sector de la moda, desde el diseñador hasta el cliente final. <a href="https://www.modalia.es/negocios/ferias/">Ferias</a>, <a href="https://www.modalia.es/disenadores/pasarelas/">pasarelas</a>, <a href="https://www.modalia.es/directorio/agenciademodelos/">agencias de modelos</a>, las novedades de las marcas, aperturas de nuevas tiendas y, sobretodo, las nuevas tendencias. Lo que se lleva y lo que se va a llevar en el cambiante mundo de la moda. </p>
    <!-- /wp:paragraph -->
    
    <!-- wp:core-embed/youtube {"url":"https://www.youtube.com/watch?time_continue=4\u0026v=ELNjV0RK52s","type":"video","providerNameSlug":"youtube","className":"wp-embed-aspect-16-9 wp-has-aspect-ratio"} -->
    <figure class="wp-block-embed-youtube wp-block-embed is-type-video is-provider-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
    
    </div></figure>
    <!-- /wp:core-embed/youtube -->
    
    <!-- wp:heading {"level":3} -->
    <h3>Nueva colección 2020</h3>
    <!-- /wp:heading -->
    
    <!-- wp:paragraph -->
    <p><a href="https://www.modalia.es/moda/ham/">H&M</a> / <a href="https://www.modalia.es/moda/mango/">Mango</a> /  <a href="https://www.modalia.es/moda/bershka/">Bershka</a> / <a href="https://www.modalia.es/moda/el-corte-ingles/gloria-ortiz/">Gloria Ortiz</a> / <a href="https://www.modalia.es/moda/massimo-dutti/">Massimo Dutti</a> / <a href="https://www.modalia.es/moda/primark/">Primark</a> / <a href="https://www.modalia.es/moda/oysho/">Oysho</a> /  <a href="https://www.modalia.es/moda/pull-and-bear/">Pull & Bear </a></p>
    <!-- /wp:paragraph -->
    
    <!-- wp:separator -->
    <hr class="wp-block-separator"/>
    <!-- /wp:separator -->
    
    <!-- wp:paragraph -->
    <p>Pero además de la moda, también nos interesan los viajes y la gastronomía, nuestro <a href="https://www.modalia.es/estilo-de-vida/">estilo de vida</a> y la <a href="https://www.modalia.es/belleza/">belleza</a> con los últimos tratamientos, muy atentos siempre a los tratamientos naturales y ecológicos, porque nos preocupa el medio ambiente y creemos en la moda sostenible. </p>
    <!-- /wp:paragraph -->
    
    <!-- wp:paragraph -->
    <p>[wp_show_posts name="Belleza"]</p>
    <!-- /wp:paragraph -->
    
    <!-- wp:paragraph -->
    <p>Y además:</p>
    <!-- /wp:paragraph -->
    
    <!-- wp:paragraph -->
    <p>[wp_show_posts name="Home_Footer"]</p>
    <!-- /wp:paragraph -->
    #1246446
    David
    Staff
    Customer Support

    Within the editor You need to Edit as HTML

    #1247525
    Javier

    Hello, the solution to show the style has been to insert the code with gutemberg, but in an html box:

    <!-- wp:html -->
    <div class="wpsp-card"> [wp_show_posts name="Home_Footer"] </div>
    <!-- /wp:html -->

    Thank you

    #1247685
    David
    Staff
    Customer Support
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.