Gestaltungshinweise

Your browser does not support HTML5 video.

[ hinweise für das seitenupdate ]

Bei Anpassungen des Designs genügt es mitunter, nur die folgenden Dateien auf dem Server im Theme-Ordner auszutauschen:
   
                 – style.css bei Veränderungen der Schriftarten und Größen                     – header.php bei Veränderungen
des Header-Menüs

A N P A S S E N   D E R   B L O G B R E I T E
Die Standard-Blog-Breite beträgt 1140 Pixel. Um die Seitenbreite auf 1196 Pixel anzupassen, muss die Dateicss/media.css angepasst
werden. Hier ist der Wert 1140 in der folgenden Zeile durch 1196px zu ersetzen:
@media (min-width: 1200px) {.u-sheet {width: 1140px;}}

[ eigene webfonts einbinden ]
Da Nicepage es nicht erlaubt, eigene Schriften zu verwenden, müssen die folgenden Anpassungen in derstyle.css vorgenommen werden, um die Hausschrift Gordita einzubetten. Hierfür ist es erforderlich, dass der Webfont-Ordner im WordPress-Installationsverzeichnis liegt. In diesem Fall wurde er unter [[site_path_live]]/webfonts angelegt.
1. Der folgende Code muss ergänzt werden:
@font-face {
font-family: „Gordita“;
src: url(„../../../webfonts/gordita.eot“); /* IE9 Compat Modes */
src: url(„../../../webfonts/gordita.eot?#iefix“) format(„embedded-opentype“), /* IE6-IE8 */
url(„../../../webfonts/gordita.otf“) format(„opentype“), /* Open Type Font */
url(„../../../webfonts/gordita.svg“) format(„svg“), /* Legacy iOS */
url(„../../../webfonts/gordita.ttf“) format(„truetype“), /* Safari, Android, iOS */
url(„../../../webfonts/gordita.woff“) format(„woff“), /* Modern Browsers */
url(„../../../webfonts/gordita.woff2“) format(„woff2“); /* Modern Browsers */
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: „Gordita“;
src: url(„../../../webfonts/gordita-medium.eot“); /* IE9 Compat Modes */
src: url(„../../../webfonts/gordita-medium.eot?#iefix“) format(„embedded-opentype“), /* IE6-IE8 */
url(„../../../webfonts/gordita-medium.otf“) format(„opentype“), /* Open Type Font */
url(„../../../webfonts/gordita-medium.svg“) format(„svg“), /* Legacy iOS */
url(„../../../webfonts/gordita-medium.ttf“) format(„truetype“), /* Safari, Android, iOS */
url(„../../../webfonts/gordita-medium.woff“) format(„woff“), /* Modern Browsers */
url(„../../../webfonts/gordita-medium.woff2“) format(„woff2“); /* Modern Browsers */
font-weight: bold;
font-style: normal;
}
html, body {
font-family: Gordita;
font-size: .95em !important; /* Gordita ist breiter als andere Schriftarten und wird so ein wenig verkleinert */
}

2. Die Font-Families sind wie folgt zu ersetzen:
font-family: Arial, sans-serif;     – – – >     font-family: Gordita, Arial, sans-serif;
font-family: Arial, sans-serif !important;     – – – >     font-family: Gordita, Arial, sans-serif !important;
font-family: -, „Helvetica Neue“, sans-serif;      – – – >     font-family: Gordita, Arial, sans-serif;
font-family: Montserrat, „Helvetica Neue“, sans-serif;      – – – >     font-family: Gordita, Arial, sans-serif;
font-family: „Open Sans“, sans-serif;      – – – >     font-family: Gordita, Arial, sans-serif;
font-family: Montserrat, sans-serif;      – – – >     font-family: Gordita, Arial, sans-serif;

Es müssen wirklich alle Elemente ersetzt werden. Nach Übernahme der Änderungen muss die Datei style.css wieder in die Besitzrechte des Nutzers www-data übergeben werden.

[ custom css ]
In
den Nicepage-Theme-Einstellungen unter „Theme exportieren“  ist im Feld CSS der folgende Code hinterlegt:
@font-face {
font-family: „Gordita“;
src: url(„content/fonts/fonts/gordita.eot“); /* IE9 Compat Modes */
src: url(„content/fonts/fonts/gordita.eot?#iefix“) format(„embedded-opentype“), /* IE6-IE8 */
url(„.content/fonts/fonts/gordita.otf“) format(„opentype“), /* Open Type Font */
url(„content/fonts/fonts/gordita.svg“) format(„svg“), /* Legacy iOS */
url(„content/fonts/fonts/gordita.ttf“) format(„truetype“), /* Safari, Android, iOS */
url(„content/fonts/fonts/gordita.woff“) format(„woff“), /* Modern Browsers */
url(„content/fonts/fonts//gordita.woff2“) format(„woff2“); /* Modern Browsers */
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: „Gordita“;
src: url(„content/fonts/fonts/gordita-medium.eot“); /* IE9 Compat Modes */
src: url(„content/fonts/fonts/gordita-medium.eot?#iefix“) format(„embedded-opentype“), /* IE6-IE8 */
url(„content/fonts/fonts/gordita-medium.otf“) format(„opentype“), /* Open Type Font */
url(„content/fonts/fonts/gordita-medium.svg“) format(„svg“), /* Legacy iOS */
url(„content/fonts/fonts/gordita-medium.ttf“) format(„truetype“), /* Safari, Android, iOS */
url(„content/fonts/fonts/gordita-medium.woff“) format(„woff“), /* Modern Browsers */
url(„content/fonts/fonts/gordita-medium.woff2“) format(„woff2“); /* Modern Browsers */
font-weight: bold;
font-style: normal;
}
html, body {
font-family: Gordita;
}

p {color: #444444;} a:link {color: #1F4C7D;} a:visited {color: #1F4C7D;} a:hover {color: #1F4C7D; font-weight: bold; text-decoration: none;} a:active {color: #1F4C7D; font-weight: bold} a:focus {color: #1F4C7D; font-weight: bold}
ul {list-style-image: url(‚https://kniebel.media/design/pictures/list.gif‘);}
.position::before { display: block; content: „“; height:150px; margin-top: -150px; visibility: hidden; }
html { scroll-behavior: smooth; }
hr{ height: 2px; border: 0; background-color: #E9EDF2; }
@media (min-width: 1200px) { .u-sheet { width: 1140px; } }
.u-button-style.u-palette-4-base { color: white !important; background-color: rgba(31,76,125,.90); } .u-button-style.u-custom-color-1 {background-color: rgba(31,76,125,.90) !important; }
.u-button-style:visited{color: white;}

/* COPYRIGHT-HINWEIS IM FOOTER RECHTSBÜNDIG */.u-footer .u-text-7 { text-align: right; }

Sofern diese Angaben beim Theme-Export nicht übernommen werden, können sie manuell in der Datei style.css oder alternativ im Custom-CSS-Feld im WordPress-Backend der Theme-Anpassungen hinterlegt werden.

[ wordpress-anpassung nach der theme-installation ]
Die eigenen Schriftarten müssen in das WordPress-Verzeichnis /content/fonts/fonts kopiert werden. 

In
WordPress muss die Startseite „Gestaltungshinweise“ auf eine andere URL umgeleitet werden, z. B. auf kniebel.com, da sonst die erste Ebene des Header-Menüs auf die Gestaltungshinweise verlinkt.

Zur individuellen Anpassung der rechten Seitenleiste wird in WordPress das Plugin „Sidebar Manager Light“ benötigt.
Da standardmäßig die „Rechte Seitenleiste“ dieses Layouts genutzt wird, wird auf Seiten ohne Anpassung des Seitenmenüs standardmäßig „Blog Header“ und Blindtext angezeigt.
Dies kann unterdrückt werden, indem über die WordPress-Widgets für die Rechte Seitenleiste ein leeres Textwidget hinterlegt wird.

[ woocommerce anpassen ]
/* AUSBLENDEN DER BESCHREIBUNGSREGISTER */.u-tab-link-1 {visibility: collapse;}
/* PRODUKTBESCHREIBUNG */.u-product {font-size: 14px;}p:not(.u-text-variant) {text-align: justify;}
/*HINWEIS WOOCOMMERCE */ .woocommerce-error, .woocommerce-info, .woocommerce-message { margin: none !important;; background-color: white; }
/* WARENKORB */ .u-section-5 .u-cart-1 { width: 100%; padding: 4%; }