Dacă nu suntem programatori, dar avem totuși minime cunoștințe de CSS și HTML, sau vrem să încercăm ceva nou (poate tocmai am făcut un curs online de noțiuni introductive de CSS și HTML), și vrem să modificăm unele elemente din tema instalată, trebuie să avem cumva acces la cod, fără a-l strica.

Pentru un programator modificarea codurilor de CSS și HTML este un lucru simplu. Ei copiează fișierul dorit în tema child și-l modifică cum dorește. Dau, scrie în fișierul style.css implicit. Dar uneori chiar și pentru un programator de profesie metoda asta de modificare a codului poate fi peste mână. Adică? Adică nu are acces nici la FTP, nici la cPanel și nici la fișiere din adminul site-ului (scriere fiind blocată).

Așadar, cum putem adăuga CSS nou fără să modificăm fișierele de stil?

Există mai multe metode, dar în acest tutorial voi vorbi despre modulul: Simple Custom CSS.

Ce este Simple Custom CSS?

Simple Custom CSS este un modul WordPress, ușor de utilizat, folosit pentru a adăuga stiluri CSS personalizate, care înlocuiesc stilurile implicite din module și temă. Acest modul este conceput pentru a răspunde nevoilor administratorilor ce doresc să adauge propriul CSS pe site-ul WordPress, fără a modifica fișierele.

Atenție! Stilurile create cu acest plugin vor fi salvate și utilizate chiar dacă tema este schimbată.

Caracteristici

  • Control vizual (previzualizare live)
  • Evidențiează sintaxa
  • Verificarea erorilor
  • Nu este necesară configurare
  • Interfață simplă, construită pe UI WordPress nativ
  • Practic nu are impact asupra performanței site-ului
  • Nu există interogări complicate la baza de date
  • Documentare bună
  • Permite accesul administratorului în rețele WP (mai multe site-uri)

Instalarea modulului Simple Custom CSS

Simple Custom CSS este un plugin (modul), așadar se instalează la fel ca oricare alt modul.

Pentru început trebuie să fiți autentificat în WordPress ca administrator, apoi din Module → Adaugă modul scrieți în câmpul de căutare numele modului: Simple Custom CSS.

simple-custom-css-1

Click pe Instalează acum, apoi pe Activează. Modulul va fi vizibil și accesibil din meniul Aspect.

simple-custom-css-2

Rezultatul arată ca mai jos:

simple-custom-css-3

În câmpul principal, unde scrie

/* Enter Your Custom CSS Here */

se poate ad[uga codul CSS dorit. Acesta poate adăuga proprietăți noi sau poate modifica unele existente. Codul scris aici suprascrie codul CSS din fișierele temei active, sau a modulelor.

Atenție! Nu uitați să faceți clic pe „Update Custom CSS” la final.

Notă: Un avantaj (sau dezavantaj) al utilizării acestei metode este că CSS-ul dvs. personalizat va fi disponibil chiar și atunci când vă schimbați tema.