Sfaturi pentru modificarea unei teme wordpress

Posted on

Destulă lume mi-a cerut părerea in legătură cu mici modificări pe care sa le aducă temei de pe blog (o pozitionare diferită a meniului, un spatiu mai mare între anumite elemente). Din ce am constatat majoritatea nu au mai facut asta, sunt incepători, si vor sa facă direct (vreau concret sa  schimb modul de afisare al meniului). Eh  dar treaba nu se face chiar asa simplu. Nu se intră direct in miezul problemei, fară a sti chestiile de bază.

De aceea dacă vrei să-ti customizezi  o temă, să o faci cum vrei tu (în fond aici e problema, tu vrei sa arate cum iti place ție) în primul rând trebuie sa cunosti bazele HTML-ului, CSS-ului, probleme de layout, poate si putin .php dacă vrei sa faci ceva mai  “advanced”. Slavă Domnului sunt pe net o multime de tutoriale n-ar strica să arunci un ochi peste ele.  Dacă nu ai parcurs ăstea sincer nu mai are rost să te apuci, nu vei invăta logic.

Ce am mai observat e  că nu se cunosc toolurile potrivite pentru asemenea modificari. Din experientă (cu ce am lucrat eu) pentru niste chestii basic sunt indispensabile următoarele:

  • Mozilla Firefox într-o variantă stabilă , este cel mai bun browser pentru debug de cod. De ce varianta stabilă pentru că o sa instalati addons-uri pe ea si să nu aveti probleme de compatibilitate and other stuff. Ca addons-uri recomand Firebug (mai simplu il instalezi din Mozilla Tools-Addons). In momentul de față e cel mai bun debugger existent, stie sa facă multe (o să vedeti mai jos)
  • Un alt addon pe care-l vad folositor e ColorZilla. Cu el puteti vedea codul de CSS, RGB al oricărei culori dintr-o pagină web.

Ar mai fi si alte addosn-uri, eu zic ca astea-s suficiente pentru chestii basic. Dacă folosiți si altele, le puteți împărtăsi cu noi.

  • Pentru editare de .php, .html. fisiere .css recomand Notepad++ cunoaște aproape toate formatele de limbaje de programare, formatează textul încât să fie ușor descifrabil. Bănuiesc ca e clar avantajul acestuia fata de editorul de teme implicit al wordpress-ului.
  • Ca si client de ftp recomand Filezilla simplu, intuitiv, cred ca sunteti obisnuit cu el si il folosiți.

Pentru inceput hai să facem cunostință cu Firebugul , cu ce se poate face cu el. Marele avantaj al acestuia față de alte instrumente de dezvoltare e că de cele mai multe ori modificările se văd “live”, adică ai modificat mărimea fontului, imediat se vede in pagină.  După ce-l instalați familiarizati-vă cu el.

Tabul de consola (pentru chestii basic nu prea e folositor). Dacă e activat in marea majoritate a cazurilor va afisa erorile de la pluginuri, erori de la jQuery-ul meniurilor😀

Tabul de  HTML care pe noi ne interesează cel mai mult.

Să presupunem că vrem să modificăm divul  de meta al postului postMetaSingle (un border bottom, o spatiere jos). Ne folosim  de Colorzilla pentru a gasi culoarea ce vrem sa o aplicăm .




Dacă de exemplu ne interesează un stil ce se aplică unui element verificarea se poate face usor.

  • Mi s-a semnalat  ca la articolul ăsta footerul e pozitionat aiurea (in dreapta) si nu jos cum ar trebui să fie normal. In 99% din cazuri această problemă se datoreaza unor taguri  de html neinchise corect. Ce rămâne de făcut e verificare tuturor div-urilor  atât  inainte de divul respectiv , si mai rar după. La mine pe dreapta era o listă a aplicatiilor Android folosite de pe appbrain.com si ea era problematica.
  • Pentru probleme de font (caractere lipsă din titlu, caractere ciudate in loc de diacritice) incercați să gânditi problema logic. Dau un exemplu: nu mi se văd diacriticele din titlu. Ok unde nu se văd, să zicem că  in pagina de home, in pagina postului individual e ok. Atunci problema s-ar putea datora unui plugin care nu functionează corect, ce vă rămâne de făcut e să le dezactivati pe rând . Să zicem că problema  asta este peste tot atunci  e de la o encodare ceva sau de la temă. Unele teme aplică fonturi speciale, și dacă acele fonturi nu au caracterele romanesti atunci e clară treaba.

PS:  Articolul o sa continue o să mai adaug alte chestii, acum ma duc ca am ceva treaba😀.

