Cum se remediază antetul de sărituri în Divi? (3 metode)
Publicat: 2021-01-14Ai probleme cu saltul de cap în Divi? Ai venit la locul potrivit. În acest ghid, vă vom arăta 3 metode pentru a rezolva cu ușurință problema antetului de salt în Divi pas cu pas .
Antet Divi Jumping
Cu milioane de utilizatori din întreaga lume, Divi este una dintre cele mai populare teme WordPress de acolo. Vine cu o mulțime de funcții care vă permit să ascundeți antetul, să personalizați pagina produsului WooCommerce și chiar să includeți butonul Adaugă în coș în paginile magazinului. Cu toate acestea, Divi are și câteva probleme comune. Am văzut deja cum să remediați problema cu formularul de contact și astăzi vă vom arăta cum să remediați problema antetului de salt.
Mulți utilizatori întâmpină probleme cu antetul din Divi, așa că în acest ghid vom vedea cum să îl remediam. Înainte de a trece în ghid, să înțelegem ce probleme provoacă această problemă și de ce apare.
Ce este antetul care sărituri Divi?
Uneori, când vizitezi unele site-uri care folosesc Divi, observi că atunci când pagina se încarcă, antetul nu este în partea de sus. În schimb, sare până când pagina este complet încărcată și de aceea este cunoscut sub numele de antet de sărituri Divi.
De ce are loc saltul de antet?
Antetul de salt în Divi apare din cauza unui conflict între CSS și JavaScript. Când aplicați modificări site-ului dvs. folosind Personalizatorul, Divi folosește JavaScript și adaugă acele modificări prin atribute de stil atât la valorile de umplutură-top, cât și la cele de top folosind CSS. Problema este că browserul redă CSS înainte de JavaScript și această întârziere a timpului de încărcare creează iluzia antetului săritor.
Pentru a remedia antetul de săritură în Divi, trebuie să localizați valorile padding-top și top și să verificați padding-ul care este injectat folosind Javascript. Apoi, pur și simplu adăugați-le în foaia de stil. Să aruncăm o privire la cum să facem asta.
Cum să remediați antetul de sărituri în Divi?
Cea mai bună modalitate de a remedia problema antetului de salt în Divi este să menționați manual padding-top și alte valori ale clasei CSS prin fișierul style.css sau personalizarea WordPress. Să vedem cum să facem acest lucru pas cu pas.
NOTĂ : Pentru a evita cauzarea oricăror probleme pe site-ul dvs., vă recomandăm să testați mai întâi aceste modificări în modul de instalare. Unele companii de găzduire WordPress au un mediu de găzduire în mod implicit, dar dacă furnizorul dvs. de găzduire nu are unul, puteți crea și un mediu de găzduire local.
Pasul 1: Inspecție
Mai întâi, deschideți site-ul dvs. într-un browser și rulați instrumentul Inspect pe antet. Pur și simplu plasați mouse-ul pe antet, faceți clic dreapta și selectați Inspectați elementul (sau pur și simplu Inspectați în alte browsere).
În fila Inspector, căutați 2 valori CSS.
- padding-top
- top
După cum puteți vedea în exemplul nostru, padding-top este de 80 px , iar partea de sus este de 32 px . Aceste dimensiuni sunt generate automat de server, așa că trebuie să le menționăm în fișierul style.css al site-ului nostru.
Pasul 2: Adăugarea CSS la Divi
Următorul pas pentru a remedia problema antetului de salt în Divi este să adăugați cod CSS la tema dvs. Pur și simplu copiați următorul cod CSS.
#page-container { padding-top: 80px; } #main-header { sus: 32px; }
Acestea sunt valorile pentru site-ul nostru, dar pot fi diferite pentru site-ul dvs., așa că nu uitați să înlocuiți valorile în consecință. Acum, trebuie să adăugați acest cod pe site-ul dvs. Există 3 metode de a face acest lucru:
- Folosind Editorul de teme Divi
- Din personalizarea WordPress
- Utilizarea fragmentelor de cod
Metoda 1: Editor de teme Divi
Tema Divi vine cu un editor de teme încorporat pe care îl puteți găsi în Divi > Opțiuni teme > CSS personalizat .
Odată ce sunteți acolo, inserați codul pe care tocmai l-ați copiat și salvați modificările.
Asta e! Antetul dvs. de săritură ar trebui să fie reparat!
Metoda 2: Personalizator WordPress – CSS suplimentar
A doua opțiune este să utilizați WordPress Customizer. În tabloul de bord WordPress, accesați Aspect > Personalizare . Apoi, accesați secțiunea CSS suplimentară și inserați codul CSS pe care l-ați copiat la pasul anterior.
După aceea, publică modificările și gata!
Metoda 3: Fragmente de cod
Dacă nu vă simțiți confortabil să adăugați cod direct în fișierele temei dvs., puteți utiliza Code Snippets, un instrument excelent pentru a adăuga fragmente de cod HTML, PHP, CSS și JavaScript pe site-ul dvs.
Mai întâi, în tabloul de bord WordPress , accesați Pluginuri > Adăugați nou și căutați Fragmente de cod . Instalează-l și activează-l pe site-ul tău web.
După activarea pluginului, veți vedea setările pluginului în secțiunea de administrare WordPress.
Fragmente de cod vă permit să adăugați sau să editați codul existent pe site-ul dvs. Pentru această demonstrație, vom edita fragmentul CSS existent. Acest plugin vine cu un fragment CSS în mod implicit pe care îl puteți activa.
Pur și simplu faceți clic pe fragment pentru a-l edita. Apoi redenumiți-l și adăugați codul CSS pe care l-ați copiat la pasul anterior.
După aceea, pur și simplu salvați modificările și sunteți gata.
Pasul 3: Ștergeți memoria cache
După ce aplicați modificările pe site-ul dvs., trebuie să ștergeți memoria cache. Există multe pluginuri de cache WordPress disponibile pe piață. Dacă nu ești sigur pe care să o folosești, alege-ți preferatul din această listă.
După instalarea și activarea pluginului de cache la alegere, va trebui să vă goliți memoria cache. De exemplu, folosim WP Fastest Cache, așa că în tabloul de bord WordPress, pur și simplu mergem la setările pluginului și apăsăm un buton pentru a șterge întregul cache al site-ului WordPress.
Asta e! Acum antetul tău în Divi nu va mai sări.
Concluzie
Una peste alta, problema cu antetul săritor în Divi este foarte comună. Vestea bună este că este destul de simplu de rezolvat. În acest ghid, v-am arătat cum să remediați această problemă adăugând câteva linii de cod CSS la instalarea dvs. WordPress. Există 3 moduri diferite în care puteți face acest lucru:
- Adăugați codul în fișierul style.css al temei dvs. WordPress
- Adăugați codul utilizând WordPress Customizer
- Utilizați fragmente de cod
Toate aceste metode vor rezolva problema antetului de săritură, așa că alegeți-o pe cea care vi se potrivește cel mai bine. În plus, dacă, după adăugarea codului CSS, antetul dvs. încă sare, nu uitați să vă ștergeți memoria cache (local, browser și cache DNS). De asemenea, vă puteți accesa site-ul de pe alt computer sau folosind modul incognito.
Pentru mai multe tutoriale despre Divi, consultați următoarele ghiduri:
- Cum să faci orice element Divi lipicios
- Formularul de contact Divi nu funcționează: cum îl remediați
- Cum să remediați eroarea de timeout Divi
În cele din urmă, sperăm că ați găsit acest articol util. Dacă ați făcut-o, vă rugăm să distribuiți această postare pe rețelele sociale. Ați întâmpinat probleme cu Divi? Ați avut probleme în urma acestui ghid? Anunțați-ne în secțiunea de comentarii de mai jos.