Navigation
Archive / Responsive design on images – Doesn´t work at all!
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • April 28, 2016 at 8:49 am #904127
    Sandie
    Participant

    Hi!

    I have put hours and days into figuring out what to do with my images on my website to get it responsive. I though when I bought the X theme that this would just work. But as I understand it now I need to upload several different sizes of the same image for it to be responsive and look good on all different devices, from big screens down to cellphones.

    Is there any other way? And HOW do I do that in the easiest way?

    When I look at SquareSpace they make the image in several different formats ones you upload it, and they tell you to upload it with a 1500px width. Thats all and then it works perfectly.

    So please let me know what I can do to get my images responsive. As for now they look shit on all other devices except the laptop I am using.

    Helpful would also be to get all the sizes I need to upload one image in for it to look good on all devices, this will be very time consuming. Its either that or I will have to go with an other theme that actually has responsive design on the images as well. But I like X theme so I really hope you can help me out on this one.

    Thanks!

    Regards
    /Sandra

    April 28, 2016 at 8:50 am #904130
    Sandie
    Participant

    My website is

    http://jon-aslund.com

    //Sandra

    April 28, 2016 at 8:42 pm #905016
    John Ezra
    Member

    Hi Sandra,

    Thanks for writing in! Which WordPress version are you on? Responsive images should be default as of WordPress version 4.4.

    Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

    – Link to your site
    – WordPress Admin username / password
    – FTP credentials

    Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

    May 2, 2016 at 2:04 am #908658
    Sandie
    Participant
    This reply has been marked as private.
    May 2, 2016 at 3:38 am #908744
    Lely
    Moderator

    Hello Sandra,

    I’ve check one page and the images are responsive. See this video screen-cast:http://screencast-o-matic.com/watch/cDhnj3179W and the following screenshots from mobile phone.


    Please clarify the issue and then give us the exact URL to help you better.

    Always,
    X

    May 2, 2016 at 8:03 am #909012
    Sandie
    Participant

    Hi,

    Yes that page looks fine, but if you check the HOME page at http://jon-aslund.com you will see that the images are not responsive.

    Thanks!

    /Sandra

    May 2, 2016 at 10:32 am #909240
    Christian
    Moderator

    Hey Sandra,

    I think you’re referring to the section’s background image? If so, the background image is set to cover the section while taking into account its aspect ratio. That means, if you’re on a mobile device – portrait orientation, part of the image will be cut off because the background image is in landscape orientation and is set to cover the portrait oriented screen. That is by design as image background should be used for decoration only. If you have important information in your image, it would be best to use the Image Element. Then, set your Row to have Marginless Column and disable Column Container. Then, add width:100% to the Style field of your image so it will span fullwidth. Please see this quick screencast for video instruction https://cloudup.com/cJXeYi_Jy4N (play in Firefox).

    http://i.imgur.com/7QS97gU.gifv

    Hope that clarifies.

    Thanks.

  • Author
    Posts
  • <script> jQuery(function($){ $("#no-reply-904127 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>