Vízszintes görgetősáv mobilon

Előfordulhat, hogy mobilon vízszintes görgetősáv jelenik meg az oldalon. Ennek az oka egy elem, amely kilóg a képernyő szélén (túlcsordul). Először meg kell keresni a túlcsorduló szekciót vagy konténert, utána ki kell javítani.

A túlcsorduló konténer megkeresése

Két módszer közül választhatsz.

Módszer 1: JavaScript-kóddal a böngészőben

1. Nyisd meg a vízszintes görgetősávot mutató oldalt a böngésződben.
2. Kattints jobb gombbal az oldalra, és válaszd a Vizsgálat (Inspect) pontot, vagy nyomd meg a Ctrl+Shift+I billentyűket. Ha már nyitva van, a Ctrl+Shift+M a különböző eszközszélességek megtekintésére is jó.
3. Kattints a Console fülre.
4. Illeszd be a következő kódot, és nyomj Entert. A kód piros szaggatott kerettel jelöli azokat az elemeket, amelyek túlcsordulást okoznak.

(function (d) {
  var w = d.documentElement.offsetWidth,
    t = d.createTreeWalker(d.body, NodeFilter.SHOW_ELEMENT),
    b;
  while (t.nextNode()) {
    b = t.currentNode.getBoundingClientRect();
    if (b.right > w || b.left < 0) {
      t.currentNode.style.setProperty('outline', '1px dotted red', 'important');
      console.log(t.currentNode);
    }
  }
})(document);

5. Görgess fel-le az oldalon, és keresd meg a piros kerettel jelölt elemeket.
6. Szerkeszd az oldalt az Elementorban, és igazítsd ezeket az elemeket.

Módszer 2: a szekciók vagy konténerek kézi törlésével

1. Nyisd meg a hibás oldalt az Elementor szerkesztőjében.
2. A felső sávon kattints a Közzététel melletti nyílra, és válaszd a Mentés sablonmintaként pontot. Így az oldalról másolat készül, és az eredeti oldalt nem rontod el a próbálkozással.
3. Térj vissza a WordPress vezérlőpultra.
4. Menj a Sablonminták oldalra. A mentett sablonminták listája nyílik meg.
5. Nyisd meg az imént mentett sablonmintát az Elementorral szerkesztésre.
6. Az X-re kattintva töröld egyenként a konténereket. A törölt tartalmat az Előzmények panelről visszaállíthatod.
7. Minden törlés után próbáld ki mobilon, hogy eltűnt-e a vízszintes görgetősáv. Amikor eltűnik, megtaláltad a hibás szekciót.

A túlcsorduló konténer javítása

1. Nyisd meg azt az oldalt, amelyiken mobilon megjelenik a vízszintes görgetősáv.
2. Jelöld ki a túlcsorduló konténert.
3. A panelen az Elrendezés fül nyílik meg.
4. Nyisd ki a További lehetőségek szekciót.
5. A Túlcsordulás legördülő listából válaszd a Rejtett értéket.

https://minta-bolt.hu/wp-admin/post.php?post=24&action=elementor

A képen a További lehetőségek szekció látszik a Túlcsordulás mezővel, alapértéke Alapértelmezett. A Rejtett érték levágja a konténerből kilógó tartalmat, így a vízszintes görgetősáv megszűnik.