13 thoughts on “Sfaturi pentru modificarea unei teme wordpress

    Florea Cristian said:
    January 8, 2011 at 12:38 PM

    Cateva chestii putin offtopic, daca nu-ti e cu suparare. Dupa ce le rezolvi, poti sterge comentariul meu.

    In primul rand, ai uitat sa pui link la penultima imagine. Tre sa-i dai View Image si sa stergi 300×187 din link. multi nu stiu daca se pricep sa faca asta.

    In al doilea rand, pluginul tau care-ti arata imaginile cand dai click nu-ti permite sa treci de la o poza la alta, iar asta-i suparator. tre’ sa dai click pe poza, apoi X, apoi click pe urmatoarea, apoi X si asa mai departe. Iti recomand Shutter Reloaded.

    In rest, informatia e buna. Cred ca in titlu ai mancat un „i” la stii.

    Nu vreau sa par rautacios, dar vreau ca articolul sa fie cat mai ok😀

      yoncy said:
      January 8, 2011 at 4:37 PM

      O sa ma uit inca nu e pus totul la punct , despre faza aia cu ultima imagine din alea 3 nush nu e vina mea ca nu merge fancy box-ul ala. Oricum nu am mai stat sa modific. E facut asa la repezeala ca ma intreba toata lumea🙂. Oricum in seara asta nu stau de el ca beau😀. O sa se rezolve toate pe parcurs.

    ihearlights said:
    January 8, 2011 at 12:50 PM

    Bah, ii fain articolul. Fii doar putin mai ordonat in ceea ce scrii. In rest, il gasesc foarte util.

    Ah…vezi ca ti s-a busit footerul:d

    […] This post was mentioned on Twitter by Daniel Chetroni and others. Daniel Chetroni said: RT @yoncy_bv: Rapid asa #peblog Chestii basic de modificare a unei teme wordpress http://bit.ly/ezEP3V un RT ar fi binevenit, incepato … […]

    Cristi Mosora said:
    January 8, 2011 at 4:30 PM

    Asteptam continuarile🙂

    PS. Vezi ca la poza a 5-a nu e link, si footerul apare in dreapta formularului de comentarii.

      yoncy said:
      January 8, 2011 at 4:39 PM

      man din pacate la .asp-ul tau multe din chestiile astea nu se pot aplica, se genereaza totul de la inceput si gata :d

        Cristi Mosora said:
        January 8, 2011 at 5:11 PM

        La .asp nu ma bag, ca imi prind urechile, dar la blogul LucruriGratis eu am mesterit tot ce e pe acolo🙂
        PS. sper ca se accepta cod html la comentarii, daca nu, poti sa il stergi.

    Manuel said:
    January 27, 2011 at 6:37 PM

    Ei, daca ai un framwork cumparat, asa cum este Thesis, faci modificari de te plictisesti. Eu folosesc Chrome si dau Inspect element sa vad care sunt regulile din foile de stil acre i se potrivesc. Notepad++ si Filezilla sunt parteneri vehchi de lucru.😀 Am vazut ca cele mai multe modificari, ce tin de design, le faci linistit din Css. Mai complicat este cand vrei sa izolezi elemente din pagina pentru ca nu stii exact in ce fisier php sunt atunci cand vrei sa intri pe acolo si sa faci buricul mare. Oricum, pe mine Thesis m-a scapat de mult a bataie de cap. Normal la 70$ cat costa…

    Dumy said:
    September 23, 2011 at 1:14 PM

    Salut,
    Ajuta-ma si pe mine te rog cu o chestiuta.Am instalat tema wp-chatter pe un site si ma tot chinui de cateva zile sa ii scot din header ce se vede in spatele titlului.Ca sa intelegi mai bine intra te rog aici http://www.test.casecugradini.com (nu imi fac reclama deoarece linkul nu duce la un site adevarat ci la un site in care testez tot felul de teme si pluginuri inainte de a le instala pe site-ul principal)

    cornel said:
    December 12, 2011 at 6:34 AM

    Salut. Iti poti da cu parerea pentru eroarea asta?
    Fatal error: Call to undefined function get_template_part() in /home/credeu/public_html/wp-content/themes/fastfood/functions.php on line 1351

    Am instalat o tema pe care wordpress q punea la liber si mi-a dat eroarea asta, fie ca accesez situl online, fie ca incerc sa intri in panel.Multumesc.

      yoncy said:
      December 12, 2011 at 5:27 PM

      Salut, mai mult ca sigur ai downloadat si instalat o tema incompleta, nu sunt toate fisierele .php etc. El incearca sa se foloseasca de functia aia probabil sa afiseze ceva si functia nu exista. Ce aide facut ? Probabil sa gasesti tema completa, sau sa cauti functia pe altundeva sau sa o adaptezi. Am gasit ceva pe aici http://voodoopress.com/get_template_part-in-my-wordpress-theme/ poate te ajuta. Se pare ca sunt ceva fisiere .php lipsa.

        cornel said:
        December 13, 2011 at 7:03 AM

        E posibil sa fie asta motivul. Ideea este ca nu e prima tema schimbata. Si nu stiu ce as putea face daca aceeasi eroare imi da cand vreau sa ma loghez in panoul administrator. Multumesc pentru raspuns.

    Johnd172 said:
    August 28, 2014 at 6:03 AM

    I got what you intend, thankyou for putting up.Woh I am lucky to find this website through google. Being intelligent is not a felony, but most societies evaluate it as at least a misdemeanor. by Lazarus Long. eebbkedebbbg

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s