Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #799952

    I tried inserting my own image in the header section background. The default image is Medium – 300 x 200. Which is the same size as the image I purchased from Shutterstock. Once I inserted my new image. It was blurry. So I decided to put the default image back in it’s place, and then that image came up blurry as well. Is there something I’m doing wrong? Or an easy fix?

    #799960

    Hey raymondshamoon,

    Try running the thumbnail regeneration plugin to see if that fixes the issue:

    https://wordpress.org/plugins/regenerate-thumbnails/

    Best regards,
    Jordan Shannon

    #799962

    Hey Jordan, thanks for the quick reply. I installed and ran the plugin. Some images were resized. However it did not fix the issue. What’s weird is the original default image was not edited or altered in any way. I simply switched it out for another image with the same dimensions. When it came out blurry. I decided to just replace the image back with the default image, and that also became blurry. So I’m not sure what’s going on?

    #800003

    Hi,

    When you select the image from the Media Library, then you will get an option on the right hand side to select the resolution of the image, could you make sure that it’s large enough to look sharp there please?

    Best regards,
    Rikard

    #800016

    Hey Rikard, thanks for replying. Before I made a change I took a screen shot of the image that was defaulted, with it’s defaulted settings. So when I switched to my image (that had the same dimensions) it went blurry. So I switched it back to the default image, making sure the settings on the right were the same, and they are. However the default image is blurry too now. Not sure what’s going on.

    Ray

    #800260

    Hi,

    Can you attempt to use an image with larger dimensions, say 1200 x 600? This is just to see if this one will appear clear.

    Best regards,
    Jordan Shannon

    #801847

    Yes, I was able to figure it out. Turns out the photos that show on the default page are not showing the default size. You have to click through each size to find out which one is the best size for that specific area. However the next issue I’m having is that the image in the header and the image half way down on the page are stretched out on the mobile.The slider images look perfect. How do I fix that?

    #802069

    Hi,

    That image may be too large to scale attractively on mobile. What you could do is create a separate slider that shows only on mobile with the images scaled and sized to fit better on a mobile device.

    Best regards,
    Jordan Shannon

    #802284

    Awesome. Thank you for the reply. I’m just not sure how to hide sliders from mobile or vice versa?

    #802346

    Hi,

    Just add the following custom CSS code:

     @media only screen and (max-width: 500px) {
         #av_section_1 {
          display: none !important;
         }
    }
    

    Best regards,
    John Torvik

    #802358

    Hi John, I’ve copied and pasted that code inside of the Enfold options under “General Styling” is that where it goes? Is that fixing the issue with the mobile images? They still look stretched? What am I doing wrong?

    #802568

    Hi,

    What you want to do is create two headers. One which is focused on mobile and one which is for desktop. So what you would want to do for desktop is this:

     @media only screen and (max-width: 767px) {
         #av_section_1 {
          display: none !important;
         }
    }

    The mobile section you create should have its own id so for for mobile do this:

     @media only screen and (min-width: 767px) {
         #av_section_2 {
          display: none !important;
         }
    }

    Best regards,
    Jordan Shannon

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