phikai

Justin Peacock

<p>Show your work in high resolution, responsive device mockups using only shortcodes. Wrap images, videos, or any other content within a few simple shortcodes to display them within any of the pre-packaged devices mockups, which are easily selectable from within the editor.</p>
<p><a href="https://devicemockupswp.com/" rel="nofollow ugc">Documentation</a></p>
<h4>Available shortcodes</h4>
<ul>
<li>[device][/device]</li>
<li>[browser][/browser]</li>
</ul>
<h4>Device Attributes</h4>
<ul>
<li>type: imac|iphone6|iphone6-plus|iphone5s|iphone5|s3|lumia920|ipad|nexus7|surface</li>
<li>color: black|white|gold|silver</li>
<li>orientation: portrait|landscape</li>
<li>stacked: open|closed</li>
<li>position: left|right</li>
<li>link</li>
<li>width: (px or %)</li>
<li>hide: left|right</li>
<li>scroll: false</li>
<li>gallery: false</li>
</ul>
<h4>Browser Attributes</h4>
<ul>
<li>type: chrome|firefox|safari</li>
<li>link</li>
<li>width: (px or %)</li>
<li>gallery: false</li>
</ul>
<h4>Creating a Gallery</h4>
<ul>
<li>Add gallery=”true” to your device|browser shortcode</li>
<li>Add your images within your device</li>
<li>Add a <code><div></code> around each image within the device</li>
</ul>
<p>I’m working to simplify this process but for now, this will get your galleries working.</p>
<p>See <a href="https://devicemockupswp.com/gallery-slider/" rel="nofollow ugc">Gallery Slider</a></p>
<h4>Recommended Image Sizes</h4>
<ul>
<li>iPhone 6 – 1334×750</li>
<li>iPhone 6 Plus – 1920×1080</li>
<li>iPhone 5s – 1136×640</li>
<li>iPhone 5 – 640×1136</li>
<li>iPad – 2048×1536</li>
<li>iMac – 1920×1200</li>
<li>Macbook Pro – 1440×900</li>
<li>Galaxy S3 – 720×1280</li>
<li>Nexus 7 – 1920×1200</li>
<li>Surface – 1920×1080</li>
<li>Lumia 920 – 768×1280</li>
<li>Chrome – 1440×900</li>
<li>Firefox – 1440×900</li>
<li>Safari – 1440×900</li>
</ul>
<h4>Bugs:</h4>
<ul>
<li><a href="https://wordpress.org/support/plugin/device-mockups" rel="ugc">Report an issue</a></li>
</ul>
<h4>Questions/Comments</h4>
<ul>
<li>https://byjust.in/contact/</li>
</ul>


Device Mockups

Show your work in high resolution, responsive device mockups using only shortcodes.

Bogdan Bendziukov

<p>The Device Wrapper plugin enables users to wrap an image, video or iframe into a device mockup, providing a more professional and polished look to their content.</p>
<p>The Device Wrapper plugin does not require any specific configuration. Once activated, the plugin adds a new shortcode to WordPress that can be used to wrap images, videos or iframes into device mockups. It also provides a custom block for Gutenberg editor and a custom widget for Elementor builder (in the Premium version).</p>
<p><a href="https://pluginarium.com/device-wrapper/" rel="nofollow ugc">Check out the DEMO!</a></p>
<p><a href="https://pluginarium.com/device-wrapper/device-wrapper-documentation/" rel="nofollow ugc">Read the full documentation of this plugin.</a></p>
<h3>Features available:</h3>
<ul>
<li>Wrap any image, video or iframe (like Vimeo or YouTube)</li>
<li>20+ mockup devices (incl. iWatch and Apple Studio)</li>
<li>Various customizing options (size, content placing, video options etc.)</li>
<li>High quality SVG mockups</li>
<li>Use anywhere with a shortcode</li>
<li>Gutenberg block included</li>
</ul>
<h3>The Premium version provides extra features:</h3>
<ul>
<li>Dynamic source support (APIs, GET and POST vars)</li>
<li>Elementor widget</li>
<li>Custom colors for the devices frames and screens</li>
</ul>
<p>To upgrade the Device Wrapper to the Premium version, open your WP-Admin panel, then navigate to the Settings -> Device Wrapper -> Upgrade</p>


Device Wrapper

A WordPress plugin which enables users to wrap an image, video or iframe into a device mockup.

Device Mockups vs Device Wrapper