CSS personalizat și ascunderea unor părți ale site-ului web prin CSS

Solicitările destul de obișnuite sunt legate de ascunderea unor părți specifice pe site-ul web care nu au propriul buton de pornire/oprire pe partea de administrator. Deoarece nu este posibil să aveți butoane de administrare a temei pentru fiecare detaliu de pe front-end, puteți pur și simplu ascunde părțile nedorite folosind CSS dacă nu sunteți familiarizat cu editarea codurilor HTML pentru a elimina deloc partea.

Localizați piesa de îndepărtat

Puteți utiliza instrumentele de dezvoltare ale browserului, puteți găsi exact partea pe care doriți să o eliminați.
Să presupunem că doriți să eliminați partea cu data și autorul de sub postarea de pe blog, făcând clic dreapta pe această parte Inspectați elementul și deschideți instrumentele de dezvoltare ale browserului:

Deschideți Instrumente pentru dezvoltatori

Deplasând cursorul mouse-ului peste codul sursă, puteți vedea secțiunea evidențiată pe pagină care se referă la o linie de cod sursă sub cursorul mouse-ului:

Găsiți element în sursă

În acest fel, puteți găsi parul pe care doriți să-l ascundeți – de exemplu, referindu-vă la capturile de ecran de mai sus dacă este toată secțiunea cu data și autor, sau numai secțiunea cu dată sau numai secțiunea autor.

Scrieți CSS pentru a ascunde secțiunea selectată

Când ați selectat o parte pe care doriți să o ascundeți, utilizați atributul ID sau CLASS al etichetei HTML selectate în propriile stiluri CSS sau utilizați selectorul CSS exact folosit de temă pentru această etichetă. Selector CSS pentru eticheta selectată utilizată de temă, pe care îl puteți găsi în partea dreaptă a instrumentelor pentru dezvoltatori de browser.
De exemplu, dacă ați decis să eliminați întreaga parte cu data și autorul, selectorul folosit de temă este: .elm-posts-main .item .item-info

Selectoare CSS pentru etichetă

Stilul CSS pentru a ascunde eticheta HTML pe lateral este „afișare: niciunul;“, puteți utiliza și !important declarație pentru a preveni suprascrierea ulterioară a stilului CSS cu un alt CSS.

Deci, stilul CSS final pentru a ascunde o parte cu data și autorul va fi:

.elm-posts-main .item .item-info { display: none !important; }

Adăugați cod CSS personalizat în Customizer

Puteți adăuga codul CSS personalizat în Aspect > Personalizare > CSS suplimentar

După publicare, îl puteți verifica pe site-ul dvs.:

stilul_css_applicat