Cum de a Crea și Personaliza un WordPress Temă Copil

Dacă vă place tema actuală, dar doresc să-și modifice caracteristicile și modul corect de a face acest lucru este prin personalizarea acestuia temă copil. Acest tutorial va explica de ce această practică este necesară și vă va ghida prin proces, astfel încât să puteți crea și edita o temă WordPress pentru copii, indiferent de abilitățile dvs. tehnice.de asemenea, puteți crea și personaliza cu ușurință teme cu Hostinger ‘ s WordPress Hosting!,de ce ar trebui să utilizați WordPress Teme pentru copii

deoarece o temă copil moștenește caracteristicile unui master sau o temă părinte, puteți personaliza codul său fără a rupe funcționalitatea originalului. În acest fel, dacă o temă primește o actualizare, toate modificările pe care le-ați făcut nu vor fi suprascrise.

Un alt motiv pentru a utiliza o temă pentru copii este că oferă o soluție sigură dacă vă încurcați vreodată editările. În plus, vă permite să urmăriți eficient părțile pe care le-ați schimbat, deoarece fișierele unei teme pentru copii sunt separate de cele ale părinților.,așa cum am făcut aluzie pe scurt mai devreme, o temă copil este stocată într-un director separat de tema părinte, fiecare cu propriul său stil.css și funcții.fișiere php. Puteți adăuga alte fișiere după cum este necesar, dar cele două sunt minimul necesar pentru ca o temă copil să funcționeze corect.

folosind relevante .css și .php, puteți modifica totul, de la styling, parametrii de aspect la codificare reală și script-uri utilizate de o temă copil, chiar dacă atributele nu sunt prezente în tema părinte.

gândiți-vă la ea ca la o suprapunere., Când un vizitator îți încarcă site-ul, WordPress încarcă mai întâi sub-tema și apoi umple stilurile și funcțiile care lipsesc folosind părți din tema principală. Drept urmare, obțineți cele mai bune rezultate din designul personalizat, fără a sacrifica funcționalitatea de bază a temei.

crearea unei teme pentru copii în WordPress

următoarele instrucțiuni folosesc Twenty Seventeen ca bază. Puteți utiliza o altă temă, dacă preferați. De asemenea, vom folosi managerul de fișiere Hostinger pentru a adăuga și edita fișierele, deși FTP funcționează și el.,

