Title: Amitry Project Grid – Browser Mockup & Scrolling Screenshot Portfolio Author: amitry Published: 2026 年 6 月 13 日 Last modified: 2026 年 6 月 15 日 --- 搜索插件 ![](https://ps.w.org/amitry-project-grid/assets/banner-772x250.png?rev=3571304) ![](https://ps.w.org/amitry-project-grid/assets/icon-256x256.png?rev=3571304) # Amitry Project Grid – Browser Mockup & Scrolling Screenshot Portfolio 作者：[amitry](https://profiles.wordpress.org/amitry/) [下载](https://downloads.wordpress.org/plugin/amitry-project-grid.1.0.2.zip) * [详情](https://cn.wordpress.org/plugins/amitry-project-grid/#description) * [评价](https://cn.wordpress.org/plugins/amitry-project-grid/#reviews) * [安装](https://cn.wordpress.org/plugins/amitry-project-grid/#installation) * [开发进展](https://cn.wordpress.org/plugins/amitry-project-grid/#developers) [支持](https://wordpress.org/support/plugin/amitry-project-grid/) ## 描述 **[See the live demo →](https://demo.amitry.de/)** — hover any mockup to watch the full page scroll. Amitry Project Grid is a WordPress browser mockup and scrolling screenshot plugin for agencies and freelancers. Show a website preview inside a clean browser frame that scrolls through the full-page screenshot on hover, then group these project cards into a responsive portfolio grid. Each card has five fields: an icon (dashicon or uploaded image), a headline, a description, a browser-mockup screenshot that scrolls automatically on hover, and a call-to-action button. People look for this kind of plugin under many names – browser mockup, scrolling screenshot, website preview, portfolio screenshot grid, project showcase, or website frame. Amitry Project Grid covers that use case as a block, a shortcode, and an Elementor widget. Cards can be used individually or grouped into a responsive grid for portfolio overviews. #### Card fields * Icon (Dashicon picker or uploaded image) * Headline with selectable heading level (H2-H6) * Description with basic inline formatting (bold, italic, links) * Mockup image displayed inside a browser frame, with hover-scroll for full-page screenshots * Call-to-action button with text, URL and target #### Frontends * Project Grid block: grid container with a 1-6 column setting (responsive on smaller screens) * Project Card block: single card, can be used standalone or inside a grid * Shortcode for classic themes * Elementor widget (loads only if Elementor is active) #### Mockup feature The mockup feature renders the uploaded screenshot inside a browser-style frame with traffic-light dots and an address bar. On hover (desktop) the image scrolls from top to bottom of the screenshot, then returns when the cursor leaves. On touch devices the scroll plays automatically when the card enters the viewport, and tapping replays it. The plugin uses the original uploaded image (not WordPress\’ auto-scaled version) so long screenshots stay sharp. #### Privacy The plugin makes no external network requests. No data is collected, transmitted or stored outside your own WordPress installation. #### For developers The plugin exposes hooks for extensions: * `apshow_renderer_defaults`, `apshow_wrapper_classes`, `apshow_render_html`, ` apshow_kses_allowed` (filters) * `apshow_allowed_frames`, `apshow_allowed_scroll_modes`, `apshow_mockup_bar_html`,` apshow_mockup_html` (filters for extending mockup frames and animation modes) * `apshow_before_render`, `apshow_after_render`, `apshow_loaded`, `apshow_activated`,` apshow_deactivated`, `apshow_admin_about_after_content` (actions) * `APSHOW_HOOK_VERSION` constant for compatibility checks ## 屏幕截图 [⌊The hover effect in action: a full-page website screenshot scrolling inside a browser mockup.⌉⌊The hover effect in action: a full-page website screenshot scrolling inside a browser mockup.⌉[ The hover effect in action: a full-page website screenshot scrolling inside a browser mockup. ## 区块 该插件提供了 2 个区块. * Project Card A single project showcase card: icon, headline, description, browser- mockup screenshot with hover-scroll, and call-to-action. * Project Grid Container for multiple Project Cards arranged in a responsive grid. ## 安装 1. Upload the plugin folder to `/wp-content/plugins/` or install via the Plugins screen. 2. Activate the plugin. 3. Add the “Project Grid” or “Project Card” block, or use the `[apshow_project_card]` shortcode, or the Elementor widget. ## 常见问题 ### Do I need an external service or API key? No. The plugin works entirely with images you upload to your own media library. ### Can I use just one card without the grid? Yes. The Project Card block works standalone. ### Does it work with my theme? The blocks, shortcode and Elementor widget work with any standard WordPress theme. Block alignment options (wide, full) on the grid require a theme that supports them. ### Is Elementor required? No. The Elementor widget only registers when Elementor is active. ### How tall can my screenshot be? Any height. The plugin reads the original uploaded image so even very tall full- page screenshots stay sharp inside the mockup. ## 评价 此插件暂无评价。 ## 贡献者及开发者 「Amitry Project Grid – Browser Mockup & Scrolling Screenshot Portfolio」是开源软件。 以下人员对此插件做出了贡献。 贡献者 * [ amitry ](https://profiles.wordpress.org/amitry/) [帮助将「Amitry Project Grid – Browser Mockup & Scrolling Screenshot Portfolio」翻译成简体中文。](https://translate.wordpress.org/projects/wp-plugins/amitry-project-grid) ### 对开发感兴趣吗? 您可以[浏览代码](https://plugins.trac.wordpress.org/browser/amitry-project-grid/)， 查看[SVN仓库](https://plugins.svn.wordpress.org/amitry-project-grid/)，或通过[RSS](https://plugins.trac.wordpress.org/log/amitry-project-grid/?limit=100&mode=stop_on_copy&format=rss) 订阅[开发日志](https://plugins.trac.wordpress.org/log/amitry-project-grid/)。 ## 更新日志 #### 1.0.2 * Added a link to the live demo at https://demo.amitry.de/ #### 1.0.1 * Renamed the single-card shortcode to [apshow_project_card] for prefix consistency. * Readme: clearer title and description for the browser-mockup / scrolling-screenshot use case. #### 1.0.0 * Initial release. ## 额外信息 * 版本 **1.0.2** * 最后更新：**3 小时前** * 活跃安装数量 **不到10** * WordPress 版本 ** 6.2 或更高版本 ** * 已测试的最高版本为 **7.0** * PHP 版本 ** 7.4 或更高版本 ** * 语言 * [English (US)](https://wordpress.org/plugins/amitry-project-grid/) * 标签 * [portfolio](https://cn.wordpress.org/plugins/tags/portfolio/)[showcase](https://cn.wordpress.org/plugins/tags/showcase/) [website preview](https://cn.wordpress.org/plugins/tags/website-preview/) * [高级视图](https://cn.wordpress.org/plugins/amitry-project-grid/advanced/) ## 评级 尚未提交反馈。 [Your review](https://wordpress.org/support/plugin/amitry-project-grid/reviews/#new-post) [查看全部评论](https://wordpress.org/support/plugin/amitry-project-grid/reviews/) ## 贡献者 * [ amitry ](https://profiles.wordpress.org/amitry/) ## 支持 有话要说吗？是否需要帮助？ [查看支持论坛](https://wordpress.org/support/plugin/amitry-project-grid/)