Abonniere die Beiträge von PinkPearl Info

EMail Adresse hinzufügen

Teile dich mit!

Verwende den Hashtag #ppiupdate in den Sozialen Medien (wie zum Beispiel Twitter), um Besucher auf deine Updates aufmerksam zu machen.
Mehr Infos...

Freitag, 25. März 2016

HTML Designs auf nPage verwenden

lulu
Wusstest du, dass man auf nPage ziemlich jedes Design verwenden kann? Auch zum Beispiel die Designs, die wir auf PinkPearl anbieten!? Und es ist gar nicht so schwer.

Nachdem du dich auf nPage eingeloggt hast gibt es in der linken Navigation unter dem Punkt "Designs"-> "Design Einstellungen" -> "Styles verwalten". Dort musst du drauf klicken.




Hier ist bereits ein "Beispiel style" angelegt. Bei diesem klickst du auf "Bearbeiten".




Dann siehst du zwei Textboxen: eine Header und eine Footer. Da muss jetzt der Layout Code rein. Oben alles bis zum Content (oft <div id="content"> oder <div class="rand">)
und unten ab </div> bis </html> )

Wichtig ist, dass du den Inhalt der style.css auch in der Header Textbox einfügen musst (und zwar in einem Tag (<style> </style>)). Außerdem musst du die Bilder, die im Layout verwendet werden, noch auf deinem Server hochladen und eventuell die Pfade der Bilder im Design anpassen, damit sie bei dir angezeigt werden.

Hinweise

Wenn du davor noch kein eigenes Design hattest, kann es sein, dass beim Aufrufen deiner Website eine Fehlermeldung kommt. Damit dein Design angezeigt wird kannst du folgendes machen:

Gehe auf "Design Einstellungen" -> "Einstellungen". Dort musst du dein Design noch der Startseite zuordnen (das muss nur einmalig und nicht bei jeder Textseite gemacht werden)



Dort dann bei Startseite "Willkommen" und bei "StandardStyle" = Beispiel Style auswählen und speichern.



Und noch ein kleiner Hinweis: Bei manchen Designs (wie auch bei denen auf PinkPearl) hast du eine HTML Navigation. Das heißt, dass du deine Links in dieser Footer Textbox (oder je nach Layout in der Header Textbox) von oben eintragen musst.

<h1>Header</h1>
Kannst du dort einfach in deine Navigationsüberschrift abändern z.B. in <h1>Main Bereich</h1>

und

<li><a href="#">Link here 1</a></li>
ist dann dein Textseiten Link in der Navigation.
Ein kleines Beispiel:
<li><a href="willkommen.html">Startseite</a></li>
Je nach Design können Link und Überschrift natürlich ein bisschen variieren.

Beispiel

Ziemlich viel Text? Ich habe dieses Design mithilfe des Tutorials angepasst, damit es auf nPage verwendet werden kann. Die Dateien kannst du mit den folgenden Link downloaden: Klick hier.
Kopiere den Inhalt der npage_header.txt in die Header Textbox und den Inhalt der npage_footer.txt in die Footer Textbox. Bitte lade das Header Bild und den Hintergrund extra auf npage hoch und ändere die beiden Links in der Footer Textbox!

Hilfe?

Du hast ein Design, dass du gerne für nPage verwenden möchtest aber weißt nicht wie? Ich helfe auch gerne! Schreib mich an

6 Kommentare:

  1. Ich habe zwar keine page, aber das ist wirklich gut erklärt & ist recht hilfreich.
    Danke für den post! <3

    LG Nicky

    AntwortenLöschen
    Antworten
    1. ^////^ danke dein lieber Kommentar macht mich richtig happy ^______________^ Ich hoffe, dass es andere auch so empfinden und das es hilft.

      Löschen
  2. Sehr gutes Tutorial, danke dafür!
    Hätte nicht gedacht, dass das so einfach geht. Da kann ich in Zukunft ja sogar Layouts für npage anbieten ^^

    LG!

    AntwortenLöschen
    Antworten
    1. Ja wenn man sich damit beschäftigt ist es eigentlich auch ganz logisch aber wenn man nur die beiden Edit Felder von npage vor sich hat und die vielen styles wo man da anlegen kann denkt man: "hääääää... ne brauch ich nicht". So ging es jedenfalls mir am Anfang xD

      Löschen
  3. Das ist echt lieb von dir, da sogar Hilfe an zu bieten.
    Ich hab auch schon öfters Layouts für andere an npage angepasst bzw dort mal das fix gemacht.
    xD Bei dieser Sache "Wie ich das Layout auf npage hin krieg" wusst ich immer nie, wie ich das nun kurz und knapp und gut erklären soll... Daher machte ich das immer einfach mal flott.
    Wenn man aber einmal bei npage dahinter gestiegen ist, wie das dort funktioniert, dann kriegt das sicher jeder gut hin :)

    AntwortenLöschen
    Antworten
    1. Das kenn ich xD Ich habs schon einige Male per EMail erklärt und dann auch schon oft einfach selbst gemacht, weil es schneller geht, aber so kann ich jetzt immer auf diesen Beitrag verlinken haha :3
      Ja sobald man weiß worauf man achten muss und warum da die beiden Textfelder sind ist es eigentlich auch logisch und nicht so schwer. Aber dahinter kommen muss man erst mal ^^"

      Löschen

Coprights @ 2016, Blogger Templates Designed By Templateism | Distributed By Gooyaabi Templates