Linux 软件免费装

在这里免费安装WordPress以及其他软件

Banner图

Synced Pattern Popups

开发者 webdevmattcrom
更新时间 2026年1月20日 23:02
PHP版本: 5.8 及以上
WordPress版本: 6.9
版权: GPLv2 or later
版权网址: 版权信息

标签

modal popup ai tldr synced-patterns

下载

1.1.2 1.3.0 1.1.3 1.2.0 1.2.1

详情介绍:

Synced Pattern Popups helps you create popups using the WordPress editor you already know, not yet another builder. Create a Pattern yourself or from the Pattern Library, paste the trigger code as a link anywhere on your site, and your Pattern is now opened via a beautiful and accessible modal popup. Manually triggered by your website viewers because they are interested in your content, not because you're punishing them for scrolling too far, or exiting your tab. Most popup plugins are built on a desperate lie: if you interrupt your visitor enough times, they'll eventually give in. They sell "triggers" like exit intent and scroll depth as features, but in reality, these are just ways to guess what a user wants. When you guess wrong, you don't get a lead; you get a "close" click and a bruised brand reputation. Synced Pattern Popups was built for the site owner who trusts their content and respects their visitors' time. Built for the Modern WordPress Stack Don't step out of your workflow into a bespoke, clunky UI. Synced Pattern Popups uses 100% Native Architecture. If it's a block, it works—forms, videos, or third-party embeds. Key Benefits Major Features ↗️Modal popups powered by Synced Patterns Create your popup content using the native Block Editor - layouts, images, galleries, buttons, and third-party blocks all work. Simple trigger system (class or href) Highlight a word or click into a button then open the hyperlink option. Paste in your Trigger code, for example: #spp-trigger-{id} and now that link will open your modal on click, just like that! You can also set a custom class name on a block: Width overrides By default all modals open at 600px. You can override that in your general settings at "Appearance → Synced Pattern" then the "Defaults" tab. Or you can also set it on a per modal basis within the trigger code by appending the width in pixels to the end of the trigger code: spp-trigger-{id}-{width}. 🖼️Core Gallery Block Support The Core Gallery block has a "lightbox" feature. But that feature does not support image navigation within the lightbox or captions or width management. Synced Pattern Popups lets you do all of that with your Core Gallery blocks. Simply choose the Gallery block (not the individual images within the Gallery block), and click on the link icon ("🔗"). There you'll see several options, including the Core lightbox feature, and now also "Open in Synced Pattern Popups". 🤖AI-powered TLDR (optional) Generate AI summaries of the current page content on demand by adding a spp-trigger-tldr trigger. This feature requires the AI Experiments plugin and configured credentials (you’ll see guided setup in the TLDR tab). 💻Handy for Developer Features Synced Pattern Popups is made to be user friendly, but it's also full of useful utilities for developers. How It Works
  1. Create a Synced Pattern in WordPress (Appearance → Synced Patterns)
  2. Add a trigger as a link or class to any block or element: class="spp-trigger-{ID}" or href="#spp-trigger-{ID}"
  3. When clicked, the popup opens with your pattern content
  4. Content loads via AJAX for optimal performance
What are Synced Patterns? Synced Patterns (stored as wp_block posts) are reusable block layouts you can create and manage once, then reuse across your site. When you edit a synced pattern, any place it’s used is updated automatically. This plugin surfaces them with a dedicated admin screen at Appearance → Synced Patterns, making it easy to:

安装:

  1. Upload the sppopups folder to /wp-content/plugins/ directory
  2. Activate the plugin through the 'Plugins' menu in WordPress
  3. Go to Appearance → Synced Patterns to manage your popup content
  4. Create a synced pattern and note its ID
  5. Add class="spp-trigger-{id}" or href="#spp-trigger-{id}" to any element
  6. That's it! Your popup is ready.

屏幕截图:

  • The Synced Patterns Popup settings screen listing your sites Synced Patterns. From here you can copy the trigger code, edit the pattern, delete the pattern, or clear the pattern transient cache.
  • The TLDR settings panel, showing it enabled (because AI Experiments is enabled and configured correctly). Here you can customize your prompt and your TLDR cache length.
  • The "Defaults" settings screen. It contains three sections (1) The Pattern modal settings (2) the TLDR Popup Defaults (3) Gallery Popups Defaults.
  • A "Terms and Conditions" modal, illustrating how tall content scrolls inside the modal.
  • An example of the Gallery block inside our modal, with image navigation on the image and below as well as caption support.
  • The Gallery block showing the "Open in Synced Pattern Popups" option. Notice also the settings in the block sidebar settings that control the modal width, close buttons, and navigation options.

升级注意事项:

