-
Notifications
You must be signed in to change notification settings - Fork 3
Pagemaker Iframes
Jonas Gossens edited this page Mar 27, 2018
·
18 revisions
This page will help you getting started with using iframes inside the chayns® Pagemaker.
-
What are pagemaker iframes?
Pagemaker iframes are widgets or even full projects that can be inserted into an existing pagemaker tapp. You're able to use the chayns® API in those iframes and you can add as many as you want to the tapp. -
How can I use them?
- As chayns® manager go to a pagemaker tapp
- Switch to the manager mode using the modeswitch
- Click the floatingButton to open the items menu
- Select the item with the angle brackets symbol (the iframe container will be added to the tapp)
- Now you can specify the source url to the resources and the height of the iframe
- Special case: chayns® API - If you want to use the api in the iframe click on the menu button and activate the chayns® API. The iframe will set some necessary url parameters to the url
- That's it! The iframe can now be seen by your users.
There are three options to configure for the iframe
- Height of the iframe (in px)
- URL (src attribute) of the iframe
- Use of the chayns® API (activate/deactivate)
The activation will add some required url parameters to the source url
The pagemaker iframes got some differences compared to casual tapps.
- Pagemaker Iframes got the tappid another way
You can get the tappid instead of chayns.env.site.tapp.id with chayns.env.site.tapp.parent.id. - Smaller width than casual tapps (since it's inside the tapp)
Keep in mind that the 'tapp'-class provides some distances to its surroundings. Remove the padding of the iframe for a proper design.
These are the challenges facing the usage of iframes inside the pagemaker.
- The iframe does not allow 'mixed content'-conflicts. chayns® sites without a ssl-certification are basically not allowed.
- The iframe got no autogrow functionality.
- The url parameters set if using the chayns® API could break external contents (e.g. facebook videos)
There is already a collection of ready-to-use samples you can add by url.
-
Sharingbar
Social media bar to share your chayns® site directly to the platforms. -
Google Navigator
Simple navigator widget to direct your users and customers to the desired location. It offers a preview of the aimed map area. -
Template
If you want to build your very own widget, check out this template. It will help you setting up a project using the chayns api as a pagemaker widget.
<!-- To get started.. -->
<!-- Load the chayns API styles and JavaScript from our server -->
<!-- css styles -->
<script src="https://api.chayns-static.space/css/v4/compatibility/compatibility.min.js" version="4.2"></script>
<!-- js api -->
<script src="https://api.chayns-static.space/js/v4.0/chayns.min.js"></script>