[Resolved] Using SEARCH Child theme and cannot swap out the top image

Home Forums Support Using SEARCH Child theme and cannot swap out the top image

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #1668151
    Janet Davis

    Hello,

    I am using the Search child theme built into GP.
    The top image on the site of a female looking at a piece of paper – I am trying to swap this image out. I am not sure if it is size etc.

    I created a replacement image that is saved as an SVG file at 9kb and as a PNG.
    When I change the image to the svg no image appears. I can put the PNG file into it.

    ANy idea why I can’t put the SVG file in.

    Thank you
    Janet

    #1668207
    Ying
    Staff
    Customer Support

    Hi Janet,

    You’ll need an SVG support plugin in order to upload to WP.

    This article should be helpful.
    https://www.wpbeginner.com/wp-tutorials/how-to-add-svg-in-wordpress/

    #1668254
    Janet Davis

    The original image from downloading the theme was an SVG. Why would I need a plugin when I’m using a different file but still svg?

    #1668283
    Ying
    Staff
    Customer Support

    Once the SVG is uploaded, you won’t need the svg plugin to be activated anymore, that’s why you are able to use the SVGs which are already in the media library even without plugins.

    But to upload new SVG, yes, you need plugin to do so.

    #1668315
    Janet Davis

    I’m not having issues adding the svg to the site. I did add the plugin and there wasn’t any difference in up loading. The issue is the picture. On the homepage the only SVG that will load is the original and only if I use undo, not if I add a new block and try to mimic the child theme block.

    And when I do get a svg file to switch out as it is on the about page the full image doesn’t show.

    Thank you again.

    #1668325
    Ying
    Staff
    Customer Support

    Sorry I misunderstood your question, have you tried adjust the image size in the block meta box when you switch or add an svg? Let me know 🙂
    https://www.screencast.com/t/my5uAzT6AUE0

    #1668495
    Janet Davis

    This only works on images that are set as images, not ones that are background.
    I did a replacement on the homepage, but not on any other devices. I’ve played with the sizing under background. Background for the tablet, and phone. But they still don’t show the entire image.

    The home page and the about page are both images I just replaced and then have the issue.

    Thank you

    #1668597
    Elvin
    Staff
    Customer Support

    Hi there,

    The image isn’t “showing” because the SVG’s fill colors are all #fff with opacity set. #fff is the hex code of white.

    And since its section’s background is almost white, it basically almost blends in, making it barely visible.

    If you change the background-color value, the background image will be more pronounced as shown here: https://share.getcloudapp.com/WnuB72Ze

    A wise man once said:
    "Have you cleared your cache?"

    #1669099
    Janet Davis

    The main image on the homepage on the desktop and some larger laptops is fine. It doesn’t show up at all on the ipad and the phone. I played with the minimum height for the tablet and now the image shows on the tablet and iPhone. However, it doesn’t show the full picture on the iPad and it’s too large.

    I’m looking for some kid of CSS to put into the site so that the image on the iPad is smaller but complete.

    The image on the About page I ended up doing differently and got it to work. The home page image I don’t want side by side like the about page on the iPad.

    Thank you

    #1669455
    Ying
    Staff
    Customer Support

    If you use SVG as background image and you don’t want it to be cut off in smaller screen, you can try:

    1. set the Size to Contain which was Cover by default.
    https://www.screencast.com/t/ozCSm6ZNt5B

    2. After step 1, you could try to reduce the top/bottom padding of the container under laptop view, so the entire container shrinks, the image should get smaller too.

    #1669613
    Janet Davis

    The size to container worked like a charm.
    Thank you so much!

    #1669667
    Ying
    Staff
    Customer Support

    You are welcome 🙂

Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.