Easily embed a PDF file or another webpage within your stacks page. This free Embed stack cuts out the requirement for any complicated code or tedious scripts. It instead uses the widely-supported HTML
Embed Embedding webpages and PDF's really shouldn't be rocket science.
<object>tag which works great with all modern web browsers and does not cause validation errors or breakage to RapidWeaver themes.
Webpages get rendered safely, similar to an iFrame, and there is little risk of code in the framed webpages from leaking out into your web page. PDF files get rendered in a frame, complete with scrollbars. You can specify a width and height for the Embed stack, within the provided settings. Likewise settings also exist to display a customisable error message and specify the type of document to be loaded. Setup is simple and straightforward. You can safely use multiple Embed stacks on the same page.
- Once installed, drag and drop an Embed stack into your stacks page.
- In the Embed settings shown on the righthand side in edit mode, enter the URL of the webpage or PDF you wish to embed. Type this address carefully, to ensure it is correct.
- Optionally, you can customise the error message. This is the error message displayed if a web browser does not support frames or has live viewing of PDF's turned off.
- Use the provided height and width settings to define the height and width of your embed stack (take care to ensure the embed stack does not overflow outside of the theme content container).
Source CodeThis is the source code used to create each Embed stack. As you can see, it uses the HTML
<object data="http://www.example.com/path/to/file.pdf" type="application/pdf" width="800px" height="600px">In the above code, change the URL
Trouble viewing the PDF? Click here instead: http://www.example.com/path/to/file.pdf
http://www.example.com/path/to/file.pdfto the name and location of your stored webpage or PDF file. If you are embedding a webpage, change
This code can be saved as code snippets in RapidWeaver, for use in non-stack pages. To do this, highlight the code in your web browser and then right-click on it. Select Copy from the popup menu, to save it to your clipboard. In RapidWeaver, open the snippets window by clicking View > Show Snippets from the RapidWeaver menu. In the snippets window, click the '+' button, in the bottom left. Type a name for the new snippet and paste the code into the box shown. From this point onwards, you will be able to easily retrieve code snippets in RapidWeaver and reuse them in different pages. You can customise the code to suit your requirements.