Support » Theme: Goran » Display Featured image 100% on mobile

  • Resolved ESSBEEAY

    (@essbeeay)


    Hi,

    I’m making tweaks to a site I built with Goran last year. It works great and the client is very happy.

    However, I want to be able to insert a featured image on the homepage (Grid Page Template) and hide the Page-Title, but still have the image display fully even on a mobile and other screen sizes.

    By default, Goran will display only as much featured image as is required by the length of the Page-Title. I need to put in a GIF as a featured image, with text already in the GIF. To make it readable I can hide the Page-Title, but need the entire image to display on mobile. On desktop it displays full-size already.

    My homepage is:
    http://scottysconstruction.co.nz/

    Thanks for any help,
    Scott

Viewing 5 replies - 1 through 5 (of 5 total)
  • Hi Scott,

    Try adding this to your site via Customize > Additional CSS:

    .home .hero .page-title {
      visibility: hidden;
    }

    That will hide the page title while keeping the space that the title occupies.

    Let me know if that helps.

    Thanks David,

    I tried your code snippet, and it works perfectly, but only on full media screen. How can I apply it to affect all screen sizes?

    Thanks,
    Scott

    I’m not able to replicate this. When I try on a fresh installation, the page title is hidden on all screen sizes.

    Could you link to a screenshot of what the mobile view looks like for you?

    Here’s how it looks for me:

    Hi again,
    I had added the code to custom CSS on the page only when I had the problem with mobile view. Adding it to site-wide custom CSS has rectified the issue and the title remains invisible on all screen sizes. So I’m all sorted.
    Thanks again for your help!
    Scott

    Ok great! 🙂 Glad I could help.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Display Featured image 100% on mobile’ is closed to new replies.