Listă derulantă din bara laterală WordPress
Există mai multe pluginuri care implementează un spoiler în site-uri pe WordPress. Pluginurile sunt destul de ușor de utilizat și funcționează excelent în textul paginilor site-ului. Cu toate acestea, dezavantajul evident al acestei implementări a listei drop-down este că cel mai probabil nu va funcționa în bara laterală.Această nuanță se datorează faptului că ieșirea spoilerului este realizată folosind coduri scurte, care nu sunt susținute de cele mai multe șabloane. Acestea trebuie să fie conectate separat în fișierul functions.php. În acest caz, în principiu nu există o soluție universală. Aceasta înseamnă că codul de lucru pentru un singur subiect nu trebuie neapărat să lucreze pentru altul.
Faceți clic pentru a citi
O soluție universală, în acest caz, consider conexiunea spoilerului cu un script special. O listă drop-down implementată în acest mod va funcționa în majoritatea șabloanelor. În plus, aspectul spoilerului poate fi schimbat cu ușurință în funcție de nevoile dvs. prin editarea foii de stil styles.css.
Mai întâi, trebuie să introduceți următorul cod în fișierul functions.php al temei:
funcția hyper_spoiler ($ atts, $ content) "$ sp_name".
". $ conținut."
';> add_shortcode ("spoiler", "hyper_spoiler");
Trebuie adăugată la sfârșitul fișierului, înainte de eticheta de închidere?>. După aceea, asigurați-vă că salvați modificările efectuate.
Acum trebuie să instalați noul cod în fișierul header.php:
Trebuie inserat între etichete
.
După aceea, trebuie să creați fișierul spoiler.js (fișierul va fi furnizat în arhiva de mai jos). Pentru aceasta, deschideți Notepad ++ și introduceți următorul cod:
Salvați totul ca spoiler.js.
Acum trebuie să descărcați spoiler.js pe site-ul dvs. Puteți face acest lucru cu FTP. Puteți pune fișierul în folderul de încărcări al site-ului dvs., atunci nu trebuie să schimbați următorul cod, acesta trebuie să fie scris după cel precedent între etichete
:
Apoi, trebuie să conectați stilurile la spoilerul nostru. La sfârșitul fișierului style.css introducem codul:
Articole similare
