lorenzck

<p>The usual way to include images in WordPress posts is to generate static anchor and <code><img></code> tags through the content editor interface. Similarly, links to other posts or pages of your blog are also generated as absolute <code><a></code> tags by the content editor.<br />
These kind of fixed links make your WordPress site hard to migrate and make it especially hard to automatically change your output markup (for instance if you decide to change the image size or change a post’s title).</p>
<p>No longer.<br />
With this plug-in, you can use the simple <code>[image]</code>, <code>[link]</code>, and <code>[page]</code> shortcodes in any of your posts.</p>
<h4>Image shortcode</h4>
<p>Images are referenced by their ID, for instance:</p>
<pre><code>[image id="123"]
</code></pre>
<p>This <em>shortcode</em> will generate the following HTML structure:</p>
<pre><code><div class="picture wp-image-123 size-medium">
  <img src="path-to-123-medium.jpg" srcset="…" />
</div>
</code></pre>
<p>Images default to their <code>medium</code> size, if none is set.<br />
You may easily add HTML classes or didascalies:</p>
<pre><code>[image id="123" didascaly="Nice picture." class="aligncenter"]
</code></pre>
<p>This generates the following HTML block, which can be easily styled with some custom CSS:</p>
<pre><code><div class="picture wp-image-123 size-medium aligncenter">
  <img src="path-to-123-medium.jpg" srcset="…" />
  <div class="didascaly">Nice picture.</div>
</div>
</code></pre>
<p>The <code>[image]</code> <em>shortcode</em> supports the following parameters:</p>
<ul>
<li><code>id</code>: the WordPress ID of the attachment to include;</li>
<li><code>size</code>: size of the image to include (can be any standard size such as <code>thumbnail</code>, <code>medium</code>, <code>full</code>, or any custom image size);</li>
<li><code>alt</code>: alternate description to include in the <code><img></code> tag;</li>
<li><code>title</code>: image title to use in (optional) link;</li>
<li><code>link</code>: if set to <code>true</code>, <code>1</code>, <code>yes</code>, or an equivalent value, a link to the full-resolution attachment will be generated, otherwise a fully specified target URL can be specified;</li>
<li><code>didascaly</code>: text to add as a didascaly;</li>
<li><code>class</code>: additional HTML/CSS classes to add to the root element.</li>
<li><code>atts</code>: additional HTML attributes to add to the wrapping <code><div></code> tag.</li>
<li><code>imgatts</code>: additional HTML attributes to add to the internal <code><img></code> tag of the image.</li>
</ul>
<h4>Page and link shortcodes</h4>
<p>This couple of <em>shortcodes</em> automatically generate hypertext links to pages or posts of your WordPress installation. Target posts can be referenced by ID, by <em>slug</em>, or by <em>path</em> (a post’s URL, relative to the website’s root).</p>
<p>Thus, <code>[link href="123"]…[/link]</code>, <code>[link href="slug-of-post"]…[/link]</code>, and <code>[link href="root-page/sub-page/slug-of-page"]…[/link]</code> are all equivalent.</p>
<p>These <em>shortcodes</em> are “enclosing” (they wrap the content of the link, just like HTML tags) and they support the following parameters:</p>
<ul>
<li><code>href</code>: the ID, <em>slug</em>, or <em>path</em> of the target post or page;</li>
<li><code>title</code>: the title to use in the link, if not set the target post’s title will be used;</li>
<li><code>class</code>: additional HTML/CSS classes to add to the link;</li>
<li><code>type</code>: type of the target post (defaults to “page” for <code>[page]</code> and “post” for <code>[link]</code>).</li>
</ul>
<p>If no link content to be enclosed is provided, the posts’s title is automatically used as link text.</p>


Simple Stupid Shortcode

The simplest and most flexible way to embed images or put internal links in Wordpress. Shortcodes to finally ditch all absolute paths and fixed sizes.

malcalevak

