Preview page does not load
Requests blocked by WAF or paywall
The embedded preview loads resources through Marfeel’s proxy using a dedicated User Agent. If your site’s Web Application Firewall (WAF) or paywall blocks these requests, the preview page will fail to load.
Solution: Whitelist Marfeel’s preview User Agent on your server. If whitelisting isn’t possible, disable the proxy and customize the User Agent string in Experiences Settings > Custom User Agent for Preview.
For details on Marfeel’s crawlers and User Agents, see Marfeel Crawlers.
CORS policy blocks embedded preview
If your site’s CORS (Cross-Origin Resource Sharing) policy prevents content from being displayed in iframes on other domains, the embedded preview will fail to load.
Symptom: The browser console shows an error like:
Uncaught SecurityError: Failed to read a named property 'document' from 'Window': Blocked a frame with origin "https://playground.mrf.io" from accessing a cross-origin frame.
Solution: Add playground.mrf.io to your CORS policy whitelist to allow the embedded preview to load content from your site.
Preview looks different from live site
When the preview loads but doesn’t match the normal browsing experience, CORS policies may prevent the browser from loading external resources like CSS files, images, or fonts.
Diagnosis: Open browser developer tools and check the Network tab for failed requests. Look for 403 or CORS-related errors on stylesheet, image, or font files.
Solution: Update your CORS policy to allow requests from playground.mrf.io for static assets (CSS, images, fonts).
Experience does not appear in preview
Trigger conditions not met
If the experience has triggers configured, it won’t appear until those trigger conditions are met. For example, a scroll trigger at 50% won’t fire if you don’t scroll down the preview page.
Diagnosis: Check if triggers are configured in the Format tab under Advanced Settings.
Solution: Use the Disable Triggers option in the preview options menu (three dots). This bypasses all triggers and shows the experience immediately, useful when focusing on visual adjustments. Remember to re-enable and test triggers before publishing.
CSS Selector not matching (Inline experiences)
Inline experiences require a matching CSS selector on the page. If the selector doesn’t match any element, the experience won’t inject.
Symptom: A warning appears below the CSS Selector field in the Format tab stating the selector was not found.
Solution:
- Verify the CSS selector is correct for the preview URL
- Use the target icon in the preview toolbar to select the desired element and generate an optimized CSS selector automatically
- If the selector works on some pages but not others, use multiple CSS selectors or placement fallbacks.
Non-AMP content in Flowcard
Flowcards require AMP-valid content. When using a Custom URL Flowcard, rendering fails if the URL doesn’t point to an AMP-compliant page or doesn’t link to an AMP version via the <link rel="amphtml"> tag.
Symptom: Flowcard appears empty or shows an error in preview.
Solution:
- Verify the URL points to an AMP page
- If the page isn’t AMP, add a
<link rel="amphtml" href="...">tag in the page head pointing to the AMP version - For Recommender Flowcards in Article mode, the system automatically excludes articles without AMP versions
See Flowcards: AMP compatibility for details.
Layout rendering failed
Custom layouts using Mustache template syntax fail to render when the template logic contains errors or the data fed to the template doesn’t match the expected structure.
Symptom: Experience doesn’t appear, or placeholder content shows instead of actual data.
Diagnosis:
- Switch to JSON view in the preview options menu to verify the data being passed to the layout
- Open the layout editor (Content tab) and check for template syntax errors or missing variables
Solution:
- Fix Mustache syntax errors in the layout template
- Verify the template variables match the data structure in the JSON response
- Add fallback logic in the template for optional or missing data fields
No content available (Recommender experiences)
Recommender experiences fail to render when no articles match the configured filters and ranking algorithm.
Symptom: Experience doesn’t appear in preview, or appears empty.
Diagnosis: Switch to JSON view in the preview options menu. If the response shows an empty article list or no recommendations, this is the issue.
Solution:
- Check Content tab filters: time window, section restrictions, topic filters may be too narrow
- Test with a broader time window (e.g., 7 days instead of 24 hours)
- Verify the preview URL is on a page that matches your content filters
- Configure fallback behavior in the Recommender settings
See Content and Recommender for details on filters and fallback mechanisms.
Server error
If none of the above issues apply and the experience still doesn’t appear, there may be a server-side issue with the Experience Manager or delivery infrastructure.
Diagnosis: Check the browser console for 500-level HTTP errors or timeout messages.
Solution: Contact Marfeel Support with:
- Experience ID
- Preview URL being tested
- Browser console error messages
- Approximate time the error occurred
Experience appears in preview but not live
Targeting rules exclude the current user
The experience may have targeting rules that exclude your current browser session. For example, if the experience targets new users only and your browser has existing loyalty signals, it won’t appear.
Diagnosis: Review the Targeting tab configuration. Check loyalty segment, device type, geographic location, and custom variable filters.
Solution:
- Test in an incognito/private browser window to simulate a new user
- Use the
#mrfexp={EXPERIENCE_ID}parameter to force the experience to appear regardless of targeting - Temporarily broaden targeting rules for testing, then restore them before publishing
See Targeting for details on targeting dimensions.
Frequency cap reached
If the experience has frequency capping configured (Delivery tab), you may have already seen it the maximum number of times allowed within the time window.
Diagnosis: Check the Delivery tab for “Limit per user” settings.
Solution:
- Clear browser cookies and local storage to reset frequency caps
- Test in an incognito/private browser window
- Use the
#mrfexp={EXPERIENCE_ID}parameter to bypass frequency caps during testing
See Delivery and Scheduling for details on frequency capping.
Experience priority conflict
If multiple experiences target the same placement (e.g., two Flowcards or two Inline experiences with the same CSS selector), only the highest-priority experience appears. If another experience has higher priority, yours won’t render.
Diagnosis: Check the Delivery tab Priority setting and review other active experiences that might conflict.
Solution:
- Increase the experience’s priority value to ensure it wins conflicts
- Adjust targeting rules to avoid conflicts with other experiences
- Use the
#mrfexp={EXPERIENCE_ID}parameter to force your specific experience to appear for testing
See Delivery and Scheduling: Priority for details on conflict resolution.
Going deeper
- Experience Manager Overview: Navigate the editor interface and preview features.
- Targeting: Understanding targeting rules and dimensions.
- Delivery and Scheduling: Priority, frequency capping, and scheduling.
- Inline Experiences: CSS selector placement and fallbacks.
- Flowcards: CORS considerations and AMP requirements.
- Popups: Entry behavior and configuration.
- Web Activation: How experiences integrate with your site.