Responsives Menü nutzt h1-Überschrift...

  • Moin zusammen,
    ich hoffe, das hier ist die richtige Kategorie, wenn nicht möchte ich einen Moderator bitten, das Thema an die richtige Stelle zu schieben.

    Ich habe folgendes Problem: Auf meiner Website nordwinkel.de verwendet das Theme bei der responsiven Ansicht des Hauptmenüs eine h1-Überschrift. Das Hauptmenü fährt auf kleineren Bildschirmen zusammen und erhält den Titel "Menü". Und dieser Schriftzug ist dann die h1-Überschrift. Das ergibt für mich einfach keinen Sinn. Das verwendete Theme ist Snaps, wovon ein Child-Theme erstellt wurde, um andere Anpassungen vorzunehmen. Wenn ich im Child-Theme die h1-Tags verändere, verschwindet in der responsiven Darstellung leider das komplette Menü. Das ist dann ja auch nicht Sinn der Sache.
    Hat jemand eine Idee, wie ich das verändern kann? Kann ich die h1-Tags durch p-Tags ersetzen und dann irgendwie mit CSS rumfummeln, bis es passt?

    Vielen Dank schon mal vorab und viele Grüße
    Konrad

    • 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

  • Das wird im entsprechenden Javascript so definiert sein. Was sagt der Theme-Support dazu?

    Leider verwendest du ein Premium-Theme und dazu noch Optimierungs-Tools, so dass es uns schwer möglich ist die .js ausfindig zu machen.

    Edit: Ich habe gerade noch mal geschaut. Es müsste diese Datei sein:
    /wp-content/themes/snaps/js/scripts.js

    Das Geheimnis des Könnens liegt im Wollen!
    [size=12]Bitte keine Hilfegesuche per PN (auch keine "privaten" Links). Das ist ein öffentliches Forum.[/SIZE]

    2 Mal editiert, zuletzt von SirEctor (19. August 2020 um 16:11)

  • Erstmal vielen Dank für deine Antwort. Einen Theme-Support habe ich bisher noch nicht gefunden. Daher konnte ich diese Frage auch noch nicht stellen. Ich mache mich mal auf die Suche.
    Hmm, auf die Idee, dass das in einem JavaScript hinterlegt sein könnte kam ich noch gar nicht. Ich dachte, ich könnte das in der header.php verändern. Zumindest habe ich dort den Eintrag gefunden. Mit dem Nachteil, dass wenn ich es verändere, die oben genannten Probleme auftreten. Ich habe leider von Programmierung keinen wirklichen Plan. Kann man ein JavaScript so ohne Weiteres verändern?
    Was braucht es von mir, damit es einfacher wird, das verantwortliche JavaScript zu finden?

  • Das verantwortliche Javascript habe ich dir in den "Edit" geschrieben. Wenn du die h1 in der header.php änderst, musst du das Javascript ebenfalls anpassen.

    Das Geheimnis des Könnens liegt im Wollen!
    [size=12]Bitte keine Hilfegesuche per PN (auch keine "privaten" Links). Das ist ein öffentliches Forum.[/SIZE]

  • Super Danke. Ich denke, ich habe den Auslöser gefunden. In einem Javascript "small-menu.js" taucht zumindest "h1" auf. Ich vermute mal, dass es daran hängt.
    Hier der Code:
    $.fn.smallMenu = function() {
    $masthead.find( '.site-navigation' ).removeClass( 'main-navigation' ).addClass( 'main-small-navigation' );
    $masthead.find( '.site-navigation h1' ).removeClass( 'assistive-text' ).addClass( 'menu-toggle' );

    $( '.menu-toggle' ).unbind( 'click' ).click( function() {
    $masthead.find( '.menu' ).toggle();
    $( this ).toggleClass( 'toggled-on' );
    } );
    };

    // Check viewport width on first load.
    if ( $( window ).width() < 640 )
    $.fn.smallMenu();

    // Check viewport width when user resizes the browser window.
    $( window ).resize( function() {
    var browserWidth = $( window ).width();

    if ( false !== timeout )
    clearTimeout( timeout );

    timeout = setTimeout( function() {
    if ( browserWidth < 640 ) {
    $.fn.smallMenu();
    } else {
    $masthead.find( '.site-navigation' ).removeClass( 'main-small-navigation' ).addClass( 'main-navigation' );
    $masthead.find( '.site-navigation h1' ).removeClass( 'menu-toggle' ).addClass( 'assistive-text' );
    $masthead.find( '.menu' ).removeAttr( 'style' );

    Kann ich das ohne weiteres in der Datei ändern?

  • immer eine kopie von den daten machen.

    ja, in der header php den tag anpassen
    und den gleichen im js script einfügen.

    PS: kann sein das du css noch anpassen musst.

    Der theme entwickler dürfte da nicht an die seo gedacht haben

  • Alles klar, vielen Dank. Sicherheitskopie machen ist klar.:) Muss ich die Darstellung dann noch über CSS anpassen? Oder wird das einfach übernommen?:)

  • Vielen vielen Dank! Das war ja fast schon zu einfach, dafür dass ich das Problem seit einem halben Jahr versuche zu lösen...:D Jetzt läuft es so, wie ich es mir vorgestellt habe.:) Dickes, dickes DANKE!!!

Jetzt mitmachen!

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