Seitentitel verschieben

    Hallo,

    habe neulich mithilfe des Plugins "Column shortcodes" auf einer Seite Spalten erstellt. Leider erscheint der Seitentitel "Firma" nun immer links von den zwei Spalten. Siehe Screenshot im Anhang!

    Wie kann ich den Seitentitel "Firma" so verschieben, dass er nicht mehr links neben den zwei Spalten auftaucht sondern über den zwei Spalten?
    Muss man dass über CSS programmieren?

    Wäre dankbar für Eure Hilfe!!

    Vielen Dank,
    Sven

    • Gerade eben
    • 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

    Offensichtlich und auch logisch wird das Heading nicht mit formatiert sonder der Content.

    Du kannst das Heading rechts oder mittig setzen oder in Zusätzliche CSS ausblenden und ggf im Text "Die Firma" hervorheben.

    Dazu mein Kopiersatz ;-)
    Die Style-Anpassungen werden unter Design - Customizer - Zusätzliche CSS gemacht werden! LINK.

    Alles geschätzt, da deine Seite - Coming soon - zeigt :-(

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

    Danke für den Hinweis!!
    Wenn ich mit der rechten Maustaste auf meinen Titel klicke, kommt bei mir aber nicht die Funktion "Element untersuchen (O)".
    Benutze folgenden Browser:

    Microsoft Edge 41.16299.15.0
    Microsoft EdgeHTML 16.16299

    Wie komme ich in die Konsole (Inspektor), die man in Deinem Video sieht?

    Mein Edge ist auch die 41.16xxx Version - Mauszeiger auf das Element deiner Wahl - rechte Maustaste gedrückt letzter Punkt = Element untersuchen !!!
    In den Einstellingen gibts einen Punkt F12-Entwicklungstools.
    Oder einfach einen vernünftigen Browser verwenden ;-)

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

    Die übliche Antwort!

    Bitte lesen zumindest (II) und danach handeln! Oder für eine Hilfeleistung den maintenance Mode ausschalten!
    Alles andere ist Rätselraten.

    Könnte

    Code
    .entry-title {
display: none;
}


    sein??

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

    Gut geraten ;-)

    Nächster Kopiersatz - Die Style-Anpassungen werden unter Design - Customizer - Zusätzliche CSS gemacht werden! LINK.

    Um den Titel dieses Beitrages auszublenden ist folgende Anweisung einzufügen:

    Code
    #post-97 .entry-title {
    display: none;
}

    Mit dem #post-97 (Selektor) wird nur bei dem Beitrag mit ID-97 der entry-title ausgeblendet.

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

    Dann versuche das mit

    Code
    #post-97 .entry-title {
    padding-left: 40%;
}

    zu verschieben. Mit dem Wert mußt du testen was dir gefällt.
    Dabei schaue auch auf die Breackpoints im responsiven Design und passe die auch an.
    Da ja maintaince wieder auf EIN ist gehts nicht genauer.

    Guten Rutsch!

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

    Vielen Dank! Das Verschieben funktioniert jetzt! Allerdings kriege ich den Seitentitel nicht über die beiden Text-Spalten. Titel klebt jetzt an den Spalten. Weisst Du, wie man das macht?
    Was meinst Du mit "[LEFT][COLOR=#333333][FONT=Verdana]Breackpoints im responsiven Design und passe die auch an"? Was/wo sind die Breakpoints und wie/wo passe ich die an?
    Maintenance Mode ist wieder inaktiv :-)

    [/FONT][/COLOR][/LEFT]

    Die schnellere Antwort - Breackpoints im responsiven Design - oder - einfach mal die Suchmaschine deines Vertrauens befragen.

    Zitat

    Allerdings kriege ich den Seitentitel nicht über die beiden Text-Spalten. Titel klebt jetzt an den Spalten.

    Dazu gibts jetzt ein kleines Video! LINK
    Beschreibung da ohne Ton ;-)
    Browser ist Firefox - rechte Maustaste auf "Firma" - drücken und "Element untersuchen" drücken - das ist das Entwicklertool und ist ein Firefox Bordmittel - gibts auch bei Chrom und Edge und und Da gibts auch ein Icon "Bildschirmgröße testen" oder einfach für responsiv den Browser am Rand zusammenschieben.

    Blau unterlegt ist h1 class-"..... und rechts deine Änderung - padding-left: 100%;
    Änderung auf 60%
    Danach lokalisieren des Bereiches - Cursor auf "entry-header" - passt! Rechts die Breite als width: 36% - ändern auf 100% ;-)

    und so findet man mit etwas Übung viele schöne Dinge!

    Und die Änderungen unter zusätzliche CSS auch eingeben und speichern - das Tool ist nur zum finden und testen.

    Dann noch ein Vorschlag - das Haupt-Menü einzeilig!

    Code
    .navigation-top .wrap {
    max-width: 1100px;
    margin-right: auto;
    margin-left: auto;
}

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

    Einmal editiert, zuletzt von SEpp55 (31. Dezember 2017 um 17:07)

    Wow, vielen Dank. Bin begeistert von dem Video.
    In meinem älteren Internet Explorer komme ich übrigens einfacher in diese Konsole. Bei mir heisst der aber "DOM Explorer" und nicht "Inspektor".
    Hoffe, dass ich die richtigen Zeilen finde.
    Bin bis zum 3. Januar in Berlin. Komme deshalb vor dem 4. Jan nicht dazu.
    Wünsche Ihnen auf jeden Fall ein gutes Neues Jahr.

    Hallo,

    vielen Dank für die wertvollen Tipps war auch auf der Suche nach ein Programm um den Seitentitel zu verschieben.
    Werde dies auch mal ausprobieren und mich daran versuchen.

    [size=10][COLOR=#222222][FONT=Verdana]Vielen Dank. Alles hat geklappt!! Bin begeistert.
    Auch das mit dem einzeiligen Hauptmenü ist super!!

    Habe es bloss nicht hingekriegt die Schritte im CSS einzugeben. Was muss ich konkretfür diese Änderungen im CSS textlich eingeben?

    "[/FONT][/COLOR][COLOR=#333333][FONT=Verdana]Blau unterlegt ist h1class-"..... und rechts deine Änderung - padding-left: 100%;
    Änderung auf 60%
    Danach lokalisieren des Bereiches - Cursor auf"entry-header" - passt! Rechts die Breite als width: 36% - ändern auf 100%[/FONT][/COLOR][COLOR=#222222][FONT=Verdana]"

    Eine weitere Frage. Wie kann ich die beiden Text-Spalten breiter machen, so dassmehr Text in die Spalten-Breite rein passt?[/FONT][/COLOR][/SIZE]

    Einmal editiert, zuletzt von Jabez-WP77 (15. Januar 2018 um 13:23)

    Wenn du die Spalten breiter haben möchtest kannst du das obere wieder schmeissen ;-)

    Code
    #post-97 .entry-title {
    padding-left: 40%;
}


    Die max-Breite erreichst du mit:

    Code
    #post-97 #primary .page-content,
