Wartungsmodus-Template in Contao 4 anpassen
Wenn der Wartungsmodus aktiviert ist oder auf der Contao-Webseite ein Fehler auftritt, erscheint immer das Standard-Wartungsmodus-Template von Contao. Doch wie kann man das anpassen?
Für Contao 4.9+:
Um das Template für den Wartungsmodus und Fehlermeldungen anzupassen, musst du lediglich das Template layout.html.twig anpassen. Dazu legst du das Template unter folgender Ordnerstruktur an: templates/bundles/ContaoCoreBundle/Error/layout.html.twig
.
Ab Contao 4.11 ist es auch möglich das Template direkt im Backend unter Templates zu bearbeiten. In der aktuellen LTS Version Contao 4.13 kann das Wartungsmodus Template ebanfasslls so angepasst werden.
Nach Anlegen der Datei ist es noch nötig den Produktions-Cache im Contao Manager zu leeren.
Texte anpassen:
Um die Texte für den Wartungsmodus anzupassen, bearbeitest du unter system/config die Datei langconfig.php. Wenn die Datei noch nicht existierst legst du sie einfach an. Füge dort folgenden Inhalt ein, anschließend muss im Contao Manager wieder der Produktions-Cache geleert werden.
$GLOBALS['TL_LANG']['XPT']['unavailable'] = 'Webseite in Wartung';
$GLOBALS['TL_LANG']['XPT']['maintenance'] = 'Aktuell werden an der Webseite Wartungsarbeiten durchgeführt. Die Seite sollte bald wieder erreichbar sein, schaue gern wieder zu einem späteren Zeitpunkt vorbei.';
layout.html.twig
{% trans_default_domain 'contao_exception' %}
<!DOCTYPE html>
<html lang="{{ language }}">
<head>
{% block head %}
<meta charset="utf-8">
<title>{% block title %}{{ statusCode }} Error{% endblock %}</title>
<meta name="generator" content="Contao Open Source CMS">
<meta name="viewport" content="width=device-width,initial-scale=1.0,shrink-to-fit=no">
<link rel="stylesheet" href="{{ asset('system/themes/flexible/fonts.min.css') }}">
{% block style %}
<style>
html {
background: #fff;
}
body {
margin: 0;
padding: 0;
font-family: -apple-system,system-ui,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
font-weight: 400;
font-size: 1em;
color: #000;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
min-height: 100vh;
background: #f4f8f0;
}
h1, h2, h3 {
font-weight: 600;
color: #86af49;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
body {
color: #222;
font-weight: 300;
}
h1, h2, h3, strong, b, th {
font-weight: 500;
}
}
a, a:visited {
text-decoration: none;
color: #e4790f;
}
a:hover {
text-decoration: underline;
}
h1 {
margin: 0;
padding-bottom: 2%;
font-size: 3em;
text-align: center;
}
h2, h3 {
font-size: 1.5em;
}
pre, code {
font: 300 .75rem/1.25 "Roboto Mono", monospace;
}
table {
margin: 1.25em 0 1em;
border-collapse: collapse;
border-spacing: 0;
}
th, td {
text-align: left;
padding: 2px 10px 4px;
border: solid #ccc;
border-width: 1px 0;
}
th {
background: #f3f3f3;
}
#header {
padding: 12px 0 10px;
width: 100%;
text-align: center;
}
#content {
width: 100%;
}
#footer {
font-size: 0.75em;
text-align: center;
padding: .5em 0;
color: #808080;
}
.wrap {
width: 60%;
margin: 0 auto;
padding: 1em;
overflow: hidden;
}
.header-logo {
display: inline-block;
}
.block-error {
margin-bottom: 20px;
background-color: #fff;
padding: 15px 30px 24px;
word-wrap: break-word;
overflow: hidden;
border: 1px solid #f2f2f2;
}
.block-error:before {
float: left;
content: "</";
font-size: 5em;
color: #ccc;
}
.block-error .inner {
padding-left: 7em;
}
.container {
width: 100%;
}
.header-logo img {
max-width: 300px;
height: auto;
}
</style>
{% endblock %}
{% endblock %}
</head>
<body>
<div class="container">
<div id="header">
<div class="wrap">
<div class="header-logo">
<img src="files/mate/img/mate_logo.png">
</div>
</div>
</div>
<div id="content">
<div class="wrap">
<div class="error">
{% block message %}<h1>{{ block('title') }}</h1>{% endblock %}
<div class="block-error">
<div class="inner">
<div class="text-error">
{% block main %}
{% if block('matter') is defined %}
{% set _block = block('matter') %}
{% if _block|trim is not empty %}
<h2>{{ 'XPT.matter'|trans }}</h2>
{{ _block|raw }}
{% endif %}
{% endif %}
{% if block('howToFix') is defined %}
{% set _block = block('howToFix') %}
{% if _block|trim is not empty %}
<h2>{{ 'XPT.howToFix'|trans }}</h2>
{{ _block|raw }}
{% endif %}
{% endif %}
{% if block('explain') is defined %}
{% set _block = block('explain') %}
{% if _block|trim is not empty %}
<h3>{{ 'XPT.more'|trans }}</h3>
{{ _block|raw }}
{% endif %}
{% endif %}
{% endblock %}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Ähnliche Beiträge
Zurzeit sind keine Nachrichten vorhanden.
*******************
Liebe Leser,
Menschen sind nicht ausschließlich Frauen, Männer, weiblich, männlich, divers – Menschen können vielfältiger sein! Wir möchten euch ALLE als Menschen ansprechen, egal von welchem Geschlecht oder welcher Kultur. Sprachlich ist es schwierig, euch alle „richtig“ anzusprechen. Daher verwenden wir – auch für eine bessere Lesbarkeit – bei Personenbezeichnungen meist die männliche Form, wie Dienstleister oder Partner. Aber eins ist uns wichtig: Keiner soll sich ausgeschlossen fühlen.
Zudem sind wir Verfechter des DU #gernperdu und gestalten so unsere tägliche Kommunikation etwas lockerer und persönlicher. Auch hier gilt: Wir bringen allen die gleiche Wertschätzung entgegen.
*******************