Dette er et demo-site lavet med Umbraco for at vise Septima Widget. Læs mere om sitet

Demo-guide

Til Septima-medarbejdere: sådan demonstrerer du Septima Widget i Umbraco.

Denne side er primært for medarbejdere hos Septima, der skal vise kunder, hvordan Septima Widget fungerer sammen med Umbraco.

Det skal du have

  1. En bruger i Umbraco-backoffice for at kunne rette sider. På det offentlige testsite (widget-umbraco-plugin.k8s-test-132.septima.dk) får du login til backoffice fra teamets password manager eller fra driftsteamet. På det lokale Docker-testsite oprettes en udviklerbruger automatisk – login-oplysningerne står i testsite/README.md i kildekoden. Adgangskoder offentliggøres ikke her.
  2. En GitHub-bruger med adgang til Widget Admin Test (widgetadmin3.k8s-test-132.septima.dk) for at oprette og redigere widgets. Widget Admin logger ind med GitHub. Mangler du adgang, så kontakt den ansvarlige for Widget Admin hos Septima.

Demo trin for trin

  1. Åbn forsiden på det offentlige testsite (eller start det lokale med docker compose up -d --build). Vis at det er en helt almindelig hjemmeside.
  2. Åbn Kort og data og vis de to kort på den offentlige side.
  3. Log ind i backoffice og åbn siden Kort og data under Content.
  4. Vis at kortet i brødteksten fremstår som en blok – ligesom et billede – med forhåndsvisning.
  5. Placér markøren i teksten og klik på knappen Septima Widget i værktøjslinjen (kort-ikonet).
  6. Klik Opret ny widget. Plugin'et genererer et Widget-ID og åbner Widget Admin i en ny fane – log ind med GitHub, hvis du bliver bedt om det.
  7. Konfigurér kortet i Widget Admin (lag, udsnit, kontroller) og publicér det.
  8. Gå tilbage til Umbraco, klik Genindlæs forhåndsvisning (↻) og derefter Indsæt.
  9. Klik Save and publish og vis siden på hjemmesiden. Kortet vises, fordi plugin'et automatisk indsætter Septima Widget-scriptet.
  10. Vis til sidst, at ændringer i Widget Admin slår igennem på hjemmesiden uden at siden i Umbraco skal genudgives.

Tip: Har du ikke adgang til Widget Admin, kan du stadig demonstrere ved at skrive et eksisterende Widget-ID i dialogen, fx 0o4wmo eller hubd.

Sådan ser det ud for en administrator

Knappen i Rich Text Editoren

Kortet i brødteksten vises som en blok med forhåndsvisning. Knappen Septima Widget ligger yderst i værktøjslinjen.

Rich Text Editor med Septima Widget-knappen og en indsat widget

Widget-dialogen

Her angives Widget-ID og højde – eller der oprettes en ny widget i Widget Admin. Dialogen viser en forhåndsvisning af den publicerede widget.

Dialogen til at indsætte eller redigere en Septima Widget

Opret ny widget

Efter klik på Opret ny widget har plugin'et genereret et Widget-ID ud fra titlen, og Widget Admin er åbnet i en ny fane. Widget Admin kræver login med en GitHub-bruger med adgang til testinstansen.

Dialogen efter klik på Opret ny widget med genereret Widget-ID

Kort som egenskab på dokumenttypen

Et kort kan også være en fast egenskab på en side (her Kort på dokumenttypen Tekstside).

Septima Widget-egenskaben i backoffice

Den publicerede side

Den offentlige side med et Septima Widget-kort