body.page-two-column:not(.archive) #primary .entry-content,
body.page-two-column #comments {
width: 100%;
}

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

    OK, dann lassen wir das erst mal mit den breiteren Spalten.

    [LEFT][COLOR=#333333][FONT=Verdana]Diesen Code hatte ich schon im CSS eingefügt!!

    [/FONT][/COLOR]
    [/LEFT]
    #post-97 .entry-title {
    padding-left: 40%;
    }

    Mir ging es im Moment primär darum, was ich im CSS eingeben muss für die Änderungen:

    [FONT=Verdana][size=10]"[/SIZE][/FONT][COLOR=#333333][COLOR=#333333][FONT=Verdana][FONT=Verdana]Blau unterlegt ist h1class-"..... und rechts deine Änderung - padding-left: 100%; Änderung auf 60%
    [/FONT][/FONT][/COLOR][/COLOR][LEFT][COLOR=#333333][COLOR=#333333][FONT=Verdana][FONT=Verdana]Danach lokalisieren des Bereiches - Cursor auf"entry-header" - passt! Rechts die Breite als width: 36% - ändern auf 100%[/FONT][/FONT][/COLOR][/COLOR][COLOR=#222222][COLOR=#222222][FONT=Verdana][FONT=Verdana]"[/FONT][/FONT][/COLOR][/COLOR][/LEFT]


    Wie heisst der CSS-Code hierfür?

    Der Maintenance-Modus ist wieder aus!!

    Einmal editiert, zuletzt von Jabez-WP77 (15. Januar 2018 um 22:47)

    Hast du das mit der Spaltenbreite versucht?? Der Teil wäre ja nur zum Einfügen in die zusätzlichen CSS, wie in #2 angeführt.
    Ergebnis sollte sofort zu sehen sein!
    Das ist ja zum Testen einmal unabhängig von der Überschrift - nicht ganz ;-)
    Aber wenn du jetzt mühevoll die Überschrift positionierst und danach die Spalten breiter machen möchtest wird die Überschrift nicht ganz dazupassen.

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

    Ja, hab das jetzt ins CSS eingefügt. (Mein Maintenance-Modus ist aus!)
    Sieht super aus!! Danke!! Wie kann man da jetzt eigentlich die Schriftgrößen ändern in den Spalten?

    Wie machen wir das nun den Titel zu zentrieren?

    Die Schriftart und -größe verwende ich das Plugin WP-Edit, da kannst du verschiedene Einstellmöglichkeiten auswählen!

    Den Titel zentrieren:

    Code
    #post-97 .entry-title {
    padding-left: 20%;
}

    entfernen!

    Neu einfügen;

    Code
    #primary .entry-header,
 #primary .page-header {
        width: 100%;
        text-align: center;
    }

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

    Einmal editiert, zuletzt von SEpp55 (18. Januar 2018 um 08:15)

Jetzt mitmachen!

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

Benutzerkonto erstellen Anmelden