Title: Pirajki iPad Scroll Mockup Author: Poonam Published: August 7, 2026 Last modified: August 7, 2026 --- Search plugins ![](https://s.w.org/plugins/geopattern-icon/pirajki-device-scroll-mockup.svg) # Pirajki iPad Scroll Mockup By [Poonam](https://profiles.wordpress.org/pirajki/) [Download](https://downloads.wordpress.org/plugin/pirajki-device-scroll-mockup.1.0.0.zip) * [Details](https://wordpress.org/plugins/pirajki-device-scroll-mockup/#description) * [Reviews](https://wordpress.org/plugins/pirajki-device-scroll-mockup/#reviews) * [Installation](https://wordpress.org/plugins/pirajki-device-scroll-mockup/#installation) * [Development](https://wordpress.org/plugins/pirajki-device-scroll-mockup/#developers) [Support](https://wordpress.org/support/plugin/pirajki-device-scroll-mockup/) ## Description Pirajki iPad Scroll Mockup adds a single shortcode, `[pirajki_ipad_scroll]`, that renders a device mockup with a screenshot inside its screen. Hover over the frame and scroll the mouse wheel to scroll the screenshot inside the screen; move the pointer away and the page scrolls normally again. You can place as many frames as you like on the same page — each one scrolls independently. It’s a lightweight way to showcase a website, app, or product screenshot inside a device frame without a page builder add-on or external animation library. #### Features * **One shortcode** — `[pirajki_ipad_scroll]`, no blocks or builder required * **Hover-to-scroll** — the screenshot only scrolls inside the frame while the mouse is over it; the page scrolls normally the rest of the time * **Multiple frames per page** — each shortcode instance scrolls independently, so you can place several on one page * **Built-in default frame** — ships with an iPad frame so `[pirajki_ipad_scroll screenshot="456"]` works out of the box * **Any device frame** — swap in any transparent-background device PNG (iPad, phone, laptop, browser chrome, etc.), not just iPads * **Media Library or direct URL** — pass an attachment ID or a full image URL for both the frame and the screenshot * **Pure vanilla JavaScript** — no jQuery or external dependencies * **No settings page, no database options** — the plugin only enqueues its assets on pages where the shortcode is actually used #### Shortcode Usage Basic usage — only a screenshot is required, the plugin ships with a default iPad frame: ``` [pirajki_ipad_scroll screenshot="456"] ``` Using your own frame and Media Library attachment IDs: ``` [pirajki_ipad_scroll frame="123" screenshot="456"] ``` Or with direct image URLs: ``` [pirajki_ipad_scroll frame="https://example.com/ipad-frame.png" screenshot="https://example.com/homepage-shot.jpg"] ``` #### Shortcode Attributes * `frame` — (optional) Attachment ID or URL of the device frame image (should have a transparent screen area). Defaults to the iPad frame bundled with the plugin. * `screenshot` — (required) Attachment ID or URL of the screenshot to scroll inside the screen * `frame_alt` — alt text for the frame image (default: “Device frame”) * `shot_alt` — alt text for the screenshot image (default: “Homepage preview”) The shortcode renders only the device frame with the scrollable screenshot inside it — no heading, background, or padding around it, so it drops cleanly into any layout. ## Installation 1. Upload the `pirajki-ipad-scroll` folder to `/wp-content/plugins/`, or install directly through the WordPress Plugins screen 2. Activate through ‘Plugins’ in WordPress Admin 3. Add the `[pirajki_ipad_scroll frame="..." screenshot="..."]` shortcode to any page or post, using either Media Library attachment IDs or image URLs ## FAQ ### Does this only work with iPad mockups? No. Any device frame image with a transparent screen area works — phone, laptop, browser window, tablet, and so on. The name reflects the original use case, but the shortcode accepts any frame image. ### Where do I get a device frame image? Upload your own PNG with a transparent screen cut-out to the Media Library (or use a direct URL to one), then pass its attachment ID or URL as the `frame` attribute. ### Why isn’t anything showing on the page? The `screenshot` attribute is required. If it’s missing or can’t be resolved to an image, logged-in editors will see an inline notice on the page explaining what’s missing; the shortcode simply renders nothing for visitors. ### Do I have to supply my own device frame? No — the plugin ships with a default iPad frame, so `[pirajki_ipad_scroll screenshot ="456"]` works on its own. Pass your own `frame` attribute (attachment ID or URL) if you’d rather use a different device or a custom frame image. ### Does this add any settings pages or database options? No. The plugin has no admin settings screen and stores nothing in the database — it only registers a shortcode and enqueues its CSS/JS on pages where that shortcode is used. ### Does the page scroll when I scroll over the mockup? No. While the mouse is over the frame, scrolling moves the screenshot inside the screen instead of the page. Move the pointer off the frame and the page scrolls normally again. ### Can I add more than one on the same page? Yes. Use the shortcode as many times as you like — each instance scrolls independently of the others. ## Reviews There are no reviews for this plugin. ## Contributors & Developers “Pirajki iPad Scroll Mockup” is open source software. The following people have contributed to this plugin. Contributors * [ Poonam ](https://profiles.wordpress.org/pirajki/) [Translate “Pirajki iPad Scroll Mockup” into your language.](https://translate.wordpress.org/projects/wp-plugins/pirajki-device-scroll-mockup) ### Interested in development? [Browse the code](https://plugins.trac.wordpress.org/browser/pirajki-device-scroll-mockup/), check out the [SVN repository](https://plugins.svn.wordpress.org/pirajki-device-scroll-mockup/), or subscribe to the [development log](https://plugins.trac.wordpress.org/log/pirajki-device-scroll-mockup/) by [RSS](https://plugins.trac.wordpress.org/log/pirajki-device-scroll-mockup/?limit=100&mode=stop_on_copy&format=rss). ## Changelog #### 1.0.0 * Initial release. ## Meta * Version **1.0.0** * Last updated **19 hours ago** * Active installations **Fewer than 10** * WordPress version ** 6.0 or higher ** * Tested up to **7.0.3** * PHP version ** 7.4 or higher ** * Tags * [device mockup](https://wordpress.org/plugins/tags/device-mockup/)[ipad](https://wordpress.org/plugins/tags/ipad/) [mockup](https://wordpress.org/plugins/tags/mockup/)[scroll animation](https://wordpress.org/plugins/tags/scroll-animation/) [shortcode](https://wordpress.org/plugins/tags/shortcode/) * [Advanced View](https://wordpress.org/plugins/pirajki-device-scroll-mockup/advanced/) ## Ratings No reviews have been submitted yet. [Your review](https://wordpress.org/support/plugin/pirajki-device-scroll-mockup/reviews/#new-post) [See all reviews](https://wordpress.org/support/plugin/pirajki-device-scroll-mockup/reviews/) ## Contributors * [ Poonam ](https://profiles.wordpress.org/pirajki/) ## Support Got something to say? Need help? [View support forum](https://wordpress.org/support/plugin/pirajki-device-scroll-mockup/)