Crearea buclei WordPress și personalizarea CSS

Presupunând că ați finalizat partea 1, în această secțiune vom crea bucla WordPress și vom personaliza CSS-ul. Bucla WordPress este un cod PHP folosit de WordPress pentru a afișa conținut pe site-ul dvs. Pentru a edita bucla, trebuie să fii familiarizat cu PHP. Dacă nu sunteți, există o mulțime de resurse disponibile online pentru a vă ajuta să învățați elementele de bază. Când aveți o înțelegere de bază a PHP, deschideți editorul de text și creați un fișier nou numit loop.php. În acest fișier, vom crea bucla WordPress. Primul lucru pe care trebuie să-l faceți este să spuneți WordPress să încarce fișierul header.php pe care l-am creat în partea 1. Adăugați următorul cod la loop.php: Apoi, trebuie să creăm bucla WordPress. Bucla este responsabilă pentru afișarea întregului conținut de pe site-ul dvs. Face acest lucru prin bucla prin toate postările din baza de date WordPress și afișându-le pe pagină. Pentru a crea bucla, adăugați următorul cod la loop.php: Acest cod verifică dacă există postări în baza de date WordPress. Dacă există postări, va trece prin fiecare și le va afișa pe pagină. Acum că avem bucla configurată, trebuie să adăugăm conținut în interiorul acesteia. Pentru acest exemplu, vom afișa doar titlul și conținutul fiecărei postări. Adăugați următorul cod în buclă: Acest cod afișează titlul și conținutul fiecărei postări. Acum că avem bucla configurată, trebuie să adăugăm niște CSS pentru a o stiliza. În editorul de text, creați un fișier nou numit style.css. Adăugați următorul cod la style.css: .post { margin-bottom: 40px; } Acest cod adaugă o marjă în partea de jos a fiecărei postări. Acest lucru va ajuta la distanțarea postărilor de pe pagină. Acum că avem bucla și CSS configurate, trebuie să mai adăugăm câteva fișiere la tema noastră. În editorul de text, creați un fișier nou numit footer.php. Adăugați următorul cod la foote

(Partea 2) Ce face Bootstrap pentru o temă WordPress și de ce este atât de populară. Acest tutorial este partea a doua dintr-o serie de tutoriale care vă vor ghida prin procesul de creare a unei teme WordPress de la zero cu cadrul CSS Bootstrap. Aceasta este a treia și ultima secțiune a discuției noastre despre crearea zonei de antet , navigare, bară laterală și zone de subsol. Pentru a marca blogul ca activ, sloganul și numele blogului vor fi acum afișate în partea de sus a paginii. În zona de subsol, va exista un widget numit Footer – Copyright Text. Următoarele sunt câteva opțiuni pentru încorporarea acestei secțiuni în WordPress. O temă WordPress este widgetizată prin adăugarea de widget-uri și zone de widget-uri suplimentare.

Pentru a începe funcția bootstrapstarter_widgets_init(), adăugați următoarele linii în fișierul footer.php: footer-copyright-text și sidebar-module-inset. Există două bare laterale aici: una cu un fundal gri și cealaltă cu un fundal negru. Când vă uitați pentru prima dată la șablonul de pornire, apare un fundal portocaliu pentru widget-ul de sus al widget-ului (Despre), iar dacă introduceți un titlu, acesta va fi împachetat automat în etichete h4. Folosind dynamic_sidebar() putem afișa widget-uri alocate zonei numită Footer – Copyright Text. Creați o bară laterală completă a blogului folosind instrucțiunile pas cu pas din acest tutorial pas cu pas. Fișierul final index.php conține rezultatele: Funcția Rezultate, care poate fi găsită imediat după zona blogului . Aceasta este versiunea finală a lucrării care poate fi descărcată aici.

De asemenea, este prevăzut cu remedieri CSS și ajustări pentru bara de navigare și barele laterale. Pe această pagină, s-ar putea să întâlniți link-uri externe afiliate care pot duce la plata unui comision către LyraThemes.com dacă le utilizați. Nu facem nicio declarație sau pretenție cu privire la opiniile sau recenziile noastre scrise pe această pagină.

Putem folosi tema Bootstrap în WordPress?

Cel mai simplu mod de a folosi Bootstrap în WordPress este să activați o temă receptivă care o acceptă deja. Cu Bootstrap, îl puteți utiliza fără a fi nevoie să îl descărcați sau să îl instalați de la dezvoltatorul temei, deoarece cadrul este inclus în multe dintre temele lor.

Instalarea unei teme sau a unui plugin nu este la fel de simplă ca crearea unui site web Bootstrap cu WordPress. Pentru a crea o temă WordPress, trebuie să aveți un cont de găzduire WordPress. Utilizând Bootstrap ca bază, WordPress și Bootstrap pot lucra împreună. Multe detalii tehnice sunt ascunse sub interfața prietenoasă a ambelor sisteme. Nu veți putea crea o temă WordPress de la zero foarte des. Pentru a înțelege o temă WordPress bazată pe Bootstrap, copiați câteva dintre fișierele necesare dintr-o versiune anterioară. Tema se va numi WPBootstrap și directorul va primi același nume (în litere mici).

Cum pot adăuga Bootstrap la o temă WordPress? Există mai multe opțiuni. Următoarele sunt bibliotecile Bootstrap CSS și JavaScript pe care le puteți încorpora în fișierele header.php și footer.php. O imagine de previzualizare poate fi adăugată temei prin încărcarea acesteia în directorul de teme și apoi folosind fișierul screenshot.png. Este multă muncă pentru a crea o temă WordPress, așa că recomand să copiați fișierele dintr-o altă temă. Deoarece Bootstrap are propriul set de reguli și practici, trebuie urmată și procedura de învățare a acestora. De fapt, atât WordPress, cât și Bootstrap au comunități pasionate, așa că nu știi niciodată ce va urma.

Este Bootstrap mai bun decât WordPress?

Dacă abia sunteți la început și nu știți prea multe despre design web, folosirea Bootstrap este o idee bună, deoarece este ușor de învățat și utilizat. Dacă doriți să vă îmbunătățiți abilitățile de design de site -uri web, WordPress poate fi opțiunea mai bună.

Când dezvoltați un site web, este dificil să decideți între Bootstrap și WordPress. Aici, vom trece peste o comparație rapidă a Bootstrap și WordPress, precum și o defalcare completă a fiecăruia. Folosind această metodă, puteți decide care este cea mai potrivită platformă pentru site-ul dvs. Site-urile bootstrap sunt mai puțin costisitoare de încărcat decât site-urile WordPress. Site-urile web create cu Bootstrap pot fi accesate de pe orice dispozitiv. Cele mai bune site-uri WordPress funcționează cel mai bine pe ecrane mari, fie pe computere, tablete sau laptopuri. Trebuie să fiți programator pentru a putea face SEO pe pagină pentru site-ul sau paginile dvs. în Bootstrap.

React-Bootstrap este o bibliotecă care combină puterea lui React și flexibilitatea lui Bootstrap. Bootstrap 4 este o platformă robustă, cu design receptiv, design consistent și toate caracteristicile care îi lipsesc. Nu veți avea probleme să vă puneți în funcțiune, deoarece este foarte simplu de utilizat și simplu de învățat. React-Bootstrap este o bibliotecă fantastică pentru crearea de aplicații web de înaltă calitate, receptive.