1. Herzlich willkommen bei WPDE.org, dem grössten und ältesten deutschsprachigen Community-Forum rund um das Thema WordPress. Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können.
    Information ausblenden

WP Theme erstellen -> zwischen versch. CSS Styles wechseln

Dieses Thema im Forum "Design" wurde erstellt von Epicor, 21. Februar 2011.

Schlagworte:
  1. Epicor

    Epicor Member

    Registriert seit:
    21. Februar 2011
    Beiträge:
    14
    Zustimmungen:
    0
    Hallo liebe WP Gemeinde,


    mein Anliegen ist folgendes:

    Ich möchte ein Theme erstellen, bei welchem zwischen verschiedenen CSS Stylesheets gewechselt werden soll.

    Beispiel: Es wird z.b. 3 statische Seiten geben:

    Home | Leistungen | Kontakt

    Nun möchte ich aber, dass z.b. bei Home der Hintergrund oder der Header blau sind, bei Leistungen soll es grün sein und bei Kontakt orange.

    Ich lege also zum normalen style.css (diese wird hier für "Home" verwendet) noch 2 zusätliche an (dupliziere die style.css einfach), ändere die Farben - und was auch sonst immer nötig ist - und dann?

    Ist mein Vorhaben überhaupt möglich?
    Kann ich in der header.php irgendwie einfügen, "wenn die seite leistungen.php ist, dann benutze style2.css" - "wenn die seite kontakt.php ist, dann benutze style3.css" ....

    Wäre um jede Hilfe dankbar!

    lg, Epi
     
  2. bego

    bego Well-Known Member

    Registriert seit:
    30. November 2005
    Beiträge:
    579
    Zustimmungen:
    4
    Alles geht.

    Ich würde erste einmal drei Stylesheets anlegen in der Art

    blau.css
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    gruen.css
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    usw.

    Dann änderst Du die header.php und fügst unterhalb der Zeile, mit der das Stylesheet eingebunden wird ein:

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Das ist natürlich irgendwann nervtötend, wenn Du 47 blaue, 23 rote, 2 grüne und 127 gelb-lila-gepunktete Seiten hast. Hier wäre es dann sinnvoller, eigene Templates anzulegen und jeder Seite ein bestimmtes Template zuzuweisen.
     
  3. Epicor

    Epicor Member

    Registriert seit:
    21. Februar 2011
    Beiträge:
    14
    Zustimmungen:
    0
    Danke für die flotte und sehr kompetente Antwort :)

    Werd das morgen gleich mal ausprobieren.

    Zwecks Interesse hätt ich noch die Frage:
    Wie könnte ich den einzelnen Seiten verschiedene Templates zuordnen, wie du es vorgeschlagen hast?

    Lg und danke schon mal!
     
  4. bego

    bego Well-Known Member

    Registriert seit:
    30. November 2005
    Beiträge:
    579
    Zustimmungen:
    4
    Wenn Du das nächste mal eine neue Seite anlegst oder eine vorhandene änderst, schau mal in der rechten Spalte weiter unten: dort kannst Du angeben, welches Template für die Seite genommen werden soll.

    Die Templates sind, sehr vereinfacht gesagt, eine Kopie der index.php mit modifizierten Inhalten und einem anderen Namen im Header.
     
  5. Epicor

    Epicor Member

    Registriert seit:
    21. Februar 2011
    Beiträge:
    14
    Zustimmungen:
    0
    Hm ok.. hab jetzt Templates mit Themes verwechselt...

    Hast du vielleicht einen Link zu einem Tutorial, wie man Templates erstellt?
    index.php duplizieren ist mir zwar klar, aber weiter weiß ich leider nicht :(

    lg, epi

    EDIT** Habe gerade gelesen (google sei dank), dass man die page.php nehmen muss und nicht die index.php? Kann das stimmen?
    Viele Köche verderben den Brei *hehe*
     
  6. bego

    bego Well-Known Member

    Registriert seit:
    30. November 2005
    Beiträge:
    579
    Zustimmungen:
    4
  7. derElch

    derElch Well-Known Member

    Registriert seit:
    8. Februar 2011
    Beiträge:
    254
    Zustimmungen:
    0
    Ich empfehle:

    style.css.php
    PHP:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    PS: Ich selbst bin zu müde um jetzt noch Quelltext zu schreiben, deshalb hab ich nur mal das Grundprinzip zusammengesetzt.
    hab selbst schon den ganzen abend Codes angeschaut und gebastelt, meine Augen sind einfach zu müde, entschuldigt mich :sad:
     
  8. Epicor

    Epicor Member

    Registriert seit:
    21. Februar 2011
    Beiträge:
    14
    Zustimmungen:
    0
    Moin moin,

    also ich versuch mich eher an den Vorschlag von bego zu halten, da das mit den Templates die sinnvollere Variante ist. Vor allem, wenn dann jemand anders die Seite verwaltet, dann muss er nur das entsprechende Template auswählen.


    @bego: Hab mir das Tutorial durchgelesen, aber sonderlich viel geht er auf Templates nicht ein :(
    Dass man die page.php bzw. index.php duplizieren muss, unter anderem namen abspeichern etc. das hab ich verstanden.
    Was ich allerdings nicht verstehe: z.b. in der page.php steht ja get_header.
    Und in der header.php steht ja dann die Adresse zur Stylesheetdatei.
    Aber wie soll dann die neue page2.php (die duplizierte) einen anderen Stylesheet verwenden?

    Muss ich das auch wieder so lösen:

    PHP:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Ich weiß, die Syntax stimmt sicher nicht ^^ sorry - bin mit WP noch nicht wirklich vertraut :(


    EDIT*** hab das probiert, dass die header.php ne andere css datei aufruft, wenn das template page2.php ist. Hat leider nicht funktioniert (sicherlich die falsche Syntax ^^).

    Habe aber nun einfach in die page2.php ein inline-css reingeschrieben (überschreibt ja die externe css). Und da funktioniert z.b. nun das umfärben des Hintergrundes.

    Gut und schön - Meine Frage nun: Bekomm ich damit irgendwelche Konflikt-Probleme? Ist jetzt zwar nicht die schönste Variante (ist mir eh klar ^^) aber besser als nix ist es einmal :)


    EDIT2 ***
    Sorry, ich weiß ich bin lästig :( aber ich bin eben wissbegierig *hehe*
    Habe nun folgendes probiert:

    PHP:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Ergebnis: 0
    er nimmts mir nicht - müsste die Hintergrundfarbe auf weiß ändern mit der style2.css ... hab ich schonwieder einen Fehler drinnen?
     
    #8 Epicor, 22. Februar 2011
    Zuletzt bearbeitet: 22. Februar 2011
  9. bego

    bego Well-Known Member

    Registriert seit:
    30. November 2005
    Beiträge:
    579
    Zustimmungen:
    4
    Nicht? Oh.

    OK, einen hab ich noch:

    http://www.perun.net/2007/07/30/wordpress-themes-verstehen-1/

    Also ....... Damals, lange vor der Einführung des iPhones, gab es HTML-Dateien, in denen man Text mit Hilfe von Tags wie z.B. <b>...</b> etwas aufgehübscht hat.
    Dann kam ein halbverrückter Grafik-Designer, erzählte was von Typografie und Layout und man versuchte, den Inhalt mit noch mehr Tags wie z.B. <frameset>...</frameset> weiter aufzuhübschen.

    Nachdem mehrere Webdesigner diesem Treiben durch einen beherzten Sprung aus dem 42. Stock ein Ende gesetzt hatten, erfand man Cascading Style Sheets. Damit konnte man den Inhalt noch viel, viel mehr aufhübschen und es sprangen jetzt andere Leute aus dem 42. Stock, nachdem sie etwas von Internet Explorer 6 gemurmelt hatten.

    Leider waren die HTML-Dateien noch nicht so übersichtlich, dass der Fußballverein Kleinböttelsdorf regelmäßig über sein spannendes Vereinsleben berichten konnte, ohne einen irren Programmierer einzustellen. (Böse Zungen behaupten, die Häuser in Kleinböttelsdorf wären nicht hoch genug.) Deshalb kam jemand auf die Idee, man könnte die Inhalte ja erstmal in eine Datenbank eingeben und vielleicht von dort irgendwie wieder abrufen.

    Für diesen Zweck wurde eine eigene Programmiersprache für Hilflose Personen erfunden. Leider muss bei der Entwicklung dieser Programmiersprache etwas schief gelaufen sein, denn die Programmiersprache war leider etwas unübersichtlicher als HTML.

    Dafür kam aber eine gute Fee aus Houston, Texas, (wer sagt, dass Feen immer weiblich sein müssen?) und entwickelte eine ganz einfach zu bedienende Eingabemaske, in der mit Hilfe dieser Programmiersprache Inhalte in die Datenbank eingeben konnte. Und damit man auch etwas auf der Homepage sehen konnte, wurden die aktuellen Spielergebnisse von FC Kleinböttelsdorf mit Hilfe der Datei index.php wieder ausgegeben – und zwar sogar in den Vereinsfarben, denn die konnte man in einer CSS-Datei style.css hinterlegen.

    Nachdem in Kleinbötelsdorf der erste Jubel verklungen war, meldete sich ein Mitspieler aus der A-Jugend und erzählte, dass es doch toll wäre, wenn der Fußballverein auch bei Google aufgeführt würde und dass man dafür irgendwelche Angaben in einem <head>-Bereich machen müsse und dass es außerdem toll wäre, wenn mal endlich jemand die Telefonnummer unter die Homepage setzen könnte, dafür gäbe es doch normalerweise eine Fußleiste. Und so kamen zu der index.php noch einen header.php und eine footer.php

    Doch damit nicht genug. Irgendwann kam der Leiter der Alte-Herren-Mannschaft auf die Idee, wegen der schlechten Konditionen der Alten Herren doch mal auf die hervorragenden Leistungen vergangener Spiele hinzuweisen. Deshalb kopierte man die index.php, nannte sie archiv.php und schrieb in die Überschrift "Das waren noch Zeiten …".

    Ganz euphorisch über die schöne Homepage wollten auch die Damen aus Kleinböttelsdorf zu Wort kommen. Damit man aber lockere Kaffeekränzchen nicht mutwillig mit ernsthaften Fußballspielen vermischte, wurden für die Beiträge Kategorien eingeführt und nun konnte man sich auf der Homepage mit Hilfe der neuen Vorlage kaffee.php (die nichts anderes ist als eine Kopie der index.php, nur mit anderer Überschrift) ausschließlich über die neuesten Kuchenrezepte informieren.

    Man sollte wissen, dass es in Kleinböttelsdorf viele Aktivitäten gibt, über die zu berichten ist. Und so wurde immer die index.php genommen, mit einer anderen Überschrift versehen und auf eine ander Inhalts-Kategorie angepasst und mit einem eigenen namen versehen. So richtete sich Pfarrer Johannes z.B. die Datei tempel.php ein (englisch Template).

    Inzwischen erhält der Fußballverein Kleinböttelsdorf täglich Anfragen zu seiner erfolgreichen Homepage. So wollen etwa die Karatekämpferinnen Niederpröttelsheim auch gerne eine schicke Homepage haben, jedoch mit ihren eigenen Vereinsfarben und auch ganz anderen Überschriften. Dazu möchten sie alle vorhandenen Tempel-Dateien, pardon, Templates verwenden und an ihre eigenen Bedürfnisse anpassen. Das ist aber ein ganz anderes Thema (englisch Theme).


    Damit setzt Du die gute Tradition vom FC Kleinböttelsdorf in löblicher Weise fort. Die haben auch immer munter die index.php kopiert und angepasst. Die header.php und die footer.php blieben aber immer gleich, damit auch wirklich alles nach Kleinböttelsdorf aussieht.

    Muss ja gar nciht. In page2.php (was für ein trivialer Name, würden die Damen vom Kaffekränzchen sagen) kann man aber mal ganz andere id's (#kaffekraenzchen) und Klassen (.kuchen, .kaffee ) verwenden. Das muss man aber im Stylesheet berücksichtigen:
    #kaffeekraenzchen {background: url('veilchen.jpg');}
    .kaffe {color: brown;}

    ... worauf sich die Frage stellt, wie hoch bei Euch die Häuser sind. Ein Sprung aus dem Erdgeschoß lohnt nicht wirklich.

    Vorher lohnt sich aber vielleicht auch noch ein Blick in das heilige Buch aus San Francisco: http://codex.wordpress.org/Theme_Development
    Die können das irgendwie besser erklären, als ich.
     
    #9 bego, 22. Februar 2011
    Zuletzt bearbeitet: 22. Februar 2011
  10. Epicor

    Epicor Member

    Registriert seit:
    21. Februar 2011
    Beiträge:
    14
    Zustimmungen:
    0
    @bego

    Deine Taktik (falls es eine war), mich schief anzureden (so kams rüber) hat Früchte getragen ;)

    Habs nun endlich geschafft, dass die header.php abgleicht, welches page-template aktiv ist, und demnach dann die richtige stylesheet datei ausführt :)
     
  11. bego

    bego Well-Known Member

    Registriert seit:
    30. November 2005
    Beiträge:
    579
    Zustimmungen:
    4
    Nein, nein, gar keine Taktik …

    Hast Du Dir das Tutorial auf perun.net denn wenigstens mal angeschaut? Mit meinem kurzen Vortrag über Templates und Themes konntest Du scheinbar wenig anfangen.
     
  12. Epicor

    Epicor Member

    Registriert seit:
    21. Februar 2011
    Beiträge:
    14
    Zustimmungen:
    0
    Huhu,


    Also perun.net kannte ich eh vorher schon ^^ aber danke für den Link!

    Ne also der Vortrag war nicht so mein Ding *hehe* war zwar lustig zu lesen, aber naja ^^

    Hab mich dann durch den Wordpress CODEX gequält und mir die Infos zusammengestückelt, die ich brauchen konnte ^^

    Meinen Header hab ich dann so ergänzt:

    PHP:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
     
  13. bego

    bego Well-Known Member

    Registriert seit:
    30. November 2005
    Beiträge:
    579
    Zustimmungen:
    4
    Ich versteh das nicht. Warum so kompliziert?

    Nehmen wir mal an, die Standardseite hat einen weißen Hintergrund, die Vorlage blau.php soll aber einen blauen Hintergrund bekommen. Dann könntest Du doch in die style.css schreiben

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Die index.php erhält dann einen <div id="wrapper_weiss">...</div>, während die Vorlage blau.php einen <div id="wrapper_blau">...</div> erhält.

    Zuletzt legst Du im Backend eine neue Seite an und weist ihr die entsprechende Vorlage zu.
     
  14. Epicor

    Epicor Member

    Registriert seit:
    21. Februar 2011
    Beiträge:
    14
    Zustimmungen:
    0
    Kompliziert?
    Find ich gar nicht :) da es nur bei einem farbigen Hintergrund nicht bleiben wird, sondern gegebenenfalls auch noch mehrere andere Styles geändert werden müssen, is es einfacher, hier mehrere css Stylesheets zu erzeugen.

    Aber deine Variante klingt auch einleuchtend und werd ich sicher für kleinere Projekte auch einmal brauchen können :)
     
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden