{"id":23125,"date":"2013-04-25T18:38:31","date_gmt":"2013-04-25T18:38:31","guid":{"rendered":"https:\/\/wordpress.org\/plugins-wp\/image-placeholder\/"},"modified":"2013-04-25T18:38:31","modified_gmt":"2013-04-25T18:38:31","slug":"image-placeholder","status":"publish","type":"plugin","link":"https:\/\/wordpress.org\/plugins\/image-placeholder\/","author":4334584,"comment_status":"closed","ping_status":"closed","template":"","meta":{"version":"1.0","stable_tag":"trunk","tested":"3.5.2","requires":"3.3","requires_php":"","requires_plugins":"","header_name":"Image Placeholder","header_author":"Del Putnam","header_description":"","assets_banners_color":"","last_updated":"2013-04-25 18:38:31","external_support_url":"","external_repository_url":"","donate_link":"","header_plugin_uri":"http:\/\/www.delputnam.com","header_author_uri":"http:\/\/www.delputnam.com","rating":4,"author_block_rating":0,"active_installs":10,"downloads":2362,"num_ratings":1,"support_threads":0,"support_threads_resolved":0,"author_block_count":0,"sections":["description","installation","faq"],"tags":[],"upgrade_notice":[],"ratings":{"1":0,"2":0,"3":0,"4":"1","5":0},"assets_icons":[],"assets_banners":[],"assets_blueprints":{},"all_blocks":[],"tagged_versions":[],"block_files":[],"assets_screenshots":[],"screenshots":[]},"plugin_section":[],"plugin_tags":[35997],"plugin_category":[],"plugin_contributors":[90490],"plugin_business_model":[],"class_list":["post-23125","plugin","type-plugin","status-publish","hentry","plugin_tags-image-placeholder","plugin_contributors-delputnam","plugin_committers-delputnam"],"banners":[],"icons":{"svg":false,"icon":"https:\/\/s.w.org\/plugins\/geopattern-icon\/image-placeholder.svg","icon_2x":false,"generated":true},"screenshots":[],"raw_content":"<!--section=description-->\n<h4>Using the Shortcode<\/h4>\n\n<p>Using the short code <code>[image-placeholder]<\/code> without any of the optional attributes will generate a 300px wide by 200px high image using Holder's 'social' theme which defaults to a solid blue background with white text showing the size of the image ('300x200').<\/p>\n\n<h4>Set the width and height<\/h4>\n\n<p>You can set the width and height (in pixels) of your placeholder image:<\/p>\n\n<pre><code>[image-placeholder width=\"500\" height=\"100\"]\n<\/code><\/pre>\n\n<h4>Change the colors<\/h4>\n\n<p>You can change the background and text colors:<\/p>\n\n<pre><code>[image-placeholder colors=\"#000:#fff\"]\n<\/code><\/pre>\n\n<p>This will create an image with a black background and white text.<\/p>\n\n<h4>Change the text<\/h4>\n\n<p>By default holder.js uses the size of the image for the text.  You can change this:<\/p>\n\n<pre><code>[image-placeholder text=\"Foo bar\"]\n<\/code><\/pre>\n\n<h4>Remove the height and width styles<\/h4>\n\n<p>By default, holder.js will add inline styles to specify the height and width of the image.  You can remove these:<\/p>\n\n<pre><code>[image-placeholder auto=\"true\"]\n<\/code><\/pre>\n\n<h4>Only return the URL<\/h4>\n\n<p>If you want to use the placeholder in your own <code>&lt;img&gt;<\/code> tag or as a background style, for example:<\/p>\n\n<pre><code>[image-placeholder url=\"true\"]\n<\/code><\/pre>\n\n<h4>Add a class<\/h4>\n\n<p>If you want to add a class to the <code>&lt;img&gt;<\/code> tag that it generated:<\/p>\n\n<pre><code>[image-placeholder class=\"my-class\"]\n<\/code><\/pre>\n\n<h4>Change the theme<\/h4>\n\n<p>Holder currently provides three built-in themes: <code>gray<\/code>, <code>industrial<\/code>, and <code>social<\/code>.  You can use these in the short code like this:<\/p>\n\n<pre><code>[image-placeholder theme=\"industrial\"]\n<\/code><\/pre>\n\n<p>You can also create your own theme.  Each theme defines the foreground color, the background color, the font size and the font family. The easiest approach is to simply include a script tag:<\/p>\n\n<pre><code>&lt;script&gt;Holder.add_theme(\"my-theme\", { background: \"#000\", foreground: \"#fff\", size: 14 })&lt;\/script&gt;\n<\/code><\/pre>\n\n<p>There are a lot of <a href=\"https:\/\/github.com\/imsky\/holder\/blob\/master\/README.md#customizing-themes\">other options for customizing themes<\/a>.<\/p>\n\n<h3>Credits<\/h3>\n\n<p>This plugin is merely a WordPress shortcode wrapper for the holder.js library built by <a href=\"http:\/\/imsky.co\">Ivan Malopinsky<\/a>.<\/p>\n\n<!--section=installation-->\n<ol>\n<li>Create a directory called <code>image-placeholder<\/code> in the <code>\/wp-content\/plugins\/<\/code> directory.<\/li>\n<li>Upload <code>image-placeholder.php<\/code> to the <code>\/wp-content\/plugins\/image-pladeholder<\/code> directory.<\/li>\n<li>Upload <code>holder.js<\/code> to the <code>\/wp-content\/plugins\/image-pladeholder\\js<\/code> subdirectory.<\/li>\n<li>Activate the plugin through the 'Plugins' menu in WordPress.<\/li>\n<li>Use the <code>[image-placeholder]<\/code> shortcode in your pages or posts.<\/li>\n<\/ol>\n\n<!--section=faq-->\n<dl>\n<dt>What is this plugin good for?<\/dt>\n<dd><p>I use it when I'm developing a new site or page that I don't yet have actual images for.<\/p><\/dd>\n<dt>Can you add a feature?<\/dt>\n<dd><p>Maybe.  Create a new issue on <a href=\"https:\/\/github.com\/delputnam\/image-placeholder\/issues\">Github<\/a> and I'll take a look at it.<\/p>\n\n<p>You can also feel free to download the code and modify it yourself.<\/p><\/dd>\n\n<\/dl>","raw_excerpt":"Using the Shortcode","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/23125","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=23125"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/delputnam"}],"wp:attachment":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=23125"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=23125"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=23125"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=23125"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=23125"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=23125"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}