Anpassen des Gallery 2-Matrix-Themas

• April 30, 2024

Im letzten Lernprogramm haben wir begonnen, das Matrix-Thema in unser eigenes Thema für Galerie 2 umzuwandeln. Wir werden dieses neue Thema als Standardthema für unser Portfolio festlegen und die Hintergrundgrafik ändern.

In dem Themenordner für jedes Thema befindet sich eine screeshot.png-Bilddatei, die ein Screenshot dieses Themas ist. Wir haben immer noch das alte PNG des Matrix-Themas in unserem neuen Themenordner. Möglicherweise möchten Sie dies durch ein PNG für Ihr Galeriethema ersetzen. Die durchschnittliche Größe des PNG beträgt ca. 500 x 200 Pixel. Sie speichern die neue Datei screenshot.png im Ordner images.

C: \ xampp \ htdocs \ gallery2 \ themes \ dCipollo \ images

Jetzt können wir zum Site Admin Control Panel zurückkehren. Zuerst müssen wir unser neues Theme installieren. Gehen Sie zum Abschnitt Plugins und Sie werden sehen, dass unser neues Thema unter Themen am unteren Rand der Seite aufgeführt ist. Klicken Sie auf Installieren, um unser neues Design zu installieren. Wechseln Sie als Nächstes zum Abschnitt "Themen" des Admin-Bereichs und ändern Sie die Standardvorlage aus der Matrix in unser neues Thema. Natürlich werden Sie an dieser Stelle keine Änderungen im Layout der Vorlage bemerken. Wir müssen diese Änderungen noch vornehmen.

Ich möchte zuerst die grafischen Änderungen an meinem Thema vornehmen. Fügen wir ein Hintergrundbild hinzu. Dies kann ein sich wiederholendes gekacheltes Bild sein. Aber um zu meiner Website zu passen, verwende ich dasselbe große statische Hintergrundbild. Wir müssen unser Hintergrund-JPG im Ordner dCipollo im Verzeichnis gallery2 speichern.

C: \ xampp \ htdocs \ gallery2 \ dCipollo

Jetzt können wir die Datei theme.css ändern, um unsere Hintergrundgrafik hinzuzufügen. Wenn wir uns den Quellcode der main.php-Datei ansehen, sehen wir, dass das body-Tag eine Stilklasse namens gallery hat.



Diesen body.gallery-Stil müssen wir in der theme.css-Datei finden.

body.gallery {
? ? Rand: 0;
? ? Polsterung: 0;
}

Jetzt werden wir die Hintergrundstilcodes zu dieser Klasse hinzufügen und die URL für das Hintergrundbild auf das JPG im dCipollo-Ordner verweisen.

body.gallery {
? ? Rand: 0;
? ? Polsterung: 0;
? ? Hintergrundfarbe: #eeeeee;
? ? Hintergrundbild: url ('../../ dCipollo / BG1_Gallery.jpg');
? ? Hintergrund-Anhang: scrollen;
? ? Hintergrundwiederholung: keine Wiederholung;
? ? Hintergrundposition: oben links;
}

Wenn wir unsere main.php-Seite für unser Portfolio aktualisieren, wird das Hintergrundbild immer noch nicht angezeigt. Dies liegt daran, dass es einige Stile gibt, bei denen der Hintergrund auf Weiß eingestellt ist. Setzen wir diese Stile auf einen transparenten Hintergrund.

Das sollte sich um die Hintergrundgrafiken für unser Portfolio kümmern. Wir sind bereit, die Kopf- und Fußzeile der Webseite zu ändern.

Video-Anleitungen: Top 10 Excel Free Add-ins (April 2024).