Responsive Example
-
Hi Alex, so i’ve tried to follow the github documentation but it’s not that easy for a beginner! I was hoping you could lend a hand? ??
I tried this sample code just to test it out so it would resize images for tablet devices, but when i used the code below it crashed my site and gave a 500 error:
note: this was just a test for tablet sizes:
add_filter('rwd_image_sizes', 'TABLET-510'); function my_rwd_image_sizes( $image_sizes ) { $my_image_sizes = array( visual ); return $my_image_sizes; } return array( 'visual' => array( array( array( 1920, 500, true ), // responsive options: ... ), 'TABLET-510' => array( array( 510, 9999 ), 'picture' => '<source srcset="{src}" media="(min-width: 600px)">', ), 'mobile' => array( array( 414, 200, true ), // responsive options: ... ), ), );
Can you tell me what i have done wrong?
I have created the following sizes in my functions.php
add_image_size( 'TABLET-350', 350, 9999 ); add_image_size( 'TABLET-510', 510, 9999 ); add_image_size( 'TABLET-933', 933, 9999 );
I would like to display a regular full sized image for (min-width: 1024px), to display TABLET-933 for (min-width: 600px), and to display TABLET-350 for (min-width: 320px).
How can i achieve this using your plugin to output a picture element? With the correct functions filter for these sizes?
I had been using another plugin to do this previously, but discovered it prevents images from lazy loading.
Do you know if there is an issue when using the picture element and lazy loading?
Thanks
- The topic ‘Responsive Example’ is closed to new replies.