Zusammenfassung dieses Artikels

Confluence bietet die Möglichkeit an JavaScript im Makro "benutzerdefiniertes HTML" oder dem HTML Makro einzufügen. Wenn das JavaScript in das benutzerdefinierte HTML Makro eingefügt wird, wird dadurch das Laden des Scripts innerhalb der Seite ausgelöst. Beim HTML Makro wird nur der Script auf der entsprechenden Seite, auf der das Makro platziert ist, ausgeführt.

Die Lösung

JavaScript einfügen

Um JavaScript in das benutzerdefinierte HTML Makro einzufügen, gehen Sie zu "Confluence-Administration" > "Allgemeine Konfiguration" und "Benutzerdefiniertes HTML" und fügen Sie den Code in die Textbox "Am Ende der ÜBERSCHRIFT" ein. Stellen Sie sicher, dass der Code innerhalb der <script>-Tags ist, wie im folgenden Beispiel:

Im folgenden Beispiel ist unsere JavaScript-Datei unter <Confluence install>/Confluence/includes/js/code.js platziert

<script type"text/javascript" src="/conflunece/includes/js/code.js"></script>
code.js
alert("test alert");'
// more javascript!

Stellen Sie sicher, dass das HTML Makro aktiviert ist, bevor Sie JavaScript in das HTML Makro einfügen. Klicken Sie im Bearbeitungsmodus in Confluence auf "Einfügen" > "Andere Makros", suchen Sie nach dem HTML Makro und fügen Sie es in Ihre Seite ein. Innerhalb dieses Makros können JavaScript-Codes hinzugefügt werden, aber sie müssen, wie bereits beschrieben, innerhalb der <script>-Tags sein.

JQuery in Confluence verwenden

JQuery ist standardmäßig in Confluence enthalten. Auf seine Methoden kann über AJS.$ zugegriffen werden, womit das DOM durchsucht wird. Suchen wir einmal beispielhaft nach <div class="foo"> (z. B. ein <div>-Tag mit der Klasse foo) mit dem folgenden Code:

AJS.$('div.foo');

Bitte denken Sie daran die toInit Methode bei jedem AJS zu verwenden. Damit stellen Sie sicher, dass die JQuery-Codes nur ausgeführt werden, nachdem AJS erfolgreich initialisiert wurde. Um die toInit Methode zu verwenden inkludieren Sie folgendes:

AJS.toInit(function(){
      <!-- INSERT THE JS CODES HERE -->
});

Alle HTML/DOM Elemente innerhalb von Confluence können mithilfe von JQuery manipuliert werden. Bitte sehen Sie sich die JQuery Dokumentation an um eine Liste der Methoden zu erhalten, die DOM Elemente manipulieren können.

Anonyme Benutzer sollen ein anderes Erscheinungsbild sehen

Damit anonyme Benutzer ein anderes Erscheinungsbild von Confluence haben, können Sie folgenden JS Code hinzufügen:

AJS.tolnit(function(){
     if(AJS.params.remoteUser == "){
        <!-- INSERT THE JS CODES HERE -->
     }
});

Ein leeres remoteUser Objekt wird den anonymen Benutzern angezeigt. Jeder Benutzer, der sich erfolgreich eingeloggt hat, ist mit seinem Namen im remoteUser Objekt verzeichnet.

Wenn Sie beispielsweise das Browsemenü für die anonymen Benutzer ausblenden möchten, dann können Sie die folgenden JavaScript in die benutzerdefinierte HTML-Seite einfügen:

<script type="text/javascript">
     AJS.tolnit(function(){
           if (AJS.params.remoteUser == ")}
             AJS.$('#browse-menu-link').hide();
            }
     });
</script>

Alternativ können Sie auch das Confluence-Layout dazu verwenden den verschiedenen Benutzern ein anderes Erscheinungsbild zu zeigen: Wie man verschiedene Erscheinungsbilder für verschiedene Benutzer mit Confluence-Layouts anzeigen lässt.

JavaScript bei der Plugin-Entwicklung verwenden

Bitte lesen Sie die folgende Dokumentation für weitere Informationen dazu: JavaScript bei der Plugin-Entwicklung verwenden.