Ausgangslage

Sie haben Liveblogs oder Newsblogs der dpa implementiert und gegebenenfalls über den dpa-Shop bezogen. Sie wurden von dpa dazu aufgefordert, die Embed Codes zu tauschen, oder Sie haben die Meldung, dass eine Migration seitens dpa vollzogen worden ist, auf anderen Wegen erhalten. Sie haben möglicherweise auch festgestellt, dass die Liveblog-Embeds der dpa in Ihren digitalen Artikeln Fehler erzeugen.


Für all diese Szenarien stellt dieser Eintrag eine Hilfestellung dar und eine Anleitung, wo sie die relevanten neuen Embed Codes finden, um sie in Ihr CMS einzubinden.


Hinweis

Die neuen Embed-Codes stehen seit dem 21.04.2023 zur Verfügung. 

Test-Code für die neuen Embeds


Sie haben hier die Möglichkeit, einen neuen Embed-Code zu testen und sicherzustellen, dass er in Ihren Systemen richtig angezeigt wird. 


Es handelt sich um den Liveblog zum bundesweiten Warnstreik vom 27.03.2023. Den Embed-Code können Sie hier via copy paste entnehmen:


<div data-app='dpa-liveblog' data-embed-type='dom' data-competition-id='640b1661b1a3ea4582cce548'></div>

<script type="text/javascript" src="https://core.dpa-infocom.net/js/dpa.js"></script>


Überprüfen der betroffenen Blogs

Gehen Sie auf die dpa-Shop-Seite und wählen Sie oben im Menü „Anmelden“ aus. Melden Sie sich an.



Gehen Sie mit der Maus über Ihren Namen oben rechts im Menü. Es erscheint ein dunkles Menü. Klicken Sie jetzt auf „Meine Produkte“. Sie landen in einem neuen Fenster, welches Ihnen alle Ihre verfügbaren Produkte im dpa-Shop anzeigt



Suchen Sie jetzt über STRG+F nach „Blog“. Die Liste wird Ihnen alle Blogs anzeigen, die unter Ihren Produkten zu finden sind. Sie können sich jetzt mit den Pfeiltasten von oben nach unten durch alle Suchergebnisse zu Blogs klicken.




Embeds einzelner Blogs tauschen

Mit Klick auf "Embed-Code" am Ende der Zeile gelangen Sie jetzt auf eine Set-up-Seite. Dort können Sie den neuen Embed-Code kopieren.



Wählen Sie hier unter "Einbindung" zunächst die Konfiguration aus, die Sie für den Embed-Code nutzen wollen (DOM, DOM-Tickaroo., AMP-Iframe). Über "Embed-Code" kopieren Sie sich anschließend den neuen Embed-Code in die Zwischenablage. Tauschen Sie diesen gegen den alten Embed-Code des betroffenen Blogs in Ihrem CMS aus.


Führen Sie das Prozedere für jeden Blog durch, für den Sie einen neuen funktionierenden Embed-Code haben wollen.


CSS-Styling

Dieser Abschnitt soll Ihnen bei der Anpassung Ihrer Liveblogs helfen, falls Sie Probleme bei der Skalierung auf Ihrer Website haben.


Fontgrößen und Liveblog-Skalierung

In den meisten Fällen sollten Sie keine eigenen CSS Anpassungen machen müssen. Allerdings kann es bei der Einbindungen ohne eigene CSS-Styles zu Darstellungsproblemen kommen. Begründet ist dies durch die dynamische Einbindung des Embeds in den DOM der jeweiligen Website und nicht als separates Iframe.


Alle Schriftgrößen, Abstände und andere Elemente des Liveblogs hängen von einer zentral definierten Skalierungsvariablen (-4-sc: 1) innerhalb des .tik4-Selektors ab.


Beispiel: --t4-txt-base: calc(var(-t4-sc) * 1rem)


Der Liveblog ist für die Standardschriftgröße des Browsers von 16px optimiert. Einige Websites setzen jedoch die Schriftgröße des HTML-Dokuments auf 10px. In diesem Fall wird das Liveblog unweigerlich zu klein dargestellt. Um dem entgegenzuwirken, setzen Sie einfach die Skalierungsvariable auf 1.6

Beispiel HTML-Dokument Schriftgröße 16px (100% Skalierung):

.tik4 {

--t4-sc:1;

}


Beispiel HTML-Dokument Schriftgröße 16px (160% Skalierung):


.tik4 {

--t4-sc:1.6;

                }


Haben Sie weitere Fragen wenden Sie sich bitte an: service@dpa-info.com