Support » Themes » Twenty Seventeen Startseite Layout „Deine letzten Beiträge“ ändern

  • Gelöst leckofunny

    (@leckofunny)


    Hallo zusammen,

    ich beabsichtige das Twenty Seventeen Theme wie folgt abzuändern:
    https://i.imgur.com/m8Sc0ix.png

    Da ich sehr wenig Erfahrung in diesem Bereich habe, wäre ich über jeden Tipp froh um das Layout für die Startseite in diese Richtung anpassen zu können.

Ansicht von 10 Antworten - 1 bis 10 (von insgesamt 10)
  • Moderator Bego Mario Garde

    (@pixolin)

    Ich bin mir im Moment nicht sicher, welche Art der Unterstützung du dir erhoffst.

    Du bekommst WordPress, Plugins und Themes kostenlos so wie sie sind zur Verfügung gestellt und darfst sie für beliebige Zwecke nutzen und gerne auch an deine Wünsche anpassen, was aber entsprechende Programmierkenntnisse voraussetzt.

    Für die Anpassung der Gestaltung stehen dir im Menü Design > Customizer eine Reihe von Einstellungsmöglichkeiten zur Verfügung. Wenn dir diese Einstellungen nicht ausreichen, kannst du ein Child Theme erstellen (eine Ergänzung des vorhandenen Themes) und darin einzelne Templates umprogrammieren. Dazu solltest du zumindest Grundkenntnisse in PHP, CSS, JavaScript und HTML besitzen.

    Hier im Forum bieten wir dir gerne Hilfe zur Selbsthilfe bei konkreten Anwendungsfragen an, aber niemand wird hier auf Zuruf kostenlos eine umfassende Layout-Änderung für dich vornehmen. Wenn du mit den Vorgaben des Themes nicht zufrieden bist, ein anderes Theme für dich nicht in Frage kommt und du selber „sehr wenig Erfahrung in diesem Bereich“ hast, solltest du einen Dienstleister beauftragen.

    Hallo,
    bezogen auf die Höhe des Fotos auf der Startseite könntest Du die folgende Regel unter Design > Customizer > Ind. CSS eingeben:

    .twentyseventeen-front-page.has-header-image .custom-header-media{
        height: 50vH;
    }

    Den Wert bei height kannst Du natürlich nach Belieben ändern.
    Aber mehr können wir hier – wie Bego schon geschrieben hat – nicht leisten.
    Viele Grüße
    Hans-Gerd Gerhards

    Mein Background umfasst ausschließlich Python, C#, Java und teils C++. Webdesign ist an für sich ein ungeliebtes Thema von mir und daher packe ich nur ungern PHP usw. an. Zuvor hatte ich mit Joomla Erfahrungen gesammelt.

    Für mich ist die Frage an welcher Stelle ich ansetzen müsste um selber voran zu kommen.
    Was wäre da ein Ausgangspunkt? Würde es reichen mit dem Customizer zu arbeiten oder müsste ich vom Theme entsprechende PHP Dateien anpassen?

    erster Ansatz ist die Gestaltung mit den Customizer des themes.
    Danach könnte es sinnvoll sein, über Design > Customizer > Ind. CSS entsprechende CSS-Regeln zu schreiben.
    Wenn der Umfang der CSS – Regeln unter ind. CSS zu groß wird, ist es Zeit für ein childtheme. Infos dazu findest Du z. B. hier. Im Childtheme können auch bestimmte Funktionen implementiert werden, die Änderungen bzw. Erweiterungen deiner Webseite betreffen.
    Wenn dann beispielsweise der Aufbau bzw. das Design einer Beitragsseite geändert werden soll, dann macht es Sinn, die entsprechenden templates zu ändern.

    Ich habe jetzt ein Child Theme von Twenty Seventeen erstellt.
    in /template-parts/post habe ich in der content.php ein Layout mittels dem tag <table> erstellt.

    Pastebin Code
    Bild

    In den nächsten Schritten plane ich die Spalte „BEITRÄGE“ zu entfernen, bzw. „BEITRÄGE“ mit dem Namen der Kategorie der Inhalte zu tauschen und über die Beitraugsauflistung anzeigen zu lassen.
    Die Proportion der Zellen von den Beiträgen muss ich noch anpassen.
    Und dann mal gucken, wie ich die Spalte rechts einfüge für Widgets.

    Meine Frage nun lautet, ist das so die richtige Herangehensweise? Das mittels <table> zu lösen klingt für mich ziemlich altbackent. Aber die content.php und die style.css anzupacken ist doch der richtige Weg, oder? Gibt es vielleicht noch Quellen mit best practices oder eine genauere Dokumentation zu dem Theme?

    • Diese Antwort wurde geändert vor 4 Monaten, 3 Wochen von leckofunny.

    Das mittels <table> zu lösen klingt für mich ziemlich altbackent.

    Ja, völlig überholt.

    Lies dich mal ein wenig in die CSS-Themen Flexbox und vor allem CSS-Grid ein, die heute eine sehr flexible Darstellung von Layouts in Rastern ermöglichen und von allen zeitgemäßen Browsern unterstützt werden.

    Gibt es vielleicht noch Quellen mit best practices … 

    Kennst du das Entwickler-Handbuch?

    https://developer.wordpress.org/themes/

    Da sind alle „best practices“ zusammengefasst.

    Vielen Dank für die nützlichen Hinweise!

    Ich habe nun anstelle der tabellarischen Lösung die Flexbox eingebaut.
    Bild
    Problem ist jetzt wohl, dass der <h2> Titel der Seite nun mit dem ersten Post auf gleicher höhe steht. Mit <table> kam es dazu nicht. Wenn ich in der content.php noch ein paar </br> hard-coded rein packe, dann passt es wieder, sorgt aber auf anderen Seiten für öhnliche Probleme und größere Lücken zwischen den einzelnen Posts. Imm style.css habe ich noch nichts gefunden wo ein padding/margin helfen könnte.

    Das Wort „BEITRÄGE“ konnte ich im Übrigen in der functions.php mit folgendem Filter in „AKTUELLES“ umbenennen:

    
    add_filter( 'gettext', 'change_front_page_title', 20, 3 );
    
    function change_front_page_title( $translated_text, $text, $domain ) {
    
    if (is_front_page()){
    
                switch ( $translated_text ) {
    
            case 'Beiträge' :
    
                $translated_text = __( 'Aktuelles', 'twentyseventeen' );
                break;
    
        }
    }
    
    • Diese Antwort wurde geändert vor 4 Monaten, 3 Wochen von leckofunny.
    • Diese Antwort wurde geändert vor 4 Monaten, 3 Wochen von leckofunny.

    <h2>
    Überschriften sind eigentlich Block-Element und müssten deswegen mit einigem Abstand zu anderen Elementen stehen. Details lassen sich über die Entwickler-Tools des Browsers ermitteln … vorausgesetzt man hat eine URL, um mal ein Beispiel im Browser aufzurufen.

    „Mit <table> kam es dazu nicht.“
    HTML-Tags sind eigentlich auch dazu gemacht, einem Abschnitt einer Webseite eine Bedeutung zu geben. Verwende nicht ein Tabellen-Tag, wenn du gar keine tabellarische Aufzählung (oder Gegenüberstellung) vorhast, sondern nur in Rastern ausrichten möchtest.

    „Wenn ich … noch ein paar </br> hard-coded rein packe …“
    Das ist ein ziemlich übler Programmier-Stil. Statt Abstände korrekt über CSS zu formatieren hilfst du dir mit solchen Krücken, die spätestens bei der Darstellung auf kleineren Displays zu gestalterischen Problemen führen.

    „Im style.css habe ich noch nichts gefunden wo ein padding/margin helfen könnte.“
    Das ist alles Grundwissen, das wir hier nicht vermitteln können, weil das zu weit führt. Bei konkreten Anwendungsfragen bei WordPress helfe ich gerne. Wenn du CSS und HTML5 lernen möchtest, bist du hier verkehrt. Deshalb werden ich auch keine Fragen in der Richtung mehr beantworten.

    Das Wort „BEITRÄGE“ konnte ich im Übrigen in der functions.php mit folgendem Filter in „AKTUELLES“ umbenennen …

    Ja, das geht … wenn auch zu Lasten der Performance. Wenn du aber sowieso ein Child Theme hast, ist das überflüssig. Füg direkt im Template den gewünschten Text-String ein, statt aufwendig die Übersetzung zu isolieren und ersetzen. das macht nur dann sinn, wenn du (z.B. bei einem Textstring in einem Plugin) keinen anderen Weg hast, um an diesen Textstring heranzukommen.

    Da deine ursprüngliche Frage hinreichend beantwortet wurde und wir hier kein Grundwissen in HTML/CSS/PHP vermitteln wollen, würde ich den Thread nun schließen, falls nicht noch eine sehr konkrete Rückfrage zum ursprünglichen Thema kommt.

    Vielen Dank für deine Hilfe.
    Mach bitte hier zu, weil ich von dir keine Hilfe mehr haben möchte. Ich empfinde deine Antworten größtenteils als abwertend. Klar wirst du mir bestimmt noch unterstellen, dass ich meine Arbeit an andere abwelzen möchte, nur zu.

    Das mit </br> und <table> habe ich nur erwähnt um mehr Kontext zu geben, um das Problem zu lokaliseren. Ich hätte hier auch jeden Fortschritt vermeldet, damit andere aus diesem Thread vielleicht mal einen Wert ziehen könne. Warum gibt es denn sonst auch Foren?
    Sind die css classes nicht wordpress spezifisch die ich fortwährend versuche zu identifizieren?
    Soll ich etwas jeden Tag eine neue IP zur Seite rum schicken, weil ich lokal arbeite?

    Wie dem auch sei. Vielen Dank! Ihr habt mir schon sehr viel geholfen. Ich werde davon absehen generell hier weitere Fragen zu stellen.

    • Diese Antwort wurde geändert vor 4 Monaten, 3 Wochen von leckofunny.

    wo bitte ist das, was Bego in seinen umfangreichen und fundierten Antworten hier geschrieben hat, „abwertend“ ?

Ansicht von 10 Antworten - 1 bis 10 (von insgesamt 10)