18. | OJS HTML-Anzeige

Zeitschriftenartikel können auf der Plattform Open Journal Systems (OJS) sowohl im PDF-, als auch im HTML- und JATS XML-Format angezeigt werden. Die Anzeige von HTML-Artikelversionen ermöglicht dabei das vom Public Knowledge Projekt (PKP) entwickelte OJS-Plugin HTML Article Galley (DE = HTML-Artikelfahne). Nativ erfolgt dabei die Anzeige der Artikel auf einer neu geladenen, leeren, weißen Seite (Abb. 1A).

Im Rahmen des Projekts Modernes Publizieren haben wir ein OJS-Zeitschriftentemplate nach “state of the art”-Kriterien des wissenschaftlichen Publizierens entwickelt. Dieses Template ermöglicht u. A. die Anzeige von Artikel-HTMLs direkt im Kontext der Zeitschrift (Abb. 1B).

HTML-Artikelsansicht in (A) nativer Darstellung des OJS-Plugins “HTML Article Galley” und (B) im Kontext der Zeitschrift

Abb. 1: HTML-Artikelsansicht in (A) nativer Darstellung des OJS-Plugins “HTML Article Galley” und (B) im Kontext der Zeitschrift

Darstellung

Wie in Abb. 1B zu sehen wird das Artikel-HTML in der von uns entwickelten Lösung im identischen Kontext angezeigt wie die klassische OJS-Artikelvorschau. Dabei bleiben alle Zeitschriftenbestandteile wie Header, Menü, Seitenleiste und Footer weiterin sichtbar. Die HTML-Artikelansicht ist dadurch eindeutig mit der Zeitschrift verbunden. Wichtige Metadaten wie Band, Ausgabe, Datumsangaben, CC-Lizenz oder der Zitationsvorschlag werden weiterhin angezeigt. Zusätzliche Dateien wie Supplements (z. B. AV-Dateien) und Artikel-Metriken sind weiterhin direkt abrufbar.

Ein Großteil der Artikel-Metadaten inklusive des Artikel-Titels und ggf. Untertitels wird weiterhin durch die OJS-Oberfläche angezeigt. Folgende Metadaten sind jedoch Teil des Artikel-HTMLs:

  • Autor:innen-Namen, -Affiliation, -ORCID iD
  • Korrespondez-E-Mail-Adresse
  • Schlagworte
  • Gutachter:innen, -Affiliation, -ORCID iD
  • Abstract
  • Autor:innenbeiträge
  • Statement zur Datenverfügbarkeit
  • Statement zur Finanzierung der wissenschaftlichen Arbeit
  • Statement zu Interessenkonflikten

Die HTML-Artikelansicht wird geöffnet, wenn Leser:innen auf den HTML-Button in der rechten Seitenleiste klicken (Abb. 1B). Um von der HTML-Ansicht eines Artikels zur Artikelvorschau zurückzukehren, haben wir ebenfalls in der Seitenleiste einen entsprechenden Button im Template unseres Themes integriert.

In der Zeitschrift kommunikation@gesellschaft wurde diese Anzeige erfolgreich in der aktuellen OJS Version (v3.2.1) umgesetzt.

Technische Umsetzung

Die technische Umsetzung basiert auf einer Entwicklung des Nordic Open Access Scholarly Publishing (NOASP) Verlags, der u. A. die OJS-Zeitschrift Forskning & Forandring publiziert und eine integrierte HTML-Artikelansicht erfolgreich umgesetzt hat. Im Rahmen des Projektes haben wir darauf basierend eine angepasste Lösung entwickelt.

Die Darstellung des HTML Article Galley Plugins wird über ein spezifisches Template gesteuert (display.tpl). Das Template ist somit Grundlage für alle Anpassungen der HTML-Artikeldarstellung:

./plugins/generic/htmlArticleGalley/templates/display.tpl  

