Personalizzare articoli e pagine con codice CSS e JS specifico

Per personalizzare articoli e pagine con codice CSS e JS specifico, seguire i seguenti metodi.

METODO 1

Con il Metodo 1 verranno creati due text input nei quali inserire il nome di file CSS e JS, che permetteranno di collegare quest’ultimi ad un articolo o una pagina, per le proprie personalizzazioni.

Copiare il seguente codice nel file “functions.php”.

Successivamente creare, all’interno del tema WordPress, una cartella denominata “css” ed una cartella denominata “js”.

All’interno della cartella “css” creare un file denominato “custom-style.css” e inserire all’interno le proprie personalizzazioni; di seguito è mostrato un esempio.

All’interno della cartella “js” creare un file denominato “custom-scripts.js” e inserire all’interno le proprie personalizzazioni; di seguito è mostrato un esempio.

Recarsi nel menù articoli o pagine, passare con il mouse sul titolo dell’articolo o della pagina da personalizzare e cliccare su Modifica; subito dopo l’editor di testo del contenuto saranno presenti due nuovi box denominati “Nome del file css personalizzato” e “Nome del file js personalizzato” come da immagine.

box-custom-file-css-js

Inserire all’interno del box “Nome del file CSS personalizzato” il nome del file creato in precedenza “custom-style.css”, mentre nel box “Nome del file JS personalizzato” il nome del file creato in precedenza “custom-scripts.js”; salvare e verificare il risultato.

METODO 2

Con il Metodo 2 verrà creato un box al cui interno inserire codice CSS inserito tra i tag <style></style>, e codice JS inserito tra i tag <script></script>, per le proprie personalizzazioni.

Copiare il seguente codice nel file “functions.php”.

Successivamente recarsi nel menù articoli o pagine, passare con il mouse sul titolo dell’articolo o della pagina da personalizzare e cliccare su Modifica; subito dopo l’editor di testo del contenuto sarà presente un nuovo box denominato “Custom CSS-JS” come da immagine.

box-custom-cssjs

Inserire all’interno le proprie personalizzazioni; di seguito è mostrato un esempio.

NB! Il codice CSS deve essere inserito tra i tag <style></style>; il codice JS deve essere inserito tra i tag <script></script>.

Salvare e verificare il risultato.

Conclusioni e considerazioni

Il Metodo 1 permette di collegare un file CSS ed un file JS, ad un articolo o ad una pagina, al cui interno inserire le proprie personalizzazioni, quindi è più indicato per personalizzare in blocco più articoli o pagine.

Il Metodo 2 permette di personalizzare ogni singolo articolo o singola pagina in maniera unica e diversa in quanto le stesse personalizzazioni possono essere effettuate all’interno del box presente negli stessi articoli e/o pagine.

I commenti sono chiusi