You can use an inline frame (iframe) to embed a web application created with SpreadsheetWEB into your own website. All of the application features will be available in the embedded web application.
If you embed a restricted application (Restricted or Restricted with Registration), you will see the SpreadsheetWEB login screen if you are not authenticated in the system. You will be able to use the application once you log in. Unrestricted applications will load automatically when a user goes to the page with the embedded code.
Code
An inline frame, or an iframe is marked up as,
<iframe src="http://www.yourapplication.com"></iframe>
The <iframe> tag here means an inline frame and the src attribute is where you need to enter the application’s URL.
You can use the style attribute to customize the inline frame element. Some commonly used properties are given below:
| Attribute | Parameters | Description |
| text-align | center, left, right, justify | aligns the iframe based on other elements. |
| width | number value for pixels or percentage | the total width the embedded application will have on your web page. |
| height | number value for pixels or percentage | the total height the embedded application will have on your web page. |
| border | border-width, border-style, border-color properties | determines the properties of the border surrounding the iframe. |
| scrolling | overflow-y and overflow-x – scroll, hidden, auto, visible | determines the scroll bar properties for vertical and horizontal overflow in the iframe. |
| name | HTML name of the iframe | enter a text to give the inline frame a name. |
Typically, elements are controlled via style properties, like:
<iframe src="http://www.yourapplication.com" style=”height: 600px; width: 80%; border=0px;”></iframe>
The code above will pack the web application into a frame with the specified ratios in the height and width properties. Entering only a number will indicate that the value is in pixels, whereas the percentage sign will fit into a percentage of the occupying area.
In an iframe, the use of properties can be very important for the aesthetic and accessibility. You might want to add and adjust these parameters accordingly, so that the application will not overlap with other elements and be clearly visible. For example, if the "width" and the "height" do not match the size of the outer container, the scroll bars will appear even if the overflow is disabled.
If you’d like to see an embedded SpreadsheetWEB application in action, check out our demo applications page.