Falls ein Theme mit eigenem Template zum Einsatz kommt, muss die Anpassung in der entsprechenden *.tpl-Datei des Themes erfolgen. Z. B. beim Classic-Theme:

./plugins/themes/classic/templates/plugins/generic/htmlArticleGalley/templates/display.tpl

Dem Template für die HTML-Artikeldarstellung (display.tpl) fehlen per default “header” und “footer”. Das jeweilige Template der OJS-Artikelvorschau (article_details.tpl) kann als Schema verwendet werden, um die Darstellung nach diesem Vorbild anzupassen. An der Stelle, an der normalerweise die Autor:innennamen ausgegeben werden, wird ein Platzhalter (htmlContainer) eingefügt:

[...]

<div class="row">
    <div class="main_entry">
        <!-- sub-oh Hierhin kommt der Inhalt der HTML-Datei -->
        <div class="item" id="htmlContainer" style="padding: 0;">
            <div style="padding: 30px;">
                <i class="fa fa-spinner fa-spin" style="font-size: 3em;"></i>
                <p>To see the page, Javascript must be enabled.</p>
                {assign var="articleId" value=$article->getBestId()}
                <p>Alternatively, you can download the <a href="{url page="article" op="download" path=$articleId|to_array:$galley->getBestGalleyId() inline=true}">raw html article</a></p>
            </div>
        </div>
[...]

Am Ende des Templates (display.tpl) wird dieser Container per Javascript gefüllt:

[...]
        {call_hook name="Templates::Article::Footer::PageFooter"}
        {include file="frontend/components/footer.tpl" noClosing=true}

<script>
$.get("{url page="article" op="download" path=$articleId|to_array:$galley->getBestGalleyId()} inline=true", function(data) {
        var articleBody = data.replace(/^.*?<body>(.*?)<\/body>.*?$/s,"$1");
  
        var domNodes = $(articleBody); 
        domNodes.find('table').wrap('<div class="table-scrollable"></div>');
        domNodes.find('.page_title').remove();
        domNodes.find('.subtitle').remove();

        $("#htmlContainer").html(domNodes);
}, 'html');
</script>

</body>
</html>
[...]

Mittels Javascript werden folgende Punkte gesteuert:

  1. Das Dokument wird per http-Request heruntergeladen. Dadurch ist sichergstellt, dass die Ansicht bzw. das Herunterladen des HTMLs durch die OJS-Statistik erfasst wird.
  2. “Footer” und “header” der Artikel-HTML-Datei werden entfernt.
  3. Artikel-Titel und ggf. auch -Untertitel werden entfernt.
  4. Eine Klasse table-scrollable wird um die Tabellen gewrappt.

Alle Styles der HTML-Darstellung, z. B. um die Tabellen scrollbar zu machen, stehen in einer speziellen less-Datei im OJS-Theme. Alternativ könnte man diese auch direkt im CSS-Syntax ins Template (display.tpl) schreiben. Die Styles können bei jedem OJS-Theme anders sein, d.h. sie müssen ggf. individuell anpassen werden.

Den Button, zurück zur Artikelvorschau, haben wir wie folgt im Theme integriert:

<div class="item backlink">
    <a href="{url page="article" op="view" path=$article->getId()}"><span class="fa fa-arrow-left"></span> {translate key="plugins.themes.modpub-theme.backLink"}</a>
</div>

In Band 18-21 der Zeitschrift kommunikation@gesellschaft kann die hier vorgestellte Lösung zur integrierten Darstellung von Artikel-HTMLs angesehen werden.

Feedback und Weiterentwicklung der HTML-Artikeldarstellung sind sehr willkommen!

Kontakt: Olaf Hilbig (GitHub)

Avatar
Dr. Tim Boxhammer
Naturwissenschaftler, HOS-Journalhosting, Kommunikation & Akquise

Tim Boxhammer ist promovierter Naturwissenschaftler und begleitet im Rahmen von Hamburg Open Science innovative Entwicklungen für Open-Access-Zeitschriften im HOS-Journalhosting

Ähnliches