1.3.0 Major update introducing default settings page and Command Palette integration. Configure default popup appearance (width, height, colors, close buttons) for Pattern, TLDR, and Gallery popups. TLDR and Gallery can inherit from Pattern defaults. Improved modal scrolling. Recommended for all users. 1.2.0 Major refactor of modal state management for improved stability, maintainability, and debugging. Fixes an issue with gallery random order. Addresses Plugin Check warnings. Recommended for all users. 1.1.3 Admin UI improvements and review notice feature. Settings page now has consistent width constraints, and a friendly review notice will appear after 10 days to encourage user feedback. All existing functionality remains unchanged. 1.1.2 Internationalization and code quality improvements. Enhanced translation support with proper textdomain loading and updated German translations. All Plugin Check compliance issues resolved. Recommended for all users. 1.1.1 Bug fix release addressing block style loading issues. All block styles (core and third-party) now properly load in modal popups. Recommended for all users. 1.1.0 Major admin interface update with tabbed navigation, improved usability, and individual pattern cache management. The admin interface now features a modern tabbed design with direct links to Patterns, TLDR settings, and usage instructions. 1.0.1 Hotfix release addressing WordPress.org Plugin Directory submission requirements. No user-facing changes. 1.0.0 Initial release of Synced Pattern Popups. Activate and start creating popups immediately - no configuration required.

常见问题:

How do I trigger a popup?

You can trigger a popup in two ways: Method 1: Class Name (Recommended for custom HTML) Add the class spp-trigger-{id} to any clickable element, where {id} is the numeric ID of your Synced Pattern. Example: <a href="#" class="spp-trigger-1359">Open Popup</a> <button class="spp-trigger-1359">Click Me</button> Method 2: Href Attribute (Perfect for Block Editor) Set the href attribute to #spp-trigger-{id} on any link element. This is especially useful in the WordPress Block Editor where you can't easily add custom classes. Example: <a href="#spp-trigger-1359">Open Popup</a>

Where do I find the pattern ID?

Go to WordPress Admin → Appearance → Synced Patterns. The ID column shows the pattern ID prominently. You can also click the "Copy Trigger" button in the Actions column to copy the complete trigger code.

Can I use multiple popups on one page?

Yes! You can have multiple different popups on the same page - just use different pattern IDs. Mix and match both trigger methods as needed.

Can I customize the modal width?

Yes! Add a width suffix to your trigger: spp-trigger-{id}-{width} where width is in pixels (100-5000px). Example: <a href="#" class="spp-trigger-1359-800">Open 800px Modal</a>

What is the TLDR feature?

The TLDR (Too Long; Didn't Read) feature generates AI-powered summaries of your page content. Simply add class="spp-trigger-tldr" or href="#spp-trigger-tldr" to any element, and when clicked, it will generate a concise summary of the current page. Requirements:

  • WordPress AI Experiments plugin must be installed and activated
  • AI credentials must be configured in Settings → AI Experiments The TLDR feature can be enabled/configured in Appearance → Synced Patterns → AI TLDR Settings.

Why isn't my popup opening?

Check these common issues:

  1. Verify the trigger format: Use exactly spp-trigger-{id} (class) or #spp-trigger-{id} (href) where {id} is numeric
  2. Check pattern ID: Verify the pattern ID exists in Appearance → Synced Patterns
  3. Pattern status: Ensure the pattern is published (not draft)
  4. Sync status: Only synced patterns work - unsynced patterns are excluded
  5. Toggle Forced On: In your post or page, there's a setting called "Synced Pattern Popup Support". Toggle this on if your class or link is output on the page dynamically, like via a form or AJAX.
  6. Browser console: Check for JavaScript errors in browser developer tools.
Try to answer as many of those questions as you can when submitting a support ticket.

Why isn't my content loading?

Troubleshooting steps:

  1. Verify pattern ID: Double-check the ID in Appearance → Synced Patterns
  2. Check pattern status: Pattern must be published
  3. Verify sync status: Only synced patterns can be used
  4. Network tab: Check browser Network tab for AJAX errors
  5. Clear cache: Try clearing the transient cache (button in admin interface)

Can I use this with page builders?

Yes! The plugin works with most page builders. For dynamically loaded content (like Gravity Forms or AJAX-loaded sections), you may need to enable "Forced On" in the post meta box (Synced Pattern Popup Support) to ensure assets load.

Does this work with caching plugins?

Yes! The plugin uses WordPress transients for caching, which works with all major caching plugins. Cache is automatically invalidated when patterns are updated.

Is this accessible?

Yes! The plugin includes:

  • Full keyboard navigation (Escape to close, Tab navigation)
  • Screen reader support with ARIA attributes
  • Focus management (returns focus to trigger element on close)
  • High contrast support

Can I customize the modal styles?

Yes! The plugin uses minimal CSS. You can override styles in your theme's CSS using the same class names. The modal uses these main classes:

  • .sppopups-modal - Main modal container
  • .sppopups-overlay - Background overlay
  • .sppopups-container - Content container
  • .sppopups-content - Content area

What WordPress version is required?

WordPress 5.8 or higher. The plugin is tested up to WordPress 6.9.

What PHP version is required?

PHP 7.4 or higher.

更新日志:

1.3.0 1.2.0 1.1.3 1.1.2 1.1.1 1.1.0 1.0.1 1.0.0