acum, fără alte formalități, iată cum să creați o temă copil în WordPress:

  1. accesați hPanel și faceți clic pe Manager fișiere.
  2. Navigați la public_html -> wp-content -> folderul teme.
  3. creați un Folder nou făcând clic pe pictograma acestuia din meniul superior. Introduceți numele temei copilului dvs. și faceți clic pe Creare. Este recomandat să folosiți numele temei părinte urmat de sufixul a-child. În acest exemplu, am numit dosarul twentyseventeen-child.,important: înlocuiți spațiile dintr-un folder sau numele unui fișier cu cratime ( – ) pentru a preveni erorile.

  • în interiorul folderului, creați un stil.fișier css. Populați conținutul său cu următorul cod:
    /* Theme Name: Twenty Seventeen Child Theme URL: http://yourdomain.comDescription: Twenty Seventeen Child Theme Author: Your NameAuthor URL: http://yourdomain.comTemplate: twentyseventeen Version: 1.0.0 Text Domain: twentyseventeen-child */
  • modificați toate valorile în consecință. Cel mai important câmp este șablonul, deoarece spune WordPress pe ce temă părinte se bazează tema copilului tău. După ce ați terminat, faceți clic pe Salvați și închideți.
  • creați un alt fișier numit funcții.,php în același dosar, dar nu-l umple cu codul din fișierul temei părinte, deoarece trebuie să rămână separat. În schimb, copiați și inserați codul de mai jos pe blank de fișier și salvați-l:
    <?phpadd_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );function enqueue_parent_styles() { wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );}?>
  • Vizitați site-ul și accesează-Aspectul -> Temă. Activați tema copilului pe care tocmai ați făcut-o și veți observa că arată la fel ca tema părinte.după cum puteți vedea, crearea unei teme WordPress pentru copii nu este mai complicată decât lucrul cu o temă master!,pentru a personaliza tema copilului, aveți nevoie de o înțelegere de bază a regulilor CSS și a cunoștințelor despre cum să inspectați elementele, astfel încât să puteți identifica codul CSS și clasa la care sunt atribuite.acum, să aruncăm o privire la elementele de bază ale personalizării unuia. Pentru a efectua acest lucru, faceți clic pe Personalizare -> CSS suplimentar din tema copilului activ.,

    Schimbarea Culorii de Fundal

    se Introduce următoarea regulă CSS, dacă doriți să modificați culoarea de fundal a WordPress temă copil:

    .site-content-contain { background-color: #DEF0F5; position: relative;}

    valoarea viitoare a background-color: corespunde codul hex de culoare pe care o alegeți., În acest exemplu, din moment ce se schimbă de la alb la albastru deschis, rezultatul arată astfel:

    Schimbarea Laterală de Culoare

    puteți crea un aspect plăcut ecranul de widget-uri prin adăugarea unor culoare la bara laterală cu următorul cod CSS:

    .widget {background: #B9EBFA;padding: 25px;}

    din Nou, nu uita pentru a edita codul de culoare corespunzător. Ar trebui să obții un rezultat ca acesta:

    Schimbarea tipurilor, dimensiunilor și culorilor fontului

    pentru a schimba tipul, dimensiunea și culoarea fontului temei tale WordPress child, introdu codul de mai jos:

    p {color: teal;}p {font-family: Georgia;font-size: 18px;}

    eticheta p vine de la paragraf., După cum puteți vedea mai jos, regula de mai sus a schimbat aspectul fonturilor paragrafului pe baza valorilor specificate.

    pentru a schimba fontul altor părți de text, cum ar fi titlul sau antetul, inspectați elementele pentru a vedea mai întâi parametrii CSS. De dragul ilustrației, să încercăm să schimbăm culoarea fontului titlului.

    1. mai întâi, faceți clic dreapta pe text și selectați inspectați. Localizați linkul de stil CSS și deschideți-l într-o filă nouă.
    2. găsiți partea exactă pe care o căutați folosind CTRL+F și copiați codul în fila CSS suplimentară. Modificați valorile în consecință.,puteți face același lucru cu orice alte elemente pe care doriți să le modificați.la fel cum CSS-ul personalizat al unei teme pentru copii WordPress înlocuiește stilul temei sale părinte, fișierele șablon vă permit să vă creați propriile machete revocându-le pe cele implicite.noul șablon trebuie să aibă același nume de fișier și să fie în folderele care corespund originalului. Este o idee bună să copiați fișierul șablon principal în directorul dvs. de teme WordPress pentru copii și să lucrați din asta.

      fișierele șablon principale sunt în dosarul principal al temei., De exemplu, șablonul pentru vizualizarea unei singure postări este unic.php, iar șablonul pentru pagini este page.php.douăzeci și șaptesprezece își împarte șabloanele în părți-șablon la care se face referire în șablonul principal folosind funcția WordPress get_template_part(). De exemplu, dacă doriți să editați pagina.php, puteți începe prin localizarea părților șablonului pentru a vedea dacă acestea sunt biții pe care trebuie să îi editați. În fișierul nostru exemplu, linia 28 citește:

      get_template_part( 'template-parts/page/content', 'page' );

      cum citim acest lucru? template-parts / page / este calea folderului., Între timp, „conținut” se referă la caracterul din numele fișierului înainte de cratimă și „pagina” este după cratimă.împreună formează calea completă a wp-content / themes/twentyseventeen/template-parts/page / content-page.php.

      urmând structura, dacă doriți să modificați aspectul de conținut-pagină.php, trebuie să-l copiați în folderul temă copil și puneți-l în această locație: wp-content/themes/twentyseventeen-child/template-parts/page/content-page.php.

      și asta este, Editare fericită!,

      Adăugarea și eliminarea caracteristici

      Un alt avantaj semnificativ de a crea o temă WordPress copil este capacitatea de a avea o funcții separate.fișier php, care, la fel ca plugin-uri, este folosit pentru a adăuga (sau elimina) anumite caracteristici folosind codul PHP.

      de exemplu, următoarele linii vor dezactiva funcția de clic dreapta din tema dvs.:

      concluzie

      temele pentru copii WordPress oferă o modalitate puternică de a crea un proiect complet nou bazat pe caracteristicile temei master existente, fără a-i rupe funcția principală., Cu un pic de codificare simplă și de gestionare a directoarelor, puteți modifica tema copilului cât de puțin sau cât doriți, oferind o gamă largă de posibilități pentru designul dvs.

  • Lasă un răspuns

    Adresa ta de email nu va fi publicată. Câmpurile obligatorii sunt marcate cu *