Einbindung der Covid-19 Karte auf einer Webseite
An dieser Stelle möchten wir Sie noch einmal motivieren, die neue Covid-19-Kartenanwendung (https://corona.conterra.de) publik zu machen. Helfen Sie mit, indem Sie den Link in Ihren Netzwerken teilen oder die Anwendung in Ihren digitalen Medien einbetten. Tragen Sie also dazu bei, die Öffentlichkeit informieren und schaffen Sie ein Stück weit Transparenz.
Die Covid-19-Kartenanwendung kann ganz einfach auf Ihrer Website oder in Ihrem mobilen Angebot eingebettet werden. Folgen Sie hierfür bitte der nachfolgenden Anleitung.
Und so funktioniert es
Die Covid-19 App kann ganz einfach auf Ihrer Homepage eingebettet werden. Dazu wird das HTML IFrame Element verwendet. Fügen Sie dazu folgendes Code-Snippet in Ihre Webseite ein.
<iframe class="corona-webapp" src="https://corona.conterra.de" width="100%" height="800" allow="geolocation" style="border:none" >
Sorry your browser does not support inline frames.
</iframe>
Für mobile Endgeräte können Sie der Covid-19 App mit Hilfe einer CSS Media Query eine optimierte Höhe mitgeben. Dazu fügen Sie in der verknüpften CSS Datei folgende Media Query hinzu.
@media only screen and (max-width: 430px) {
.corona-webapp {
height: 600px !important;
}
}
Eine kleine Ergänzung:
Die Covid-19-Karte kann auch so eingebettet werden, dass beim Start direkt eine bestimmte Stadt oder ein Landkreis zentriert wird. Dazu kann der Parameter q=Suchbegriff an der URL ergänzt werden.
Beispiel für Berlin: https://corona.conterra.de/?lang=de&q=Berlin
Hinweis: Es wird immer das erste Suchergebnis verwendet, daher kann es manchmal vorkommen, dass nicht die gewünschte Stadt getroffen wird.
Beispiel Münster vs. Kreisfreie Stadt Münster: https://corona.conterra.de/?lang=de&q=M%C3%BCnster. In diesem Fall sollte man einen vollständigen Suchbegriff wählen, wie https://corona.conterra.de/?lang=de&q=Kreisfreie%20Stadt%20M%C3%BCnster.
Direkt zur App
Informationen zur Covid-19-Karte
Mehr Informationen zu dieser Covid-19 Karte finden Sie unter https://www.conterra.de/aktuelles/news/covid-19news.
