How to make images responsive to screen size in posts

Is there a simple way so that the post's featured image is automatically downloaded by a small version on the image when on a small screen?

Comments

  • Hi,
    they are selected from the wordpress default image set and after that resized with css.
    thanks
  • I am happy that there is a solution using CSS but could you please detail the CSS that we need to include and where in BeTheme.

    Thanks
  • You would have to attach a link to this page and make a screenshot explaining what exactly you want to achieve.
  • Sorry some time in responding but I really wanted to verify which files were being downloaded onto a small screen size before bothering you further.

    When we access our news page www.aurora.nl/news from a mobile phone then the images that are downloaded are of size 960-750 px.  The news pages is simply built from the WP Posts and the images are the Featured Images.
    In BeTheme Options, Blog, Portfolio & Shop > Featured Image > the Width and height have default values of 960 and 750.
    Is there a way to have smaller values here just for mobile devices via custom CSS and if so which code should we introduce?

    Thanks
  • Here is a standard featured image replay, but it will answer your questions:


    There are many types of featured images in the theme, here are instructions for changing them:
    1. To change the size of the images used in portfolio/blog/shop, please navigate to theme options>blog,portfolio&shop>featured image.
    2. To change the size of the default WordPress gallery images, please go to settings>media.
    3. To change the woocommerce images size please go to woocommerce>settings>products>display.

    Notice!
    Remember to use thumbnail regeneration after you make your changes. Otherwise, the images will not change their size.


    thanks
  • Unfortunately this is not the answer to the question.

    In the Media settings the Medium Size is 300, 300.

    How can we configure the site so that on a small display. eg. mobile phone, that the site provides the medium 300, 300 image rather than the larger one?  However, it should provide the larger image on a normal display.
  • This is how wordpress works, we cannot really change that.
Sign In or Register to comment.
This website uses cookies

We use cookies to personalise content and ads, to provide social media features and to analyse our traffic. We also share information about your use of our site with our social media, advertising and analytics partners who may combine it with other information that you’ve provided to them or that they’ve collected from your use of their services.

Cookies are small text files that can be used by websites to make a user's experience more efficient.

The law states that we can store cookies on your device if they are strictly necessary for the operation of this site. For all other types of cookies we need your permission. This means that cookies which are categorized as necessary, are processed based on GDPR Art. 6 (1) (f). All other cookies, meaning those from the categories preferences and marketing, are processed based on GDPR Art. 6 (1) (a) GDPR.

This site uses different types of cookies. Some cookies are placed by third party services that appear on our pages.

You can at any time change or withdraw your consent from the Cookie Declaration on our website.

Learn more about who we are, how you can contact us and how we process personal data in our Privacy Policy.

Please state your consent ID and date when you contact us regarding your consent.