Navigacija WordPress stranice ne radi. Jedinstvena navigacija WordPress stranice za vaš blog. Kako pokrenuti WP-pagenavi dodatak

Pozdrav, dragi čitatelji bloga. Danas ćemo govoriti o vrlo popularnom dodatku WP-PageNavi koji vam omogućuje da podignete navigaciju stranicama vašeg WordPress bloga na novu razinu.

U principu, navigacija stranicama (paginacija), koja se koristi prema zadanim postavkama, prilično je laka za korištenje, no opcija koju nudi ovo proširenje izgleda puno atraktivnije.

Zašto koristiti WP-PageNavi dodatak

Prosudite sami, ovako izgleda zadana paginacija:

A ovo nakon instaliranja dodatka:

ili ovako:

ovisi o opcijama koje odaberete u prozoru s postavkama.

Po mom mišljenju, druga opcija je puno ljepša od prve, koja je zadana. Ako i vi tako mislite, onda biste trebali pročitati ovaj članak do kraja i naučiti sve o nijansama instalacije i kako konfigurirati ovo prekrasno proširenje.

Najprije ćete morati preuzeti dodatak odavde. Pronađite gumb “Preuzmi” s desne strane i spremite arhivu wp-pagenavi.zip na svoje računalo. Zatim ga raspakirajte i prenesite dobivenu mapu na poslužitelj hostinga u direktoriju s dodacima wp-content/plugins/ .

Da biste to učinili, morat ćete pristupiti datotekama i mapama svog WP bloga putem FTP protokol ().

Prilikom raspakivanja dogodi se da se pojavi dodatna vanjska mapa, pa je provjerite i po potrebi je se riješite. Nadam se da sam jasno objasnio? U suprotnom, WordPress neće vidjeti dodatak koji ste instalirali. U redu, nastavimo.

