diff --git a/general/app/development/link-handling/app-links.md b/general/app/development/link-handling/app-links.md index 0f1c9f284..7e4795545 100644 --- a/general/app/development/link-handling/app-links.md +++ b/general/app/development/link-handling/app-links.md @@ -11,7 +11,7 @@ tags: When a user presses a link in the Moodle app, the behaviour changes depending on whether the URL is supported by the app or not: - If the URL belongs to the same site and it's supported by the app, then the app will try to open the corresponding page. For example if the user presses a link to an assignment, then the assignment will be opened inside the app rather than opening a browser. -- If it's a URL pointing to an external site or it's a URL not supported by the app, then it will be opened in an external browser. This can also be configured to [open in an embedded browser](#opening-links-in-an-embedded-browser). For example admin settings aren't supported by the app, so clicking a link to an admin settings page will open the page in an external browser. +- If it's a URL pointing to an external site or it's a URL not supported by the app, then it will be opened in an external browser. This can also be configured to [open in an embedded browser](#opening-links-in-an-embedded-browser-or-in-an-iframe). For example admin settings aren't supported by the app, so clicking a link to an admin settings page will open the page in an external browser. - If it's a URL pointing to a local file it will be opened with an external app in Android, and an embedded viewer in iOS. For example opening a PDF within a SCORM package would open a PDF reader in Android or and embedded PDF viewer in iOS. - If the link is inside an iframe (and is not pointing to a local file), it will be opened within the same iframe. This behaviour can be changed by setting the link's `target` attribute to anything other than `_self`, in which case the URL will be opened in an external browser. For example, clicking a link with a `target="_blank"` attribute would open the URL in an external browser. @@ -19,18 +19,28 @@ When a user presses a link in the Moodle app, the behaviour changes depending on The app has a defined list of supported URLs. If you have a plugin adapted to work in the app and you want to support links to your plugin you will need to create a Link Handler. For more information and examples about this, please see the [CoreContentLinksDelegate](../plugins-development-guide/api-reference.md#corecontentlinksdelegate) documentation. -## Opening links in an embedded browser {/* #opening-links-in-an-embedded-browser */} +## Opening links in an embedded browser or in an iframe {/* #opening-links-in-an-embedded-browser-or-in-an-iframe */} -To open a link in an embedded browser instead of an external browser you can use the `data-open-in` attribute: +To change how links are opened in the app you can use the `data-app-open-in` attribute: ```html - + ``` +Possible values are: + +- `inappbrowser`: Opens the link in an embedded browser instead of external browser. +- `embedded`: Displays the site inside the app, using an iframe. Only works in Moodle app 5.2 or later. +- Any other value: Opens the link in external browser (e.g. Chrome or Safari). + :::note[Notice] Please notice that students cannot add data attributes to HTML elements when using the Moodle editor, only teachers and users with the right permissions are able to add them. ::: +:::note[Notice] +Please notice that the `data-app-open-in` name will only work in Moodle app 5.2 or later. In previous versions, the name was `data-open-in`, which is deprecated. +::: + ## Adding links to any HTML element {/* #adding-links-to-any-html-element */} Using the `data-app-url` attribute you can also add a link to any HTML element. This link will only be used when the element is clicked in the app, it won't affect the behaviour when using a browser. @@ -55,16 +65,16 @@ When the link above is clicked in browser it will open `https://domain.com`, but The behaviour can be customised with the following data attributes: -- `data-open-in`: Set it to "app" to open the page in an embedded browser instead of the system browser. -- `data-app-url-confirm`: A confirmation message to be displayed before opening the browser. -- `data-app-url-resume-action`: Set it to "refresh" to update the course page when the user goes back to the app. Right now this only works in the course page, but in the future it might be added to other pages. +- `data-app-open-in`: To change how the link is opened in the app. Please see [Opening links in an embedded browser or in an iframe](#opening-links-in-an-embedded-browser-or-in-an-iframe) to view the possible values. +- `data-app-url-confirm`: A confirmation message to be displayed before opening the link. +- `data-app-url-resume-action`: Set it to "refresh" to update the course page when the user goes back to the app. Right now this only works in the course page, but in the future it might be added to other pages. It only works for embedded browser or system browser, it doesn't work if `data-app-open-in="embedded"`. An example using all the attributes: ```html