Title: Pirajki iPad Scroll Mockup Author: Poonam Published: 7 d'agost de 2026 Last modified: 7 d'agost de 2026 --- Cerca extensions ![](https://s.w.org/plugins/geopattern-icon/pirajki-device-scroll-mockup.svg) # Pirajki iPad Scroll Mockup Per [Poonam](https://profiles.wordpress.org/pirajki/) [Baixa](https://downloads.wordpress.org/plugin/pirajki-device-scroll-mockup.1.0.0.zip) * [Detalls](https://ca.wordpress.org/plugins/pirajki-device-scroll-mockup/#description) * [Ressenyes](https://ca.wordpress.org/plugins/pirajki-device-scroll-mockup/#reviews) * [Instal·lació](https://ca.wordpress.org/plugins/pirajki-device-scroll-mockup/#installation) * [Desenvolupament](https://ca.wordpress.org/plugins/pirajki-device-scroll-mockup/#developers) [Suport](https://wordpress.org/support/plugin/pirajki-device-scroll-mockup/) ## Descripció 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. ## Instal·lació 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 ## PMF ### 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. ## Ressenyes No hi ha ressenyes per a aquesta extensió. ## Col·laboradors i desenvolupadors «Pirajki iPad Scroll Mockup» és programari de codi obert. La següent gent ha col·laborat en aquesta extensió. Col·laboradors * [ Poonam ](https://profiles.wordpress.org/pirajki/) [Traduïu «Pirajki iPad Scroll Mockup» a la vostra llengua.](https://translate.wordpress.org/projects/wp-plugins/pirajki-device-scroll-mockup) ### Interessats en el desenvolupament? [Navegueu pel codi](https://plugins.trac.wordpress.org/browser/pirajki-device-scroll-mockup/), baixeu-vos el [repositori SVN](https://plugins.svn.wordpress.org/pirajki-device-scroll-mockup/), o subscriviu-vos al [registre de desenvolupament](https://plugins.trac.wordpress.org/log/pirajki-device-scroll-mockup/) per [fisl de subscripció RSS](https://plugins.trac.wordpress.org/log/pirajki-device-scroll-mockup/?limit=100&mode=stop_on_copy&format=rss). ## Registre de canvis #### 1.0.0 * Initial release. ## Meta * Versió **1.0.0** * Darrera actualització **fa 3 dies** * Instal·lacions actives **Menys de 10** * Versió del WordPress ** 6.0 o posterior ** * Provada fins a **7.0.3** * Versió del PHP ** 7.4 o posterior ** * Idioma * [English (US)](https://wordpress.org/plugins/pirajki-device-scroll-mockup/) * Etiquetes * [device mockup](https://ca.wordpress.org/plugins/tags/device-mockup/)[ipad](https://ca.wordpress.org/plugins/tags/ipad/) [mockup](https://ca.wordpress.org/plugins/tags/mockup/)[scroll animation](https://ca.wordpress.org/plugins/tags/scroll-animation/) [shortcode](https://ca.wordpress.org/plugins/tags/shortcode/) * [Vista avançada](https://ca.wordpress.org/plugins/pirajki-device-scroll-mockup/advanced/) ## Valoracions Encara no s'ha enviat cap ressenya. [Your review](https://wordpress.org/support/plugin/pirajki-device-scroll-mockup/reviews/#new-post) [Visualitzeu totes les ressenyes](https://wordpress.org/support/plugin/pirajki-device-scroll-mockup/reviews/) ## Col·laboradors * [ Poonam ](https://profiles.wordpress.org/pirajki/) ## Suport Teniu quelcom a dir? Necessiteu ajuda? [Visualitza els fòrums de suport](https://wordpress.org/support/plugin/pirajki-device-scroll-mockup/)