In this article, we will show you how to prevent direct access to the HTML files while allowing them to be viewed via an iFrame.
- Protect folder containing HTML files
- Embed HTML files into content using iFrame tag
- Whitelist your domain or content URLs
Requirements:
- PDA Access Restriction version 1.3.0 or greater
- Prevent Direct Access Gold version 3.1.4 or greater
Video Walkthrough
This video takes you through the process of protecting PDF files embedded inside an iframe.
The following steps take you through the same sequence as shown in the video:
1. Protect folder containing HTML files
First of all, upload and store all your private files in a folder under WordPress root directory or wp-content/uploads.
Activate our plugins and navigate to Prevent Direct Access Gold >> Settings menu from your admin dashboard.
Switch to “Folder Protection” tab and select which folder you want to protect.
Once protected, only authorized people, e.g. admin users can access your private files directly. Other people will be redirected to the 404 error page or a custom “No Access” page.
2. Embed HTML files into content using iFrame tag
Create or edit a page and insert your HTML file into content using iFrame as image shown below.
An inline frame is marked up as follows:
<iframe src="your-html-file" width="100%" height="auto"></iframe>
3. Whitelist your domain or page URLs
In order to enable your protected files to display on your website only, you can set your domain or the content URLs as the whitelisted referrer links.
So your customers will be able to view the protected HTML file under an iframe from these specified links only.
If you insert your files to a lot of pages, it’s better if you whitelist all page URLs from your domain, e.g. http://demo.bwps.us/*
Check out this Prevent Direct Access demo page to see the feature in action.
Check out this Prevent Direct Access demo page to see the feature in action. (protected image URL)
