Met aangepaste widgets kunt u de functionaliteit van de beschikbare inhoud in uw startpagina's uitbreiden naar uw specifieke organisatie- en cursusbehoeften. U kunt aangepaste HTML-code toevoegen om een breed scala aan widgets te maken. U kunt aangepaste widgets voor uw cursussen maken of aangepaste widgets gebruiken die met uw cursusedities zijn gedeeld op het niveau van organisatie, afdeling of semester.
|
Opmerking: Uw beheerder heeft er mogelijk voor gekozen om een extra beveiliging te implementeren voor aangepaste widgets. Die extra beveiliging wordt 'sandboxing' genoemd. Wanneer een aangepaste widget in een sandbox wordt geplaatst, wordt een veilig iFrame rond de widget gemaakt en kunnen scripts niet buiten de widget worden uitgevoerd. U kunt zien of een widget al dan niet in een sandbox staat in de lijst met aangepaste widgets. Widgets die niet in een sandbox zijn geplaatst, zijn niet per se onbeveiligd, maar mogen alleen worden gemaakt door vertrouwde rollen. |
In de lijst met widgets staat bij niet-gesandboxte widgets een waarschuwingspictogram:
|
Opmerking: als u widgets aan uw startpagina wilt toevoegen, moet u uw startpagina instellen op Afhankelijk van widget. Raadpleeg Widgets toevoegen aan uw startpagina voor nadere details. |
Een aangepaste widget maken
- Klik op de startpagina van uw cursus op Cursusbeheer > Widgets.
- Klik op Widget maken.
- Voer op het tabblad Eigenschappen een naam en beschrijving voor de widget in.
- Als u uw eigen HTML-inhoud aan de widget wilt toevoegen met de HTML-teksteditor, klikt u op het tabblad Inhoud >
het pictogram HTML-teksteditor. Voeg uw aangepaste HTML-code toe.
- Klik op Widgetstijl aanpassen om verschillende stylingopties op de widget toe te passen.
- Voer in Widgetinstellingen een van de volgende handelingen uit:
- Als u de titelbalk wilt verbergen, schakelt u het selectievakje Titelbalk weergeven uit.
- Als u sandboxing van widgetinhoud wilt inschakelen, klikt u op Widget staat in sandbox en/of Weergeven in iFrame om deze opties te selecteren.
| Opmerking: Als uw rol geen machtiging heeft om deze instelling in of uit te schakelen, maar u denkt dat uw widget niet in een sandbox moet worden geplaatst om zich zoals verwacht te gedragen, neemt u contact op met een beheerder met de machtiging Beveiliging voor widgets. |
- Als u de standaardstijl van de rand wilt verwijderen, schakelt u het selectievakje Widget-containerstijlen weergeven uit.
- Selecteer Minimaliseren van widgets verbieden om te voorkomen dat gebruikers de widget op de startpagina sluiten.
- Als u een aangepaste titel wilt instellen, selecteert u in het gedeelte Widgetnaam het keuzerondje Aanpassen. Voer uw tekst in het veld in.
- Klik op Opslaan. Als u releasevoorwaarden aan de widget wilt toevoegen, klikt u op het tabblad Releasevoorwaarden en voert u een van de volgende handelingen uit:
- Klik op Bestaande bijvoegen en selecteer vervolgens een van de bestaande releasevoorwaarden die beschikbaar zijn voor de organisatie-eenheid. Klik op Opslaan. Selecteer uit de vervolgkeuzelijst ofwel Er moet worden voldaan aan alle voorwaarden of Er moet worden voldaan aan een van de voorwaarden.
- Klik op Maken en bijvoegen om een releasevoorwaarde te maken en deze toe te voegen. Klik op Maken. Selecteer uit de vervolgkeuzelijst ofwel Er moet worden voldaan aan alle voorwaarden of Er moet worden voldaan aan een van de voorwaarden.
- Klik op Opslaan en sluiten.
Externe CSS en JavaScript toevoegen aan een widget
Aangepaste widgets in Brightspace® stellen u in staat om de startpagina van uw cursus te personaliseren met unieke inhoud en functionaliteit. De standaardwidgeteditor ondersteunt HTML en interne stijlen, maar u kunt uw widgets verbeteren door externe CSS- en JavaScript-bestanden te koppelen.
Door externe bronnen te gebruiken, kunt u geavanceerdere stijlen en meer interactiviteit toepassen, en bovendien uw widgetinhoud gemakkelijker onderhouden.
Waarom zou ik externe bronnen toevoegen?
Door externe CSS- en JavaScript-bestanden te koppelen, kunt u:
- Dynamisch gedrag toevoegen met behulp van JavaScript, zoals animaties of interactieve elementen.
- Aangepaste stijlen toepassen met externe CSS, die verder gaat dan het standaardthema van Brightspace®.
- Ontwerpupdates centraliseren door stijlen en scripts op één locatie te beheren.
Voordat u begint
Wanneer u externe CSS- en JavaScript-bestanden aan een aangepaste widget koppelt, moet u beslissen:
- Waar u uw widgetbestanden opslaat:
- Op cursusniveau, voor widgets die in één cursus worden gebruikt.
- Op organisatieniveau (openbare bestanden), voor widgets die in meerdere cursussen worden gedeeld.
- Hoe u naar die bestanden verwijst in HTML van de widget met behulp van het juiste relatieve pad.
In de volgende secties vindt u stapsgewijze instructies voor beide opties.
Widgets opslaan op cursusniveau
Opslag op cursusniveau is het beste voor widgets die in één cursuseditie worden gebruikt.
Stap 1: Upload uw bestanden
- Ga naar Cursusbeheer > Bestanden beheren.
- Maak een nieuwe map om uw widgetbestanden in op te slaan (bijvoorbeeld ClickAndReveal).
- Upload uw CSS- en JavaScript-bestanden.
|
Tip: Maak uw bestanden in een code-editor voordat u ze uploadt (bijvoorbeeld click-reveal.css en click-reveal.js). |
Stap 2: Open de HTML-editor voor widgets
- Ga naar Cursusbeheer > Widgets.
- Maak een nieuwe aangepaste widget of bewerk een bestaande widget.
- Selecteer het tabblad Inhoud.
- Wissel naar de HTML-teksteditor.
Stap 3: Koppel externe CSS- en JavaScript-bestanden
- Ga naar Cursusbeheer > Informatie cursuseditie.
- Kopieer het pad naar de cursuseditie dat op de pagina wordt weergegeven.
- Koppel in de HTML-sectie <head> in de widget uw bestanden met behulp van het pad naar de cursuseditie, gevolgd door uw mapstructuur.
Afbeelding: Voorbeeld van de koppeling tussen externe CSS- en JavaScript-bestanden in de HTML-sectie <head> van de widget met behulp van het pad naar de cursuseditie.
Stap 4: Bouw uw widget
Gebruik de HTML-editor om uw widgetinhoud toe te voegen. De gekoppelde CSS- en JavaScript-bestanden beheren de stijl en het gedrag van de widget.
Widgets opslaan in Openbare bestanden (organisatieniveau)
Door widgets op te slaan in Openbare bestanden kunt u ze in meerdere cursussen hergebruiken. Voor deze optie zijn doorgaans beheerdersmachtigingen vereist.
Stap 1: Upload uw bestanden
- Klik op het tandwielpictogram Beheer op de Brightspace®-minibalk.
- Selecteer Openbare bestanden.
- Maak een nieuwe map om uw widgetbestanden in op te slaan (bijvoorbeeld ClickAndReveal).
- Upload uw CSS- en JavaScript-bestanden.
|
Tip: Maak uw bestanden in een code-editor voordat u ze uploadt (bijvoorbeeld click-reveal.css en click-reveal.js). |
Stap 2: Open de HTML-editor voor widgets
- Ga naar Beheer startpagina.
- Selecteer het tabblad Widgets.
- Maak een nieuwe aangepaste widget of bewerk een bestaande widget.
- Zoek op het tabblad Eigenschappen de optie Widget beschikbaar maken voor en klik op Organisatie-eenheden toevoegen.
- Selecteer de organisatie-eenheden waarvoor u de widget beschikbaar wilt maken.
- Selecteer het tabblad Inhoud en wissel naar de HTML-broneditor.
Stap 3: Koppel externe CSS- en JavaScript-bestanden
Koppel in de HTML-sectie <head> van de widget de bestanden die in Openbare bestanden zijn opgeslagen met behulp van een relatief pad dat met /shared, begint, gevolgd door uw mapstructuur.
|
Tip: Het pad naar /shared is hoofdlettergevoelig. |
Afbeelding: Voorbeeld van de koppeling van externe CSS- en JavaScript-bestanden die in Openbare bestanden zijn opgeslagen met behulp van een /shared-pad.
Stap 4: Bouw en implementeer uw widget
Gebruik de HTML-editor om uw widgetinhoud toe te voegen. Zodra de widget is voltooid, voegt u deze toe de juiste startpagina zodat deze voor cursisten of instructeurs wordt weergegeven.