Cautare in site

Articol

Plugin pentru crearea regulilor CSS personalizate in WordPress

Plugin pentru crearea regulilor CSS personalizate in WordPress

Personalizarea aspectului temelor in WordPress se poate realiza pe mai multe cai printre care cele mai utilizate sunt:

1. Crearea unei teme child (citeste articolul complet despre crearea temelor child in WordPress);

2. Editarea directa a fisierului style.css prezent in tema activa (metoda nerecomandata – implica eliminarea regulilor personalizate la actualizarea temei. Editarea se poate face de la Appearance – Editor selectand in partea de jos dreapta numele foii de stil. Este recomandabila realizarea unui back-up local al foii de stil inainte de actualizarea temei);

3. Utilizarea optiunilor Theme Settings (integrarea posibilitatii de a scrie CSS personalizat utilizand optiunile Theme Settings este disponibila in general pentru temele cu plata (Premium). Prin aceasta metoda se creaza de obicei un fisier custom.css in folder-ul temei utilizate);

4. Instalarea unui plugin pentru crearea unui fisier CSS personalizat (este o optiune utilizata mai ales pentru integrarea temelor gratuite ce nu dau posibilitatea crearii automate a unui fisier custom.css utilizand optiunile Theme Settings).

Dupa ce intr-un articol precedent am prezentat modul in care se poate realiza un Child Theme in WordPress, in acest articol vom prezenta un plugin ce ne da posibilitatea adaugarii de CSS personalizat si vom vedea cum functioneaza acesta.

Simple Custom CSS WP Plugin
Acest plugin, dezvoltat de John Regan si Danny van Kooten, poate fi descarcat din sectiunea Plugins de pe site-ul wordpress.org

Cum functioneaza?
Pentru a incepe sa creiem reguli CSS personalizate vom merge in panoul Appearance unde vom reagsi optiunea Custom CSS.

Simple-Custom-CSS-Plugin

Acest plugin nu genereaza un nou fisier custom.css in site (ca in cazul modificarilor realizate prin panoul Theme Options). Acesta in schimb salveaza regulile CSS personalizate prin intermediul unui fiser simple-custom-css.php direct in tabelul Options in Baza de Date.

Link-ul la CSS in partea de head a paginilor se realizeaza printr-ul link custom de acest fel:

<link rel="stylesheet" href="http://yoursite.com/?sccss=1" />

Datorita faptului ca sunt salvate in Baza de Date regulile CSS vor fi disponibile atat la schimbarea temei active cat si la actualizarea acesteia.

Ce tip de reguli CSS pot fi scrise utilizand acest plugin?
In cadrul CSS-ului personalizat putem rescrie atat reguli existente cat si reguli noi, ce nu se regasesc in css-ul temei. Regulile CSS scrise aici vor avea prioritate in fata celor cuprinse in tema.

Avantajele utilizarii unui plugin pentru generarea de CSS personalizat
– Totul se poate face din panoul de control WP fara conectarea prin ftp ceea ce reduce timpul de lucru;

– Prin generarea de CSS personalizat utilizand un plugin regulile scrise vor fi disponibile si pentru alte teme. In cazul instalarii unei alte teme pentru site (in cazul unui restyling) vom mentine CSS-ul personalizat utilizat pentru tema precedenta. De ce ar trebui sa mentinem CSS-ul daca schimbam tema? Aceasta optiune poate fi utila de exemplu pentru mentinerea proprietatilor tag-urilor principale cum sunt a (pentru link-uri), h1 (pentru titluri) etc pe care le putem mentine pe culoarea principala a brand-ului pentru orice tema utilizam etc.

Alte plugin-uri pentru crearea de CSS personalizat
Jetpack by WordPress.com – acest plugin ofera multiple optiuni de personalizare a site-ului printre care si posibilitatea de a adauga CSS personalizat. Dupa activarea plugin-ului foaia de stil CSS custom va putea fi accesata de la Appearance – Edit CSS.



Curs Complet WordPress Online – 70 de lectii video marca Multimedia Creations Academy