So Gestalten Sie Eine Website-Vorlage Neu

Inhaltsverzeichnis:

So Gestalten Sie Eine Website-Vorlage Neu
So Gestalten Sie Eine Website-Vorlage Neu

Video: So Gestalten Sie Eine Website-Vorlage Neu

Video: So Gestalten Sie Eine Website-Vorlage Neu
Video: Angebote erstellen, die wirklich verkaufen? So geht es! (Inkl. kostenloser Vorlage) 2024, Kann
Anonim

Der einfachste Weg, eine Website zu erstellen, ist die Verwendung einer Vorlage. Damit die Ressource jedoch hervorsticht, müssen Sie das Standardlayout ändern. Und hier können Sie auf Grundkenntnisse in HTML und CSS nicht verzichten.

So gestalten Sie eine Website-Vorlage neu
So gestalten Sie eine Website-Vorlage neu

Anleitung

Schritt 1

Finden Sie im Internet die Website-Vorlage, die am besten zu Ihnen passt. Achten Sie auf seine Fähigkeiten, die Anpassungsfähigkeit an die Größe des Monitors, die Funktionen des Menüs und die Anordnung der Spalten. Laden Sie die gewünschte Version auf Ihren Computer herunter, entpacken Sie das Archiv. Überprüfen Sie die Leistung, indem Sie die Dateien in das Stammverzeichnis der Site hochladen. Vielleicht enthält die Vorlage Fehler und wird nicht richtig installiert, dann hat es keinen Sinn, in Zukunft damit zu arbeiten.

Schritt 2

Auch wenn Sie die Vorlage nicht vollständig neu erstellen möchten, ersetzen Sie die meisten Bilder, insbesondere diejenigen, die sich als Logo befinden. Ersetzen Sie jedes Bild auf diese Weise:

- Öffnen Sie die Grafikdatei im Photoshop-Programm;

- im Menü "Bild" - "Bildgröße" die Parameter ansehen;

- Öffnen Sie ein neues Blatt mit genau den gleichen Abmessungen;

- Erstellen Sie das gewünschte Bild mit den Anwendungstools;

- Alle Ebenen glätten und (nicht für das Web) ein neues Bild unter demselben Namen und im selben Ordner speichern, wobei das Originalformat eingestellt wird.

Anstelle eines Bildes sollte also ein anderes erscheinen.

Schritt 3

Sobald Sie alle Bilder geändert haben, zippen Sie den Ordner mit den Dateien (im Fall von Joomla) und laden Sie ihn über das Site-Admin-Panel im Menü "Erweiterungen" hoch. Prüfen Sie, ob das Thema mit den neuen Illustrationen richtig angezeigt wird.

Schritt 4

Ändern Sie die restlichen Parameter in style.css. Darüber hinaus ist es viel bequemer, dies nicht über das Admin-Panel, sondern auf einem Computer zu tun. Es ist sinnvoll, localhost (Denver) zu verwenden, um das Ergebnis der Transformationen so schnell wie möglich zu sehen. Dadurch wird vermieden, dass das Ergebnis jedes Mal auf den Server hochgeladen werden muss, um die Ergebnisse nach der nächsten Bearbeitung anzuzeigen.

Schritt 5

Laden Sie das kostenlose FireBug-Plugin für Mozilla Firefox herunter. Nach der Installation erscheint ein gelbes Fehlersymbol in der oberen rechten Ecke des Browsers. Klicken Sie darauf oder drücken Sie die F12-Taste und am unteren Bildschirmrand wird der Seitencode in einer reduzierten Version angezeigt. Es kann geöffnet werden, indem man mit der Maus über die Pluszeichen fährt. Und wenn Sie auf die Zeile eines Elements klicken, wird es oben auf dem Bildschirm hervorgehoben. Auf der rechten Seite des Fensters mit dem Code finden Sie Stile, die die Zeilen angeben, die für das Erscheinungsbild verantwortlich sind. Und es wird sofort klar, wo Sie die Stildatei bearbeiten müssen, um das Design zu ändern.

Schritt 6

Öffnen Sie style.css in Notepad ++. Sie können andere Programme verwenden, die den Code bearbeiten, aber Sie können dafür nicht den Standard "Notepad" verwenden, da es sonst zu Fehlern aufgrund der Codierung kommt. Verwenden Sie FireBug, um die Parameter zu finden, die Sie ändern möchten, und bearbeiten Sie sie gleichzeitig in Notepad ++.

Schritt 7

Speichern Sie das endgültige CSS und laden Sie die Datei auf den Server hoch.

Empfohlen: