Anpassung von Seitenbreite und Typo durch Theme verhindert?

  • Hallo,
    meine Website http://www.fb-hotels.de/hotelfotos-stadt-und-meer/ (es geht im folgenden auch als Beispiel um diese Unterseite) läuft mit einem Theme, das vom Theme-Hersteller nicht mehr unterstützt wird.
    Aufgrund möglicher neuer Anforderungen/Wünsche im laufe dieses Jahres möchte ich bisher noch nicht alles neu machen, sondern damit bis ca. Jahresende warten.
    Trotzdem würde ich gerne leichte Anpassungen machen, und finde dafür jedoch im normalen Backend keine Möglihckeit.
    Kann es sein, dass das durch das Theme blockiert wird.

    1.) Ich finde, die Typo des Inhaltsverzeichnisses sieht nicht super aus. Ich finde im normalen Backend nichts zum ändern der Typo des Inhaltsverzeichnisses, sondern lediglich für die Typo einiger Überschriften etc. Wo lässt sich das eintstellen?
    2.) Die Galerie. Mich stört,
    a) dass es keinen Abstand zwischen den Thumbnails gibt
    b) noch stärker stört, dass die Website eine fixe Breite zu haben scheint. Das zieht sich auch durch andere Unterseiten, wo Bilder scheinbar durch eine fixe Breite nicht über die ganze Browserbreite dargestellt werden können.
    Ich hätte am allerliebsten eine Galerie, die mehr wie z.B. diese https://www.mpkelley.com/gallery oder diese https://madebyminimal.com/demo/milo/chloro/ ist.
    Wie lässt sich das ändern?
    Ich bin kein Profi, sehe mich aber in der Lage, nach Anleitung eine CSS Datei o.ä. zu ändern, etwas html zu schreiben, Plugins zu installieren etc, habe also schon ein wenig Erfahrung.
    Weiss jemand, ob diese gewünschten Änderungen kompliziert sind oder evt. sogar durch das Theme verhindert werden, und wenn nein, wo ich die vornehmen muss?

    Danke für Eure Hilfe schon mal im Voraus.

    • 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

  • b) noch stärker stört, dass die Website eine fixe Breite zu haben scheint.


    Das ist durch das Theme vorgegeben, überschreibbar z.B. damit in Design > Customizer > Zusätzliches CSS

    Code
    @media only screen and (min-width: 1200px) {
        #content-wrapper section.pages {
            max-width: 100%;
            margin-right: 40px;
        }
    }
  • Das ist durch das Theme vorgegeben, überschreibbar z.B. damit in Design > Customizer > Zusätzliches CSS
    }[/CODE]


    Danke dafür schon mal, hab es in einem Clone meiner Seite getestet und finde es schon viel besser http://florian-busch.com/hotel-photography-dynamic/ .

    1,) Kann ich mit einfachen Mitteln den Thumbnails einen Rand geben, wie auf den beiden Verlinkten Beispiel-Seiten?
    2.) Wie kann ich die Typografie des Menues ändern? Und dazu noch: Gibt es eine Möglichkeit, die Typografie auf Seiten, die mir zusagen, "auszulesen"?

  • Einen Rand für die Thumbnails kann man z.B. so erreichen:

    Code
    .gallery-columns-3 .gallery-item {
        border: 2px solid #f6f6f6;
        box-sizing: border-box;
    }


    Mit WordPress haben diese Fragen aber nichts zu tun, vermutlich bist Du in einem Forum o.ä. für CSS Grundlagen (google) besser aufgehoben.

    Werte auslesen kann man mit dem sog. Browser Inspector (google).

  • Einen Rand für die Thumbnails kann man z.B. so erreichen:

    Code
    .gallery-columns-3 .gallery-item {
        border: 2px solid #f6f6f6;
        box-sizing: border-box;
    }


    Mit WordPress haben diese Fragen aber nichts zu tun, vermutlich bist Du in einem Forum o.ä. für CSS Grundlagen (google) besser aufgehoben.

    Werte auslesen kann man mit dem sog. Browser Inspector (google).


    Danke.Ich dachte, es hat insofern was mit Wordpress zu tun, da ich ja wissen muss, in welche Datei ich das CSS schreibe?

    Oder schreibe ich die Typografie auch an der selben Stelle im Backend wie die Seitenbreite rein? Ich muss doch auch wissen, wo die Schrift für die Menues definiert wird, oder nicht?

  • Damit im Customizer in den Zusätzlichen CSS die Bilder mit Rand

    CSS
    #gallery-1 .gallery-item {
        border: 3px solid white;
    }
    .gallery-columns-3 .gallery-item {
        width: 32.666% !important;
    }

    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 Schrift im Menü ändern - Vorgang wie oben:

    Code
    header nav#primary-nav ul li a {
        font-family: "Source Sans Pro", Arial, sans-serif;
            text-transform: none;
    }

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

  • Schrift "auslesen" grundsätzlich mit dem Browser-Entwicklertool = Maus auf die gewünschte Stelle, rechtsklich - Element untersuchen.
    Sieht ungefähr so aus ;-)

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

  • Ich bräuchte doch noch mal ne kurze Hilfe.
    Die Thumbnails habe ich ja z.B auf http://www.fb-hotels.de/hotelfotos-stadt-und-meer/ auf "volle Displaybreite" gebracht, und bin mit den Änderungen sehr glücklich.
    Aber der Titel "Hotelfotos: Stadt und Meer" scheint noch auf befgrenzter Breite eingestellt zu sein.
    Das div scheint section-title zu heißen, aber ich bekomme es nicht hin, dieses auch so einzustellen, dass es nicht umgebrochen wird.
    Danke für Eure liebe Hilfe.

  • Der Titel hat eine maximal Breite voreingestellt, überschreiben z.B. mit:

    Code
    @media only screen and (min-width: 1200px) {
       #section-title {
           max-width: 100%;
       }
    }


    Und verwende für den Rand um die Thumbnails ggf. eher den Code aus Antwort #4, dann bricht nicht alles nach 2 Spalten um wenn der Rand breiter eingestellt wird (wie derzeit)...

  • So, da alles so gut läuft, habe ich beim Überarbeiten noch weitergemacht. Dabei sind noch 2 Fragen aufgetaucht (ich hoffe, ich muss dafür keinen neuen Thread aufmachen)

    1. Unter http://www.fb-hotels.de/hotelfilme/ ist z.B. der oberste Film mit

    Code
    <iframe src="[media]https://www.youtube.com/watch?v=qbLmlDzyQNw[/MEDIA]" width="1280" height="720" frameborder="0" allowfull ....


    eingebunden.
    Das sieht auf meinem Macbook gut aus, führt auf meinem Android-Smartphone mit nicht so hoch auflösendem Bildschirm aber zu starkem Beschnitt des Filmes. Wie kann ich den Film besser einbinden?

    2.Auf meinem Smartphone wird immernoch ein Warnhinweis "Die Verbindung zu dieser Seite ist nicht sicher" angezeigt. Bei Euch auch?
    Ich hatte gestern bei meinem Hoster Allinkl so ein SSL-Zertifikat nach diesem Muster https://all-inkl.com/wichtig/anleit…ifikat_397.html angelegt.
    Ist das nicht ausreichend, oder dauert es einfach ein bischen, bis das funktioniert?

Jetzt mitmachen!

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