[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"$fDLB9P7BFJebXBmiZoWM9BgA1nR_eCrMIfvGU93G5V4Q":3},{"slug":4,"display_name":4,"profile_url":5,"plugin_count":6,"total_installs":7,"avg_security_score":8,"avg_patch_time_days":9,"trust_score":10,"computed_at":11,"plugins":12},"stefanledin","https:\u002F\u002Fprofiles.wordpress.org\u002Fstefanledin\u002F",1,600,63,30,68,"2026-04-04T04:20:46.779Z",[13],{"slug":14,"name":15,"version":16,"author":4,"author_profile":5,"description":17,"short_description":18,"active_installs":7,"downloaded":19,"rating":20,"num_ratings":21,"last_updated":22,"tested_up_to":23,"requires_at_least":24,"requires_php":25,"tags":26,"homepage":32,"download_link":33,"security_score":8,"vuln_count":6,"unpatched_count":6,"last_vuln_date":34,"fetched_at":35},"responsify-wp","Responsify WP","1.9.11","\u003Cp>Responsify WP is the WordPress plugin that cares about responsive images.\u003C\u002Fp>\n\u003Ch3>Features\u003C\u002Fh3>\n\u003Cul>\n\u003Cli>Use \u003Ccode>img\u003C\u002Fcode> with srcset\u002Fsizes attributes.\u003C\u002Fli>\n\u003Cli>…or the \u003Ccode>picture\u003C\u002Fcode> element.\u003C\u002Fli>\n\u003Cli>Works with or without \u003Ca href=\"http:\u002F\u002Fscottjehl.github.io\u002Fpicturefill\u002F\" rel=\"nofollow ugc\">Picturefill\u003C\u002Fa>.\u003C\u002Fli>\n\u003Cli>Supports high resolution images (retina).\u003C\u002Fli>\n\u003Cli>Custom media queries.\u003C\u002Fli>\n\u003Cli>Handpick which image sizes to use.\u003C\u002Fli>\n\u003Cli>Responsive background images.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Ch3>\u003Ca href=\"https:\u002F\u002Fwww.youtube.com\u002Fwatch?v=3ThYWO6vHKI&spfreload=10\" rel=\"nofollow ugc\">Demo\u003C\u002Fa>\u003C\u002Fh3>\n\u003Cp>Responsify WP finds featured images and all images inside the content and makes them responsive.\u003Cbr \u002F>\nFor example, you might have a template that looks like this:\u003C\u002Fp>\n\u003Cpre>\u003Ccode>\u003Carticle>\n    \u003Ch1>\u003C?php the_title();?>\u003C\u002Fh1>\n    \u003C?php the_content();?>\n\u003C\u002Farticle>\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>That will output something like this:\u003C\u002Fp>\n\u003Cpre>\u003Ccode>\u003Carticle>\n    \u003Ch1>Hello world\u003C\u002Fh1>\n    \u003Cp>Lorem ipsum dolor sit amet...\u003C\u002Fp>\n    \u003Cimg src=\"large.jpg\" alt=\"Image description\">\n\u003C\u002Farticle>\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>But once you have activated the plugin, it will look like this instead:\u003C\u002Fp>\n\u003Cpre>\u003Ccode>\u003Carticle>\n    \u003Ch1>Hello world\u003C\u002Fh1>\n    \u003Cp>Lorem ipsum dolor sit amet...\u003C\u002Fp>\n    \u003Cimg sizes=\"(min-width: 300px) 1024px, (min-width: 150x) 300px, 150px\"\n        srcset=\"thumbnail.jpg 150w,\n        medium.jpg 300w,\n        large.jpg 1024w\"\n        alt=\"Image description\">\n\u003C\u002Farticle>\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>You can also choose to use the \u003Ccode>picture\u003C\u002Fcode> element instead:\u003C\u002Fp>\n\u003Cpre>\u003Ccode>\u003Carticle>\n    \u003Ch1>Hello world\u003C\u002Fh1>\n    \u003Cp>Lorem ipsum dolor sit amet...\u003C\u002Fp>\n    \u003Cpicture>\n        \u003Csource srcset=\"full-size.jpg\" media=\"(min-width: 1024px)\">\n        \u003Csource srcset=\"large.jpg\" media=\"(min-width: 300px)\">\n        \u003Csource srcset=\"medium.jpg\" media=\"(min-width: 150px)\">\n        \u003Cimg srcset=\"thumbnail.jpg\" alt=\"Image description\">\n    \u003C\u002Fpicture>\n\u003C\u002Farticle>\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>It also works with high resolution (retina) images:\u003C\u002Fp>\n\u003Cpre>\u003Ccode>\u003Carticle>\n    \u003Ch1>Hello world\u003C\u002Fh1>\n    \u003Cp>Lorem ipsum dolor sit amet...\u003C\u002Fp>\n    \u003Cpicture>\n        \u003Csource srcset=\"full-size.jpg\" media=\"(min-width: 1024px)\">\n        \u003Csource srcset=\"large.jpg, large_retina.jpg 2x\" media=\"(min-width: 300px)\">\n        \u003Csource srcset=\"medium.jpg, medium_retina.jpg 2x\" media=\"(min-width: 150px)\">\n        \u003Cimg srcset=\"thumbnail.jpg, thumbnail_retina.jpg 2x\" alt=\"Image description\">\n    \u003C\u002Fpicture>\n\u003C\u002Farticle>\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>The different versions of the image in the examples above is in the standard \u003Ccode>thumbnail\u003C\u002Fcode>, \u003Ccode>medium\u003C\u002Fcode>, \u003Ccode>large\u003C\u002Fcode> and \u003Ccode>full\u003C\u002Fcode> sizes.\u003Cbr \u002F>\nThe \u003Cstrong>media queries\u003C\u002Fstrong> are based on the width of the “previous” image.\u003Cbr \u002F>\nAny \u003Cstrong>custom sizes\u003C\u002Fstrong> of the image will also be found and used.\u003C\u002Fp>\n\u003Ch3>Settings\u003C\u002Fh3>\n\u003Cp>You can \u003Cstrong>select which image sizes\u003C\u002Fstrong> that the plugin should use from the RWP settings page.\u003Cbr \u002F>\nThese settings can be overwritten from your templates.\u003C\u002Fp>\n\u003Cpre>\u003Ccode>\u003C?php\n\n\u002F\u002F Using get_posts()\n$posts = get_posts( array(\n    'post_type' => 'portfolio',\n    'rwp_settings' => array(\n        'sizes' => array('large', 'full')\n    )\n) );\nforeach( $posts as $post ) {\n    \u002F\u002F ...\n}\n\n\u002F\u002F Using WP_Query()\n$query = new WP_Query( array(\n    'category_name' => 'wordpress',\n    'rwp_settings' => array(\n        'sizes' => array('large', 'full')\n    )\n) );\nif ( $query->have_posts() ) {\n    \u002F\u002F ...\n}\n?>\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>\u003Cstrong>Available settings:\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cul>\n\u003Cli>Select which image sizes to use.\u003C\u002Fli>\n\u003Cli>Set\u002Foverride attributes.\u003C\u002Fli>\n\u003Cli>Set custom media queries.\u003C\u002Fli>\n\u003Cli>Turn on\u002Foff retina.\u003C\u002Fli>\n\u003Cli>Ignore image formats.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Ch3>Functions\u003C\u002Fh3>\n\u003Cp>RWP provides a number of functions that can generate responsive images in your templates.\u003Cbr \u002F>\nLet’s say that you have the following markup for a very large header image:\u003C\u002Fp>\n\u003Cpre>\u003Ccode>\u003Cheader>\n    \u003C?php the_post_thumbnail( 'full' ); ?>\n\u003C\u002Fheader>\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>As you probably know, \u003Ccode>the_post_thumbnail()\u003C\u002Fcode> will create a regular \u003Ccode>\u003Cimg>\u003C\u002Fcode> tag with the full-size image in this case.\u003Cbr \u002F>\nBut you don’t want to send a big 1440px image to a mobile device. This can easily be solved like this:\u003C\u002Fp>\n\u003Cpre>\u003Ccode>\u003Cheader>\n    \u003C?php\n    $thumbnail_id = get_post_thumbnail_id( $post->ID );\n\n    \u002F\u002F Generate an \u003Cimg> tag with srcset\u002Fsizes attributes.\n    echo rwp_img( $thumbnail_id );\n\n    \u002F\u002F Generate a \u003Cpicture> element\n    echo rwp_picture( $thumbnail_id );\n    ?>\n\u003C\u002Fheader>\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Ch3>Website\u003C\u002Fh3>\n\u003Cp>\u003Ca href=\"http:\u002F\u002Fresponsifywp.com\" rel=\"nofollow ugc\">http:\u002F\u002Fresponsifywp.com\u003C\u002Fa>.\u003C\u002Fp>\n\u003Ch3>Demo\u003C\u002Fh3>\n\u003Cp>\u003Ca href=\"http:\u002F\u002Fresponsifywp.com\u002Fdemo\" rel=\"nofollow ugc\">http:\u002F\u002Fresponsifywp.com\u002Fdemo\u003C\u002Fa>.\u003C\u002Fp>\n\u003Ch3>Documentation and examples\u003C\u002Fh3>\n\u003Cp>\u003Ca href=\"https:\u002F\u002Fgithub.com\u002Fstefanledin\u002Fresponsify-wp\" rel=\"nofollow ugc\">https:\u002F\u002Fgithub.com\u002Fstefanledin\u002Fresponsify-wp\u003C\u002Fa>.\u003C\u002Fp>\n\u003Ch3>Requirements\u003C\u002Fh3>\n\u003Cul>\n\u003Cli>PHP 5.3\u003C\u002Fli>\n\u003C\u002Ful>\n","Responsive images. Plug and play.",45088,100,18,"2018-06-07T06:21:00.000Z","4.9.29","3.8.1","",[27,28,29,30,31],"picture","picture-element","responsive-images","sizes","srcset","https:\u002F\u002Fgithub.com\u002Fstefanledin\u002Fresponsify-wp","https:\u002F\u002Fdownloads.wordpress.org\u002Fplugin\u002Fresponsify-wp.1.9.11.zip","2025-06-05 00:00:00","2026-03-15T15:16:48.613Z"]