http://www.kriesi.at/support/topic/insert-image-shortcode Support Forum - Topic: Insert image shortcode ? en-US Fri, 24 May 2013 16:58:22 +0000 http://bbpress.org/?v=1.0.2 q http://www.kriesi.at/support/search.php http://www.kriesi.at/support/topic/insert-image-shortcode#post-22652 Wed, 13 Jul 2011 07:02:00 +0000 Dude 22652@http://www.kriesi.at/support/ <p>I corrected the code above - thanks.</p> <p>1) You can try to add a "shadow" div to the image code - use following css code in css/custom.css:<br /> <pre><code>.imgborder{ background: url(&quot;../images/shadow_right.png&quot;) no-repeat scroll right bottom transparent; padding-bottom: 17px; } .imgborder .left_shadow { background: url(&quot;../images/shadow_left.png&quot;) no-repeat scroll right bottom transparent; }</code></pre> <p>and change the shortcode to:<br /> <pre><code>function avia_sc_img($atts, $content = &quot;&quot;, $shortcodename = &quot;&quot;){ return &#39;&lt;div class=&quot;imgborder&quot;&gt;&lt;div class=&quot;left_shadow&quot;&gt;&lt;img src=&quot;&#39;.$atts[&#39;src&#39;].&#39;&quot; alt=&quot;&quot; /&gt;&lt;/div&gt;&lt;/div&gt;&#39;; } add_shortcode(&#39;img&#39;,&#39;avia_sc_img&#39;);</code></pre> <p>I haven't tested it but the result should look like: <a href="http://www.kriesi.at/themes/upscale/blog/" rel="nofollow">http://www.kriesi.at/themes/upscale/blog/</a> </p> http://www.kriesi.at/support/topic/insert-image-shortcode#post-22639 Wed, 13 Jul 2011 00:07:19 +0000 menkom 22639@http://www.kriesi.at/support/ <p>Hi so basically i did what you said and it did not work.</p> <p>You forgot to add img after .imgborder this was preventing it from working.</p> <p>Also i mentioned i needed to replicate how it presents the columns pictures those pictures have padding around the border as well as a background shadow to each picture.... this is what i have added to custom.css so far to almost replicate.</p> <p>/* image border details for insert image shortcode */<br /> .imgborder img{<br /> -moz-border-radius: 3px;<br /> -webkit-border-radius: 3px;<br /> border-radius: 3px;<br /> border: 1px solid #E1E1E1;<br /> padding: 5px;<br /> }</p> <p>Can you please add the featured_shadow code to it so it shows the shadow background on each image.</p> <p>I think we are done after that.</p> <p>Thanks. </p> http://www.kriesi.at/support/topic/insert-image-shortcode#post-22552 Tue, 12 Jul 2011 06:04:46 +0000 Dude 22552@http://www.kriesi.at/support/ <p>Hey,<br /> currently there's no image shortcode however you can easily implement your own. Open up functions.php and add:<br /> <pre><code>function avia_sc_img($atts, $content = &quot;&quot;, $shortcodename = &quot;&quot;){ return &#39;&lt;img src=&quot;&#39;.$atts[&#39;src&#39;].&#39;&quot; alt=&quot;&quot; style=&quot;border: 1px solid #eee&quot; /&gt;&#39;; } add_shortcode(&#39;img&#39;,&#39;avia_sc_img&#39;);</code></pre> <p>If you don't want to use inline styles wrap the image in a span like:</p> <pre><code>function avia_sc_img($atts, $content = &quot;&quot;, $shortcodename = &quot;&quot;){ return &#39;&lt;span class=&quot;imgborder&quot;&gt;&lt;img src=&quot;&#39;.$atts[&#39;src&#39;].&#39;&quot; alt=&quot;&quot; /&gt;&lt;/span&gt;&#39;; } add_shortcode(&#39;img&#39;,&#39;avia_sc_img&#39;);</code></pre> <p>and add:<br /> <pre><code>.imgborder img{ border: 1px solid #E1E1E1; }</code></pre> <p>to css/custom.css. Obviously you can adjust the border style :)</p> <p>Shortcode usage:<br /> <pre><code>[img src=&#39;path/to/image.jpg&#39;]</code></pre> http://www.kriesi.at/support/topic/insert-image-shortcode#post-22518 Tue, 12 Jul 2011 00:16:59 +0000 menkom 22518@http://www.kriesi.at/support/ <p>Hi im not overly happy with the functionality of the columns on the homepage and i need to recreate them from scratch. Is there a shortcode to insert an image with the border option ? I can insert an image but it has no border and does not look like part of the site.</p> <p>Please let me know. thanks. </p>