Introduction
Your virtual tours work best when accessed through compatible browsers with the right implementation method. Proper browser support ensures your immersive experiences load seamlessly for every prospect and client.
Supported Browsers
Our platform is optimized for modern browsers to deliver the best immersive experience:
| Browser | Minimum Version | Best Implementation |
|---|---|---|
| Chrome | 90+ | Iframe or Popup |
| Edge | 90+ | Iframe or Popup |
| Firefox | 88+ | Iframe or Popup |
| Safari (macOS) | 14+ | Popup Modal Only |
| Safari (iOS) | 14+ | Popup Modal Only |
Important Safari Notice: Due to Safari's strict privacy settings, virtual tours must open in popup modals on Safari browsers. Iframe implementation will cause loading failures.
Implementation Methods
Universal Popup Modal (Recommended)
This method works reliably across all browsers including Safari:
<a href="#" onclick="window.open('https://truetour.app/[PROPERTY-ID]',
'virtualtour', 'width=1024,height=768,resizable=yes'); return false;">
View Virtual Tour
</a>Why we recommend this approach:
- Works on all browsers without exceptions
- No CORS or cookie restriction issues
- Delivers the best performance
- Provides the smoothest user experience
What to consider:
- Opens in a new window or tab
- Users need popup blockers disabled
Adaptive Implementation (Advanced)
For developers who want browser-specific optimization:
function openVirtualTour() {
const tourUrl = 'https://truetour.app/[PROPERTY-ID]';
const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
if (isSafari) {
window.open(tourUrl, 'virtualtour', 'width=1024,height=768,resizable=yes');
} else {
document.getElementById('tour-container').innerHTML =
`<iframe src="${tourUrl}" width="100%" height="600" frameborder="0"></iframe>`;
}
}Then call the function with:
<button onclick="openVirtualTour()">View Virtual Tour</button>
<div id="tour-container"></div>Standard Iframe (Limited Compatibility)
⚠️ Warning: This implementation will not work on Safari or iOS devices.
<iframe src="https://truetour.app/[PROPERTY-ID]"
width="100%"
height="600"
frameborder="0"
allowfullscreen>
</iframe>Troubleshooting Common Issues
Tour won't load:
- Third-party cookie blocking is active—switch to popup modal implementation
- Check browser console (F12 or Right-click → Inspect) for error messages
Blank iframe appears:
- Cross-site tracking prevention is enabled—use Universal Implementation instead
"Refused to connect" error:
- CORS policy is blocking content—use popup modal or contact support
Works in Chrome but not Safari:
- Browser security differences—implement adaptive solution or universal popup modal
Mobile Device Considerations
- iOS devices: Must use popup modal implementation
- Small screens: Consider adding viewport meta tag for optimal display
- Touch gestures: All tour navigation supports touch interactions
- Data usage: Warn users about potential data consumption on cellular networks
Quick Diagnostics
If your virtual tour isn't working properly, follow these steps:
-
Check Browser Console (F12 or Right-click → Inspect)
- Look for red error messages
- Check for CORS or cross-origin errors
- Note any 403/404 status errors
-
Verify Implementation
- Confirm correct property ID in URL
- Ensure HTTPS is used (not HTTP)
- Check for typos in implementation code
-
Test Different Browser
- Works in Chrome but not Safari? Use popup implementation
- Doesn't work in any browser? Contact support
Need additional help? Submit a support ticket through our Support Request Form and our team will assist you promptly.