scriptsdev

PlaceGen

Generate image placeholders from ZIP uploads while preserving folder structure, filenames, and image dimensions.

DelPutnam

<h4>Using the Shortcode</h4>
<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 (‘300×200’).</p>
<h4>Set the width and height</h4>
<p>You can set the width and height (in pixels) of your placeholder image:</p>
<pre><code>[image-placeholder width="500" height="100"]
</code></pre>
<h4>Change the colors</h4>
<p>You can change the background and text colors:</p>
<pre><code>[image-placeholder colors="#000:#fff"]
</code></pre>
<p>This will create an image with a black background and white text.</p>
<h4>Change the text</h4>
<p>By default holder.js uses the size of the image for the text.  You can change this:</p>
<pre><code>[image-placeholder text="Foo bar"]
</code></pre>
<h4>Remove the height and width styles</h4>
<p>By default, holder.js will add inline styles to specify the height and width of the image.  You can remove these:</p>
<pre><code>[image-placeholder auto="true"]
</code></pre>
<h4>Only return the URL</h4>
<p>If you want to use the placeholder in your own <code><img></code> tag or as a background style, for example:</p>
<pre><code>[image-placeholder url="true"]
</code></pre>
<h4>Add a class</h4>
<p>If you want to add a class to the <code><img></code> tag that it generated:</p>
<pre><code>[image-placeholder class="my-class"]
</code></pre>
<h4>Change the theme</h4>
<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>
<pre><code>[image-placeholder theme="industrial"]
</code></pre>
<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>
<pre><code><script>Holder.add_theme("my-theme", { background: "#000", foreground: "#fff", size: 14 })</script>
</code></pre>
<p>There are a lot of <a href="https://github.com/imsky/holder/blob/master/README.md#customizing-themes" rel="nofollow ugc">other options for customizing themes</a>.</p>
<h3>Credits</h3>
<p>This plugin is merely a WordPress shortcode wrapper for the holder.js library built by <a href="http://imsky.co" rel="nofollow ugc">Ivan Malopinsky</a>.</p>


Alternatives to Image Placeholder

Top alternatives