<p>A WordPress implementation of the stellar Slimbox2 script by Christophe Beyls (an enhanced clone of the Lightbox script) which utilizes the jQuery library to create an impressive image overlay with slide-out effects.</p>
<p>Almost, if not all, options are configurable from the administration panel. For more on the settings and what they do check out the <a href="http://www.digitalia.be/software/slimbox2/" title="Slimbox 2, the ultimate lightweight Lightbox clone for jQuery" rel="nofollow ugc">Slimbox2</a> page.</p>
<p>Support forums are generously hosted by Ryan Hellyer of PixoPoint, <a href="http://pixopoint.com/forum/index.php?board=6.0" rel="nofollow ugc">here</a>.</p>
<p>Recent Changes in v1.1.3.1:<br />
1.  Changed index.php to UTF-8 without BOM encoding to resolve issues for some users.<br />
Recent Changes in v1.1.3:<br />
1.  Updated to Slimbox 2.05 to support WordPress 3.6<br />
2.  Removed unnecessary xfarbtastic.css</p>
<h3>Credits</h3>
<p>Thanks to the following for help with the development of this plugin:</p>
<ul>
<li><a href="http://www.digitalia.be/software/slimbox2" rel="nofollow ugc">Christophe Beyls</a> – Creator of the Slimbox2 Javascript</li>
<li><a href="http://gsgd.co.uk/sandbox/jquery/easing/" rel="nofollow ugc">George McGinley Smith</a> – Creator of the jQuery Easing Plugin Javascript</li>
<li><a href="http://acko.net/dev/farbtastic/" rel="nofollow ugc">Steven Wittens</a> – Creator of the jQuery Farbtastic colorpicker Javascript</li>
<li><a href="http://pixopoint.com" rel="nofollow ugc">Ryan Hellyer</a> – For spurring my interest in WordPress plugins by welcoming my assistance on his <a href="http://pixopoint.com/multi-level-navigation/" rel="nofollow ugc">Multi-level Navigation plugin</a> and for hosting our <a href="http://pixopoint.com/forum/index.php?board=6.0" rel="nofollow ugc">support forums</a>.</li>
<li>Spi for code suggestion to autogroup items by post.</li>
<li><a href="http://nv1962.net/" rel="nofollow ugc">nv1962</a> – Suggestion to implement localization and Spanish/Español and Dutch/Nederlandse translations.</li>
<li>Laws for German/Deutsch localization.</li>
<li>monodistortion  for CSS tweaks to prevent tiling of images.</li>
<li>Jandry for the French/Français translation.</li>
<li><a href="http://www.serhatyolacan.com" rel="nofollow ugc">Serhat Yolaçan</a> for the Turkish/Türkçe translation.</li>
<li><a href="http://pc.de" rel="nofollow ugc">Marcis G.</a> for the Belarusian/Беларускі translation.</li>
<li><a href="http://www.easespot.com" rel="nofollow ugc">easespot</a> for the Chinese/中文 translation and FunDo for additional assistance.</li>
<li><a href="http://www.techload.com.br/" rel="nofollow ugc">Marcelo</a> for the Brazilian Portuguese/Português brasileiro translation.</li>
<li><a href="http://www.Behumandesign.com" rel="nofollow ugc">Giacomo</a> for the Italian/Italiano translation.</li>
<li>Nata Strazda of <a href="http://www.webhostinghub.com" rel="nofollow ugc">Web Hub</a> for the Lithuanian/Lietuviškai translation.</li>
<li>ackie00h for the Japanese/日本語 translation.</li>
<li>nafanyabr for the Russian/русский язык translation.</li>
<li><a href="http://shachi.tw" rel="nofollow ugc">shachi</a> for the Traditional Chinese/繁體中文 translation.</li>
<li>Zareiff, for various Next/Previous/Close translation images when not provided by translators.</li>
<li>Anyone else I forgot to mention who’s made a suggestion or provided me with ideas.</li>
</ul>


WP-Slimbox2 Plugin

A WordPress implementation of the Slimbox2 javascript.

Simple Stupid Shortcode vs WP-Slimbox2 Plugin