Design nicht wie in der Preview

  • Also ich hab gestern ein Design in Wordpress gefunden was mir sehr gut gefallen unswar dies hier :
    http://wordpress.org/themes/sixteen

    in der Preview sieht man das der Body Bereich sich unter dem Header befindet.
    Jedoch wenn ich das Design bei mir im Wordpress Installiere und es dann aktiviere ist der Body Bereich leider auf dem Header. : http://t-ara-ger.square7.ch/
    Ich hab zwar versucht den irgendwie runter zu kriegen jedoch ist mir dies leider nicht gelungen ... ich befürchte das man dies im Editor Bereich machen muss jedoch kenne ich mich leider in dem Bereich noch nicht so gut aus und trau mich nicht da rum zu probieren... könnte mir vllt jemand evtl. helfen ?

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Hi TsunaSoul,

    was passiert, wenn du einen Blogtitel und die Blogbeschreibung im Dashboard unter Einstellungen -> Allgemein eingibst?

  • Das Problem liegt eindeutig daran, dass du die Social Media Buttons und die Überschrift nicht eingebunden hast und deswegen das Element weiter nach oben rutscht... Entweder du fügst das noch hinzu (denke die Überschrift ist der Blogname) oder du machst per CSS im Editor folgendes:

    main.css -> Zeile 98 (oder mit dem Template überschreiben)

    [COLOR=#303942][FONT=Menlo][COLOR=#888888][COLOR=#222222]#nav-wrapper[/COLOR][/COLOR] {

    [/FONT][/COLOR]

    • [COLOR=#C80000]width[/COLOR]: 1100px;
    • [COLOR=#C80000]margin[/COLOR]: auto;
    • [COLOR=#C80000]text-align[/COLOR]: center;
    • [COLOR=#C80000]margin-top[/COLOR]: 280px; /*HIER STAND VORHER 100px*/


    [COLOR=#303942][FONT=Menlo]}


    [/FONT][/COLOR]

  • Ich wollte das einfügen jedoch kann ich leider keine main.css finden.

  • Achso das hab ich vorher gar nicht probiert das mit den Media Buttons und der Überschrift aber vielen dank für den Code hatte nämlich eigentlich nicht vor eine Überschrift hinzusetzen und dank dir muss ich dies nicht mehr tun. Vielen Dank! =)

  • Funktioniert auch an jeder anderen Stelle, Hauptsache das Stylesheet wird nach der Main geladen. Wie gesagt, normalerweise gibt es auch immer die Möglichkeit noch im Template selbst unter "Design -> Theme Options -> Other Settings (o.ä.)" einzustellen, welche nachträglichen Styles geladen werden sollen.

    Aber es hört sich ganz danach an, als wenn Du die Einstellung jetzt gefunden hast :)

  • Achso ok dann hab ich jetzt auf jeden Fall etwas neues dazu gelernt vielen Dank nochmals! =)
    Jedoch eine Frage hätte ich da noch... ich hab erst gerade gemerkt das der Hintergrund nicht fixiert ist und der mit runter scrollt... könntest du mir vielleichtnoch dabei helfen ? Ich hatte es mal selber versucht unswar hier :

    body {
    font-family: "Roboto", Arial;
    }
    .container {
    width: 1100px;
    margin: auto;
    }
    #page {
    position: relative;
    z-index: 999;
    margin: auto;
    }
    #content {
    background: rgba(230, 225, 196, 0.9);
    padding: 15px;
    word-wrap: break-word;
    -ms-word-wrap: break-word;
    }
    .blog #content {
    padding-left: 30px;
    }


    Ich hatte den Bereich:

    #page {
    position: relative; [COLOR=#ff0000](< hatte ich auf fixed gestelt)[/COLOR]
    z-index: 999;
    margin: auto;

    jedoch als ich das tat ist die hälfte der Seite irgendwie verschwunden ... bin ich vielleicht an der Falschen Stelle ?

  • Ok, das ist jetzt ein wenig komplizierter :) Ich vermute, dass Du mit "Hintergrund" das obige Bild meinst.. Die Sache ist wie folgt: das Template hat den s.g. "Parallax-Effekt". Dies ist eine bestimmte Art mit Hintergründen umzugehen, damit diese quasi "übereinander scrollen"... Das Ding dort rauszubekommen zerschiesst wahrscheinlich das halbe Template und es wird schneller gehen ein anderes zu benutzen, was keinen Parallax-Effekt mitbringt.

    Du kannst Dir ja mal diese Seite anschauen, dann weisst Du was ich mit umfangreich meine: http://www.1stwebdesigner.com/css/create-scr…rallax-website/

    Habe ich Deine Frage also richtig verstanden? Wenn ja, hoffe ich, dass angekommen ist, dass es in diesem Fall nicht nur ein kleiner Befehl, sondern eine Mischung aus HTML, CSS & Javascript ist, die dafür zuständig ist, dass sich der obere Bereich Deines Templates dementsprechend verhält.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!