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.

Kleor

<p>Device Detect allows you to detect the device of the user, and to <strong>easily insert</strong> into posts, pages and widgets of your website <strong>some contents only for the phones, tablets or computers</strong>.</p>
<ul>
<li><a href="https://www.kleor.com/device-detect/" rel="nofollow ugc">Documentation</a></li>
</ul>
<h3>Plugins from the same author</h3>
<ul>
<li><a href="https://www.kleor.com/commerce-manager/en/" rel="nofollow ugc">Commerce Manager, to sell your products</a></li>
<li><a href="https://www.kleor.com/affiliation-manager/en/" rel="nofollow ugc">Affiliation Manager, to create your affiliate program</a></li>
<li><a href="https://www.kleor.com/membership-manager/en/" rel="nofollow ugc">Membership Manager, to create your members areas</a></li>
<li><a href="https://www.kleor.com/optin-manager/en/" rel="nofollow ugc">Optin Manager, to build your prospects lists</a></li>
<li><a href="https://www.kleor.com/contact-manager/en/" rel="nofollow ugc">Contact Manager, to create your contact forms</a></li>
<li><a href="https://www.kleor.com/easy-timer/en/" rel="nofollow ugc">Easy Timer, to display count down/up timers</a></li>
<li><a href="https://www.kleor.com/content-switcher/en/" rel="nofollow ugc">Content Switcher, to display random or variable contents</a></li>
</ul>


Device Detect

Allows you to detect the device of the user, and to display some contents only for the phones, tablets or computers.

Device Mockups vs Device Detect