Nakon što kopirate datoteke dodataka na hosting poslužitelj u mapu wp-content/plugins/, morat ćete otići na WordPress administratorsku ploču (http://vash_sait.ru/wp-admin/) i odabrati “Plugins” iz lijevi administratorski izbornik " Na vrhu prozora "Upravljanje" koji se otvori morate kliknuti na vezu "Neaktivno" (ili, ako nema prijevoda, onda "Neaktivno").

Otvorit će se prozor sa svim instaliranim ali još neaktiviranim proširenjima. Među njima pronađite “WP-PageNavi” i kliknite na poveznicu “Aktiviraj” koja se nalazi ispod njegovog naziva.

Zalijepite izlazni kod dodatka u potrebne WordPress predloške

Dodatak je aktiviran, ali da biste vidjeli rezultate njegovog rada na svom blogu, morat ćete u datoteke svoje teme ubaciti i kod za pozivanje funkcije wp_pagenavi koja se koristi u ovaj trenutak. .

Obično se paginacija koristi na početnoj stranici bloga (INDEX.PHP datoteka iz vaše tematske mape), arhivskim web stranicama (ARCHIVE.PHP) i rezultatima pretraživanja (SEARCH.PHP datoteka). Zapravo, u te datoteke (predloške) morat ćemo umetnuti kod za pozivanje funkcije koja nam je potrebna.

Oni. Morat ćete se ponovno povezati putem FTP-a i otići u mapu s trenutnom temom:

Wp-content/themes/Naziv mape s vašom temom

Pronađite INDEX.PHP u njemu i otvorite ga za uređivanje u uređivaču koji vam odgovara (u tu svrhu koristim napredni NotePad++ - imam članak o radu s njim). Sada je vaš zadatak pronaći dio koda u INDEX.PHP koji je odgovoran za prelazak na prethodnu ili sljedeću stranicu. Nije lak zadatak, zar ne? Iako, naravno, ovisi o kome.

INDEX.PHP nije jako velik, pažljivo proučite njegov sadržaj kako biste potražili komentare koji se odnose na paginaciju, na primjer, ove:

Obično kreatori WordPress tema uključuju takve komentare u područje koda koje je odgovorno za prikaz navigacije stranicom. Sam standardni kod može izgledati, na primjer, ovako:

Nakon što identificirate fragment koji vam je potreban, morat ćete ga zamijeniti linijom poziva funkcije wp_pagenavi:

Sada morate spremiti promjene napravljene u INDEX.PHP, idite na početna stranica svoj blog i provjerite radi li sve kako treba. Oni. Umjesto standardne paginacije koja se koristi u WordPressu, koristite ljepotu WP-PageNavi.

Usput, standardno paginiranje ne treba uklanjati iz INDEX.PHP koda, tako da kada uklonite ovaj dodatak, kasnije nećete imati problema s njim. Da biste to učinili, morat ćete upisati u INDEX.PHP, umjesto standardnog navigacijskog koda, uvjet koji određuje kada će se prikazati standard, a kada panel WP-PageNavi.

Uvjet će ovisiti o tome je li WP-PageNavi dodatak instaliran na vašem blogu ili ne. To bi moglo izgledati otprilike ovako:

U ovom kodu uvjet je:

If(function_exists("wp_pagenavi"))

provjerava je li dodatak instaliran, a ako nije instaliran, pokrenut će se standardna skripta:

Inače (?>

A ako je WP-PageNavi instaliran, tada će navigacijsku traku formirati on:

{ ?>

}

Iako se, naravno, ne morate truditi i jednostavno zamijeniti jedno s drugim, ali to ovisi o vama.

Dakle, sada ćete isto morati učiniti za datoteke ARCHIVE.PHP i SEARCH.PHP iz mape s vašom temom (wp-content/themes/Naziv mape s vašom temom).

Postavke WP-PageNavi dodatka za WordPress blog

Da biste ušli u njih, morat ćete odabrati "Popis stranica" iz lijevog izbornika u području "Opcije" na administrativnoj ploči. Otvorit će se prozor s aktivnom karticom "Predlošci popisa stranica":

U polju “Predložak općeg popisa stranica” na gornjoj slici postavlja se prikaz trenutne stranice i ukupnog broja stranica. S ovom opcijom popunjavanja ovog polja, WP-PageNavi panel će izgledati ovako:

Možete dodati riječ "Stranica" u ovo polje ako želite:

Stranica %CURRENT_PAGE% od %TOTAL_PAGES%

A ako želite, možete ga potpuno očistiti. U stupcima “Element “Trenutna stranica”” i “Element “Stranica”” ostavite sve kako jest. Ovdje možete podesiti prikaz oznake za trenutnu i sve ostale web stranice u obliku serijskog broja. Izgledat će otprilike ovako:

U poljima "Tekst za prvu stranicu" i "Tekst za posljednju stranicu" možete postaviti tekst za prvi i zadnji gumb:

Umjesto teksta u stupac "Tekst za prvu stranicu" možete napisati jedan, a polje "Tekst za posljednju stranicu" - %TOTAL_PAGES% (umjesto ovog natpisa bit će prikazan broj svih web stranica):

U poljima "Tekst". Za Dalje Znakovi strelica "Post" i "Tekst za prethodni post" napisani su tako da se prikazuju na sljedećim i prethodnim gumbima:

Očistio sam sljedeća dva polja, jer... inače su umjesto toga prikazana dva bijela gumba bez teksta. Moguće je da to nećete imati i sami ćete odlučiti za što vam trebaju.

Prijeđimo na daljnje postavke pod nazivom “Postavke popisa”:

Potvrdni okvir u “Use pagenavi-css.css” omogućuje vam da onemogućite ili omogućite kaskadnu stilsku datoteku (CSS) koja dolazi s dodatkom. U polju "Stil popisa" možete odabrati jedan od dva CSS stila s padajućeg popisa.

Vidjeli ste "Normalno" na prethodnim snimkama zaslona, ​​a kada odaberete stil "Padajući popis", dobit ćete nešto poput ovog prikaza ploče WP-PageNavi u WordPressu:

Ako potvrdite okvir "Uvijek prikaži navigaciju po stranici", čak i za web-stranice koje još ne zahtijevaju numeriranje (recimo da još nema dovoljno postova na glavnoj stranici da bi došlo do podjele), navigacija će i dalje biti prikazao nešto ovako:

U "Broj stranica za prikaz" možete postaviti koliko će stranica biti prikazano kao kontinuirani (sekvencijalni) niz brojeva. Prebacivanje na ostatak bit će moguće tipkama za sljedeći i prethodni, kao i tipkama za prebacivanje na prvu i posljednju. Stavio sam pet tamo, što je rezultiralo:

U "Broju većih brojeva stranica za prikaz" možete postaviti koliko će se brojeva udaljenih web stranica (većih od trenutno prikazanih brojeva numeričkih vrijednosti) prikazati nakon sljedećeg gumba.

A u polju "Prikaži veće brojeve stranica u višestrukim brojevima" možete postaviti korak s kojim će se prikazivati ​​brojevi udaljenih web stranica. Recimo da u prvo polje stavim trojku, a u drugo dvojku:

Kao rezultat toga, PageNavi panel će izgledati ovako:

Oni. Brojevi samo triju udaljenih web stranica prikazuju se s intervalom (korakom) jednakim dva (6, 8, 10). Kako ne biste koristili prikaz udaljenih brojeva, samo ćete morati staviti nulu u stupac "Broj većih brojeva stranica za prikaz".

Da biste primijenili i prikazali promjene koje ste naveli, u postavkama dodatka morat ćete kliknuti na gumb "Spremi promjene" koji se nalazi na dnu.

Promjena izgleda navigacijske trake za označavanje stranica

Kako biste promijenili shemu boja, ispunu, fontove i druge atribute izgleda ploče za označavanje stranica prikazane na vašem blogu, morat ćete dodati potrebna CSS svojstva u kaskadnu datoteku lista stilova ovog dodatka.

Istina, kako bi poprimio oblik prikazan na snimkama zaslona u ovom članku, dodao sam dodatna svojstva ne u CSS datoteku dodatka (/wp-content/plugins/wp-pagenavi/pagenavi-css.css), već u datoteku koju sam koristio teme (wp-content/themes/naziv mape s temom/style.css).

U ovoj datoteci CSS svojstva, definiranje izgled WP-PageNavi ploče izgledaju ovako:

#content .wp-pagenavi a, #content .wp-pagenavi a:link, #content .wp-pagenavi a:active ( padding: 3px 8px 3px 8px; margina: 2px; text-decoration: none; color: #fff; border: 0px line-height:24px; background-color: #2b99ff; ) #content .wp-pagenavi a:hover ( color:#fff; background-color: #154b7d; ) #content .wp-pagenavi span.pages ( padding: 3px 8px 3px 8px; margin: 2px 2px 2px 2px; ) #content .wp-pagenavi span.current ( padding: 3px 8px 3px 8px; margin: 2px; line-height:25px; font-weight: bold; color: #add352; pozadina:#26343c; )

Imajte na umu da se nazivi klasa i ID() koji se ovdje koriste odnose posebno na moj predložak. Dopustite mi da objasnim svrhu nekih CSS pravila i svojstava.

#content .wp-pagenavi a, #content .wp-pagenavi a:link, #content .wp-pagenavi a:active ( padding: 3px 8px 3px 8px; margina: 2px; text-decoration: none; color: #fff; border: 0px line-height:24px; background-color: #2b99ff; )

postavlja vanjske i unutarnje margine (pogledajte o njima) za gumbe panela (zapravo, za veze s ovih gumba, budući da će se ta svojstva posebno primijeniti na veze navedene oznakom A i smještene u spremnik wp-pagenav) .

Ovo pravilo također postavlja boju teksta veze (bijela boja je postavljena u svojstvu boje: #fff; - ).

Neće biti okvira oko veza ( granični posjed: 0px), a boja pozadine za spremnike s ovim vezama bit će određena svojstvom background-color: #2b99ff; . Tu boju možete vidjeti na gornjim snimkama zaslona za neaktivne gumbe navigacijske ploče stranice.

CSS pravilo:

#content .wp-pagenavi a:hover (boja:#fff; boja pozadine: #154b7d;)

postavlja boju za tekst i pozadinu spremnika (gumba) s linkom nad kojim se trenutno nalazi kursor miša (CSS svojstva linka kada lebdi - a:hover - ).

Boja teksta veze ostaje bijela, ali boja pozadine (zapravo boja gumba) mijenja se u tamniju boju (boja pozadine: #154b7d;). Oni. Kada posjetitelj prijeđe mišem preko gumba na navigacijskoj traci, vidjet će promjenu boje tog gumba, stvarajući osjećaj interaktivnosti.

CSS pravilo:

#content .wp-pagenavi span.current ( padding: 3px 8px 3px 8px; margin: 2px; line-height:25px; font-weight: bold; color: #add352; background:#26343c; )

Postavlja izgled gumba s brojem trenutno otvorene stranice bloga (oznaka SPAN s klasom CURRENT bit će zapisana u kodu ovog linka). Ovaj će gumb izgledati isto kao gumb broj jedan na slici ispod:

U tome CSS pravilo boja pozadine ovog aktivnog gumba postavljena je na promjenu (pozadina svojstva: #26343c), boja teksta veze na ovom gumbu (boja svojstva: #add352), a osim toga, font teksta veze bit će podebljan zbog ovom CSS svojstvu - težina-fonta: podebljano () .

Ali da biste promijenili izgled navigacijske ploče stranice, možete dodati potrebna CSS svojstva u stilsku datoteku samog dodatka. Ovu kaskadnu datoteku lista stilova možete otvoriti za uređivanje iz mape:

/wp-content/plugins/wp-pagenavi/pagenavi-css.css

Na primjer, da biste dobili ovakvu ploču:

Morat ćete preuzeti ovu arhivu, raspakirati je i kopirati mapu IMAGES u mapu dodatka WP-PageNavi koju možete pronaći na sljedećoj stazi:

/wp-content/plugins/wp-pagenavi

U mapi SLIKE je grafička datoteka fon.gif , koji će činiti pozadinu za PageNavi panel. Sada ćete morati otvoriti datoteku /wp-content/plugins/wp-pagenavi/pagenavi-css.css za uređivanje i tamo zamijeniti kod sa sljedećim pravilima:

Wp-pagenavi ( width: 100%; overflow: hidden; padding: 4px 0px 4px 0px; margin-left: 0px; border: 1px solid #00598F; background: url("images/fon.gif") center left repeat-x ; ) .wp-pagenavi a, .wp-pagenavi a:link, .wp-pagenavi a:visited ( padding: 4px 5px 4px 5px; margina: 2px 0px 2px 0px; boja: #ffffff; težina fonta: podebljano; tekst -decoration: none; ) .wp-pagenavi a.last ( padding: 4px 5px 4px 5px; ) .wp-pagenavi a.first ( padding: 4px 5px 4px 5px; ) .wp-pagenavi a:hover ( background-color: #00598F; boja: #FFFFFF; težina fonta: bold; ) .wp-pagenavi span.pages ( padding: 4px 5px 4px 5px; margina: 2px 0px 2px 0px; boja: #FFFFFF; pozadina: url("images/fon) .gif") centar lijevo ponavljanje-x; boja pozadine: #4f4f4f; težina-fonta: podebljano; ) .wp-pagenavi span.current ( padding: 4px 7px 4px 7px; margina: 2px 0px 2px 0px; težina-fonta: bold; border-top: 1px solid #00598F; border-bottom: 1px solid #00598F; color: #FFFFFF; background-color: #00598F; font-weight: bold; ) .wp-pagenavi span.extend ( padding: 4px 0px 4px 0px; margina: 2px 0px 2px 0px; margina-desno: 0px; margin-lijevo: 0px; border-top: 1px solid #00598F; rub-bottom: 1px solid #00598F; boja: #FFFFFF; pozadina: url("images/fon.gif") centar lijevo ponavljanje-x; font-weight: bold; ) .wp-pagenavi span.next-prev (familija-fontova: Arial; /* IE popravak */ )

Spremite promjene u datoteku pagenavi-css.css i posjetite svoj blog da vidite je li se navigacija promijenila. Ako se nije promijenio, pokušajte osvježiti sadržaj prozora u pregledniku držeći tipku SHIFT, a ako to ne pomogne, izbrišite predmemoriju preglednika.

Sretno ti! Vidimo se uskoro na stranicama bloga

Moglo bi vas zanimati

Easy Social Share Buttons - dodatak za dodavanje gumba društvene mreže u WordPressu, uključujući Vkontakte i Odnoklassniki
Subscribe To Comments for WordPress - pretplata na komentare na članke u WordPressu
Breadcrumbs u WordPressu pomoću dodatka Breadcrumb NavXT (jačanje povezivanja)
Jednostavni brojači i ikone kategorija i stranica - prekrasni RSS i Twitter brojači, kao i ikone za kategorije i stranice u WordPressu
Instalacija i konfiguracija dodataka za WordPress, rješenje mogući problemi
Sve u jednom SEO paketu i internom optimizacija pretraživača WordPress blog (Canonical, Description i Title meta oznake)
Galerija za WordPress temeljena na dodatku NextGEN Gallery - stvaranje i prikaz galerija fotografija i dijaprojekcija u člancima
Google XML Sitemaps - izrada karte web stranice za WordPress
Bolji feed za WordPress - kako se ne podvrgnuti RSS-u puni tekstovi objave i zaštitite se od krađe sadržaja putem kanala vijesti
Ponovno povezivanje stranica web stranice pomoću primjera dodatka upPrev (izvlačna ploča) za WordPress

Samo na sljedeći način: Natrag - Naprijed ili korištenjem takvih poveznica Prethodni - Novi postovi, onda imate standardnu, ne zgodnu navigaciju. Ako imate stotinu i više poruka, to predstavlja veliku neugodnost za posjetitelja. Morate ga promijeniti u nešto prikladnije navigacija stranicom, tako da korisniku bude zgodno da se kreće proizvoljno, odnosno može čak i doći do zadnje stranice vaše stranice.

moderno, lijepa navigacija stranicom za blog WordPress organiziran uz pomoć popularni dodatak WP-PageNavi. Na službenoj web stranici wordpress.org ovaj modul zauzima četvrto mjesto po broju preuzimanja. U trenutku pisanja ovog posta već je preuzet 4.065.194 puta. Na mom blogu možete vidjeti kako praktična navigacija stranicama funkcionira. Ako ste spremni za to na svom web resursu, počnimo.

Navigacija WordPress stranicom pomoću WP-PageNavi dodatka

Navigacija WordPress stranice bloga

Kako instalirati i konfigurirati WP-PageNavi dodatak

Kao što možete vidjeti na snimci zaslona, ​​možete zamijeniti tekst svojim ili ostaviti sve kako jest. Provjerite - Koristi pagenavi-css.css stil ili ne. Ako trebate prilagoditi CSS stil WP-PageNavi ovo se može učiniti u datoteci dodatka. Da biste to učinili, idite na odjeljak "Dodaci" - "Uređivač", odaberite WP-PageNavi kao dodatak za promjenu i pronađite datoteku wp-pagenavi/pagenavi-css.css na popisu koji se otvori. Iz postavki je sve jasno. Sljedeći korak je ovo.

U datotekama index.php, archive.php i search.php vaše teme trebate pronaći pozive next_posts_link() i previous_posts_link() i zamijeniti ih. U temi TwentyTen to izgleda ovako:

To bi moglo izgledati ovako u drugim temama:

Potražite nešto slično i morate ove retke zamijeniti ovim:

Svi. Spreman. Sada će dodatak raditi. Ako stil navigacije ne odgovara vašem dizajnu bloga i želite mu dati poseban izgled, onda trebate pročitati članak dalje.

WP PageNavi dodatak za stil dodaje više opcija boja za Wp-PageNavi

Da, bili ste u pravu, kako biste mogli koristiti gotove stilove za navigaciju stranicama WP-PageNavi, morate instalirati dodatni WP PageNavi Style dodatak od istog programera. Instalirajte ovaj modul na isti način, aktivirajte ga i imat ćete stavku WP PageNavi Style u bočnom stupcu administratorske ploče. Kliknite za konfiguraciju i odabir stila za svoju novu navigaciju:

Postavljanje dodatka WP PageNavi Style

Kao što možete vidjeti na snimci zaslona, ​​možete odabrati razne lijepe ploče i njihov položaj. Skup stilova dodataka:

Skup stilova dodataka WP PageNavi Style Plugin

Kakav sjajan izbor. Ako ne želite koristiti gotove stilove, instalirajte - Custom i prilagodite stil na svoj način:

Svi. Još jedna stvar. Ako ste spremni ručno instalirati navigaciju stranicama, to jest bez dodatka, čitajte dalje.

Kako instalirati WordPress navigaciju stranicom bez dodatka

Ovaj kod je toliko uobičajen da ne znate na koji se blog povezati. Dakle, možemo i bez toga.

Otvorite datoteku "Funkcije teme" (functions.php), pomaknite se prema dolje po stranici i prije završne oznake ?> zalijepite sljedeći kod (ne zaboravite to učiniti sigurnosna kopija, ako radi, što nije u redu:

Funkcija navigation() ( globalno $wp_query, $wp_rewrite; $pages = ""; $max = $wp_query->max_num_pages; if (!$current = get_query_var("paged")) $current = 1; $a["base "] = str_replace(999999999, "%#%", get_pagenum_link(999999999)); $a["total"] = $max; $a["current"] = $current; $total = 0; //1 - prikaži tekst "Stranica N od N", 0 - ne prikaži $a["mid_size"] = 3; //koliko poveznica prikazati lijevo i desno od trenutne $a["end_size"] = 5 ; //koliko poveznica prikazati na početku i na kraju $a["prev_text"] = ""Prethodna"; //tekst veze "Prethodna stranica" $a["next_text"] = "Sljedeća"; // tekst veze "Sljedeća stranica" if ($max > 1) echo "

"; }

Zatim mijenjamo standardni izlazni kod u svim datotekama gdje postoji navigacija - index.php, category.php, archive.php i tako dalje. Umjesto toga promijenite:

Next_posts_link("" Naprijed"); previous_posts_link("Natrag »");

Navigacija ( padding:15px 0 25px 0; overflow:hidden; font-size:13px; color:#000; clear:both;) .navig a(background: #fff; border: 1px solid #DDDDDD; color: #000000; font-size: 13px; padding:5px; text-decoration: none;) .navig span.pages (padding: 3px 5px; background:#f1f8f9; border: 1px solid #C6D2D4;) .navig a:hover(background: # fff; obrub: 1px puna crvena; boja: crvena; veličina fonta: 13px; ukras teksta: nijedan;) .navig span.pages (padding: 3px 5px; pozadina:#f1f8f9; obrub: 1px puni #C6D2D4;) . navigacija span.current (pozadina: #fff; granica: 1px solid #111; veličina fonta: 13px; padding:5px; text-decoration: ništa;) .navig span.extend (padding: 3px 5px; pozadina:#f1f8f9; rub: 1px solid #C6D2D4;).str(background: #fff; color: #000000; font-size: 13px; padding: 5px; text-decoration: none;)

Spreman. Ako ne razumijete baš kako se kretati ručno, bolje je koristiti dodatak. I to je sve za mene. Vidimo se.

(funkcija(w, d, n, s, t) ( w[n] = w[n] || ; w[n].push(funkcija() ( Ya.Context.AdvManager.render(( blockId: "R-A) -292864-4", renderTo: "yandex_rtb_R-A-292864-4", async: true )); )); t = d.getElementsByTagName("script"); s = d.createElement("script"); s .type = "text/javascript"; s.src = "//an.yandex.ru/system/context.js"; s.async = true; t.parentNode.insertBefore(s, t); ))(ovo , this.document, "yandexContextAsyncCallbacks");

Da bismo dodali navigaciju stranicama WordPress web-mjestu, ili bolje rečeno, da bismo promijenili standardnu ​​navigaciju u redne gumbe za navigaciju stranicama, koristimo dodatak WP-pagenavi i 5 drugih dodataka testiranih na 4.9.5.

Od autora

Dodavanje navigacije stranicama web-mjestu bilo kojeg sustava ima prednosti (pogodnost za posjetitelja) i mane (stranice s naslovima koji se ponavljaju pojavljuju se u naslovne oznake). Kako bismo dodali navigaciju stranicama na WordPress web-mjestu, ili bolje rečeno, promijenili standardnu ​​navigaciju (prethodna stranica - sljedeća stranica) u redne gumbe za navigaciju stranicama, koristimo dodatak WP-pagenavi.

Standardna WordPress navigacija stranicom

Za početak, primijetit ću da se pozivanje WP funkcija koje su odgovorne za prikaz navigacije web stranice nalaze u radnim datotekama predloška. Stoga, ako ste instalirali radnu temu koja nije standardna, moguće je da je autor teme već uključio navigaciju stranicama u datoteke teme i vi je već imate. Ako nije, tada su standardna navigacija web stranice natpisi poput: "Prethodna stranica" i "Sljedeća stranica" na dnu stranice.

Funkcije koje izlaze standardnu ​​navigaciju: next_posts_link i previous_posts_link . Zapamtimo ih, bit će nam od koristi.

Dodatak WP-pagenavi pomoći će vam da svojoj WordPress stranici dodate navigaciju stranicama.

Za promjenu navigacije stranice na blogu i dodavanje gumba za selektivno stranice, koristimo dodatak WP-pagenavi. Stranica dodatka: https://wordpress.org/plugins/wp-pagenavi/installation/

Postoje tri standardna načina:

1. Od, pomoću pretraživanja po imenu;
2. Preuzmite dodatak sa svoje WordPress.org stranice (link na dnu članka);
3. Ili preuzmite dodatak s njegove WordPress.org stranice, raspakirajte arhivu i prenesite direktorij dodatka wp-pagenavi u mapu /wp-content/plugins/ i aktivirajte dodatak s konzole bloga.

Kako pokrenuti WP-pagenavi dodatak

Ali aktiviranje dodatka nije dovoljno, morate raditi s kodom radna tema.

Bilješka: Kada počnete mijenjati datoteke svoje radne teme, napravite sigurnosnu kopiju svoje stranice i njezine baze podataka. Ako nešto pođe po zlu, možete se vratiti na sigurnosnu kopiju.

Zadatak za aktiviranje wp-pagenavi je sljedeći. Morate pronaći funkcije next_posts_link i previous_posts_link u datotekama radne teme i zamijeniti retke s njima s:

Gdje i kako tražiti funkcije next_posts_link i previous_posts_link

Obično se funkcije next_posts_link i previous_posts_link mogu pronaći u datotekama teme: indeks, arhiva, funkcije. To možete učiniti u uređivaču s konzole bloga.

Dodajte navigaciju prema stranicama na svoju WordPress stranicu

Ako pretraživanje s konzole ne daje brze rezultate i jednostavno ne vidite ove funkcije, učinite sljedeće:

• Kroz FTP veza, kopirajte datoteke radne teme na svoje računalo.
• Otvorite sve preuzete datoteke u uređivač teksta, na primjer Notepadd++.
• Zatim koristimo uređivačko pretraživanje "Traži u svim datotekama" i tražimo nazive naših funkcija: next_posts_link i previous_posts_link.

• Nakon što ih pronađete, zamijenite ih s:

Nakon zamjene, prenesite uređenu datoteku natrag u direktorij stranice i provjerite izgled gumba za navigaciju stranica na stranici.

Kako promijeniti izgled gumba WP-pagenavi

• Prema zadanim postavkama, palagin gumbi s brojevima stranica su bijeli/sivi. Okviri su kvadratni. Možete promijeniti izgled gumba u datoteci: pagenavi-css.css. Ova datoteka se nalazi u direktoriju: wp-content/plugins/wp-pagenavi.

Za uređivanje preuzmite datoteku na svoje računalo i uredite je u uređivaču teksta. Istodobno, sačuvajte izvornu izvornu datoteku netaknutom kao sigurnosnu kopiju.

Više dodataka za navigaciju stranicama

• Paginacija by BestWebSoft. https://ru.wordpress.org/plugins/pagination/
• Jednostavna navigacija stranicama. https://ru.wordpress.org/plugins/simplistic-page-navi/
• Abecedna paginacija. https://ru.wordpress.org/plugins/alphabetic-pagination/
• SX Nema paginacije početne stranice. https://ru.wordpress.org/plugins/sx-no-homepage-pagination/
• WP-Paginacija. https://ru.wordpress.org/plugins/wp-paginate/

Navigacija u WordPress temama najčešće je implementirana na standardan način – poveznica na prethodne objave i poveznica na sljedeće objave. To je u većini slučajeva dovoljno, no ponekad je potrebno napraviti navigaciju stranicu po stranicu u WordPressu, u čemu će nam pomoći besplatni WP-PageNavi dodatak.

Instaliranje dodatka

WP-PageNavi jedan je od najpopularnijih i najjednostavnijih dodataka za implementaciju navigacije stranicama ili "paginacije" u WordPressu. Dostupan je u direktoriju dodataka na WordPress.org i može se instalirati s WordPress administratorske ploče pod Dodaci → Dodaj novo.

Nakon instalacije i aktivacije dodatka, trebali biste unijeti neke promjene u svoju aktivnu WordPress temu. Nalazi se u direktoriju wp-content/themes. Pronađite u ovom direktoriju mapu s nazivom vaše aktivne teme.

Vrijedno je napomenuti da neke teme već imaju ugrađenu podršku za dodatak WP-PageNavi te će nakon aktivacije odmah prikazati navigaciju stranicu po stranicu umjesto standardne, no takve su teme iznimno rijetke. U većini slučajeva, morat ćete napraviti ručne promjene kako biste podržali paginaciju.

Trebali biste u datotekama svoje teme potražiti pozive funkcija next_posts_link i previous_posts_link. Mogu biti na više mjesta, ali najčešće u datotekama index.php, archive.php i functions.php.

Ove funkcije prikazuju standardnu ​​navigaciju, a za prikaz navigacije stranicom pomoću WP-PageNavi treba ih zamijeniti pozivom jedne nova značajka wp_pagenavi.

Na primjer, razmotrite standardna tema Dvadeset dvanaest. U svojoj datoteci functions.php pronađite sljedeći kod:

I umjesto poziva funkcija next_posts_link i previous_posts_link, pozovite funkciju wp_pagenavi:

Obratite pozornost na treću liniju. Ovdje smo također dodali poziv za function_exists prije pozivanja wp_pagenavi. To će pomoći u sprječavanju prikazivanja pogrešaka ako je dodatak WP-PageNavi deaktiviran ili nedostaje.

Nakon što spremite datoteku, idite na bilo koju stranicu sa svojim postovima i vidjet ćete navigaciju stranicu po stranicu u ActionViewu:

Ako ne možete pronaći funkcije next_posts_link i previous_posts_link da ih zamijenite u svojoj temi, ostavite komentar navodeći naziv svoje teme i mi ćemo vam svakako pomoći.

Za naprednije korisnike WordPressa, vrijedno je napomenuti da je zamjenu funkcija i dijelova teme najbolje obaviti pomoću podređene teme, koristeći izvornu temu kao nadređenu. To će pomoći u održavanju paginacije i drugih promjena, čak i prilikom ažuriranja teme.

Postavke WP-PageNavi

U odjeljku Opcije → PageNavi možete promijeniti niz postavki za navigaciju po stranici, uključujući: maksimalan broj stranica, prikaz kao padajući popis, korištenje ugrađenih stilova itd.

U postavkama također možete promijeniti tekst koji se pojavljuje na poveznicama, što olakšava prevođenje poveznica prikazanih u navigaciji.

O navigaciji stranicama "bez dodataka"

Ako ste pročitali članak o tome kako implementirati navigaciju po stranicama bez dodataka u WordPressu, iznimno smo zadovoljni Ne preporučujemo ovu metodu, a to se ne odnosi samo na navigaciju stranicama. Većina članaka i vodiča koji nemaju dodatak jednostavno kopiraju kod s dodatka i zalijepe ga u različita područja vaše teme.

Pristup proširenju WordPressa bez dodataka nema br Ne prednosti, ali ima značajan broj nedostataka:

• Uvijek morate kopati po kodu
• Ako nešto pođe po zlu, ne možete lako deaktivirati dodatak
• Kada promijenite ili ažurirate svoju temu, gubite sve svoje dodatke
• Ovo nije sigurno i može dovesti do hakiranja vaše stranice.

Dodaci su stvoreni posebno za proširenje funkcionalnosti WordPressa, stoga nemojte oklijevati koristiti ih.

Alternative

Ako iz nekog razloga dodatak WP-PageNavi nije prikladan za vas, kao alternativu vam savjetujemo da razmotrite dodatke WP-Paginate i WP Page Numbers, koji implementiraju sličnu funkcionalnost.

Ako imate bilo kakvih pitanja o navigaciji stranicama u WordPressu ili gore spomenutim dodacima, možete nam postaviti pitanje putem obrasca za komentare ili nam pisati na

Praktična navigacija web stranice jedan je od ključnih čimbenika ukupne upotrebljivosti stranice. Kada korisnik posjeti web stranicu, želi što brže pronaći informacije koje su mu potrebne. Navigacija web stranice uključuje: prikladno pretraživanje, jasne kategorije, navigaciju stranicama. U ovom ću vam članku reći kako stvoriti navigaciju stranice za WordPress stranicu.

Navigacija stranice za blog– ovo je jednostavno neophodna stvar, pogotovo ako vaš blog ima arhitekturu feeda vijesti. Postoje dvije mogućnosti za implementaciju navigacija stranicom na wordpressu bez dodatka i pomoću dodatka. Po mom mišljenju, za implementaciju navigacije stranicama pomoću dodatka, najprikladnije je koristiti WP-PageNavi, vrlo je popularan, jednostavan za postavljanje i bez problema se instalira na gotovo sve WordPress teme, no ipak se ponekad dogodi da ne radi. Stoga bih preporučio što više značajki stranice, uključujući navigacija stranicom, implementirajte bez korištenja dodataka.

Prema zadanim postavkama ili možete reći u svojoj standardnoj konfiguraciji, WordPress CMS prikazuje samo postove, a postoje samo dva gumba za navigaciju: "prethodna" i "sljedeća" stranica. Slažem se, ovo značajno komplicira pretragu. Primjerice, ako se korisnik želi vratiti na prvu stranicu, a nalazi se na sedmoj, tada će morati skrolati kroz sedam stranica.

Navigacija stranicom pomoću dodatka.

Kao što sam već rekao, najlakši način za stvaranje prikladan navigacija stranicom- Ovo WP-PageNavi dodatak. Dodatak počinje raditi odmah nakon aktivacije na konzoli stranice, ne morate ništa dodatno konfigurirati u opcijama dodatka da bi radio. Nema ništa teško u instaliranju. Želio bih napomenuti da se dodaci ne instaliraju uvijek putem WordPress administratorske ploče. Dodatak se također može instalirati ručno jednostavnim učitavanjem dodatka izravno na hosting u mapu wpcontet-plagins; nakon preuzimanja morat ćete aktivirati dodatak u administratorskoj ploči.

Navigacija stranicom bez dodatka.

Kako biste implementirali navigaciju stranicama bez dodatka, trebate dodati nekoliko datoteka u temu svoje web stranice, prvo malo uredite datoteku funkcije.php i dodajte mu šifru opisa posla navigacija stranicom.

/*******************************

Navigacija

*******************************/

funkcija emm_paginate($args = null) (
$defaults = niz(
'page' => null, 'pages' => null,
'raspon' => 3, 'razmak' => 3, 'sidro' => 1,
'prije' => '

', 'nakon' => '

’,
'naslov' => __(”),
‘sljedeća stranica’ => __(‘”’), ‘prethodna stranica’ => __(‘«’),
'echo' => 1
);

$r = wp_parse_args($args, $defaults);
ekstrakt($r, EXTR_SKIP);
if (!$page && !$pages) (
globalni $wp_upit;
$stranica = get_query_var('paged');
$stranica = !prazna($stranica) ? intval($stranica): 1;
$posts_per_page = intval(get_query_var('posts_per_page'));
$pages = intval(ceil($wp_query->found_posts / $posts_per_page));
}

$izlaz = “”;
if ($stranica > 1) (
$output .= “$prije $naslov”;
$elipsa = “ …”;
if ($page > 1 && !empty($previouspage)) (
$output .= “$prethodnastranica”;
}

$min_veze = $raspon * 2 + 1;
$block_min = min($stranica – $raspon, $stranice – $min_veze);
$block_high = max($page + $range, $min_links);
$left_gap = (($block_min – $anchor – $gap) > 0) ? točno netočno;
$right_gap = (($block_high + $anchor + $gap)< $pages) ? true: false;
if ($lijevi_razmak && !$desni_razmak) (
$izlaz .= sprintf(”,

$elipsa,
emm_paginate_loop($block_min, $pages, $page));
}

else if ($left_gap && $right_gap) (
$izlaz .= sprintf(”,
emm_paginate_loop(1, $sidro),
$elipsa,
emm_paginate_loop($block_min, $block_high, $page),
$elipsa,

}

else if ($right_gap && !$left_gap) (
$izlaz .= sprintf(”,
emm_paginate_loop(1, $block_high, $page),
$elipsa,
emm_paginate_loop(($stranice – $sidro + 1), $stranice));
}

drugo(
$output .= emm_paginate_loop(1, $pages, $page);
}

ako ($stranica< $pages && !empty($nextpage)) {
$izlaz .= “ $i”;
}
vratiti $izlaz;
}

Sljedeći korak je prikazati navigaciju, za to na mjestu koje nam je potrebno, gdje će se koristiti navigacija stranicama, na primjer index.php, serch.php, archive.php

dodajte kod:

To je sve, ako je sve učinjeno ispravno, tada već imamo navigaciju stranicu po stranicu na web mjestu. Sve što preostaje je urediti stilsku datoteku za vaše web mjesto.

Da biste to učinili, dodajte sljedeći kod na kraj datoteke stila

/* Navigacija */

Emm-paginiraj ( margin-bottom:60px; clear:both; )
.emm-strani a ( border: 0px solid #ccc; background: #ebebeb; color:#333; margin-right:7px; padding:6px 14px; text-align:center; text-decoration:none;)
.emm-strani .emm-naslov (boja:#555; margina-desno:4px;)
.emm-strani .emm-gap (boja:#999; margin-desno:4px;)
.emm-paginate a:hover, .emm-paginate a:active, .emm-paginate .emm-current ( boja:#fff; pozadina:#5cbfd7; granica: 0px solid #63800c; margin-right:7px; padding: 6px 14px;)
.emm-paginiraj .emm-stranicu()
.emm-paginiraj .emm-prev, .emm-paginiraj .emm-next()

Ako uređujete tuđu temu, a ne stvarate temu od nule, moguće je da ona već koristi zadani izlaz paginacije, a možda ćete vidjeti sljedeći kod

Morate ga izbrisati ili komentirati tako da duplicirate izlaz navigacije i da ne prikazujete dvije navigacije u isto vrijeme.