Ionic 3 i WordPress REST API – prikaz blog postova

U ovom ću blog postu napraviti primjer Ionic 3 aplikacije koja će prikazivati popis blog postova sa ovog bloga koristeći WordPress REST API.

Na početnoj stranici biti će popis blog postova (naziv, vrijeme objave, kategorije, kratak sadržaj i slika) te će se moći pristupiti svakom blog postu pojedinačno.

Kreiranje aplikacije

Za početak kreiram novu Ionic aplikaciju i odmah dodajem Android platformu kako bi kasnije mogao aplikaciju pokrenuti na Android mobilnom uređaju.

API provider

Sada ću kreirati API Provider koji će služiti kao centralno mjesto svih WordPress URL-ova koje ću koristiti unutar Ionic aplikacije.

Na URL-u https://www.tomislavstankovic.com/blog/wp-json/wp/v2/posts dohvaćam popis blog postova. Unutar ovog API-ja također imam dva vrlo bitna podatka, a to su featured_media i categories koji će mi poslužiti za dohvaćanje slike i kategorije svakog blog posta.

Ionic 3 i WordPress REST API - prikaz blog postova

Prikaz blog postova

Aplikacija će na kraju izgledati ovako:

Ionic 3 i WordPress REST API – prikaz blog postova

Kao što se može vidjeti na početnom ekranu nalazi se popis zadnjih 10 blog postova. Svaki blog post ima naslov, sliku, kratak sadržaj i vrijeme proteklo od objave. Nekoliko preduvjeta je bilo potrebno zadovoljiti kako bi se sve to prikazalo na taj način.

Struktura početne stranice izgleda ovako i ovdje je posebno zanimljiva funkcija prikaziJedanBlogPost() pomoću koje prosljeđujem potrebne podatke na stranicu za prikaz pojedinačnog blog posta.

Još jedna zanimljiva stvar u home.html je KategorijaPipe koja služi za dohvaćanje naziva kategorije na osnovu ID-a.

Naravno, potrebno je još o svemu tome obavijestiti app.module.ts

Uz nešto malo CSS-a

Kao što se može vidjeti u home.ts za prikaz vremena u željenom obliku koristio sam Moment.js

Pojašnjenje funkcija:

  • prikazBlogPostova() – dohvaća popis blog postova i kreira niz (array) jedanBlogPost
  • dohvatiUrlSlike() – dohvaća URL slike pojedinačnog blog posta na osnovu parametra idslike: res[i].featured_media iz gornje funkcije
  • ucitajKategorije() – dohvaća kategorije za blog post

Klikom na naslov ili sliku blog posta otvara se jedan blog post. Stranica jednog blog posta kreirana je sljedećom naredbom

Dok je struktura ovakva

Funkcionalnost stranice za prikaz jednog blog posta ne radi ništa osim dohvaćanja proslijeđenih podataka s prethodne stranice s popisom svih blog postova pomoću objekta NavParams.

Zaključak

Struktura projekta prema package.json izgleda ovako

Promjena verzije PHP-a za WordPress

S obzirom da sve volim imati “up-to-date”, koliko god je to moguće, nedavno sam istraživao koliki utjecaj verzija PHP-a ima na WordPress. Iako je i sam WordPress pisan u PHP-u velika je vjerojatnost da se korisnik običnog WordPress bloga nikada neće niti susresti s pravim PHP-om koji stoji “ispod poklopca”. No, to nije razlog da se zanemare prednosti koje donose novije verzije PHP-a, ako ništa drugo, onda po pitanju sigurnosti i performansi.

Što je potrebno za samostalnu promjenu PHP verzije?
WordPress instalacija
– pristup cPanelu
– pristup opciji Select PHP Version unutar cPanela
PHP Compatibility Checker plugin
Display PHP Version plugin

Trenutna verzija PHP-a

Prije svega potrebno je (sa)znati koja se verzija PHP-a trenutno koristi kako bi uopće znali koje nam opcije nadogradnje ostaju i što s njima možemo dobiti. Za tu svrhu može se koristiti “Display PHP Version” plugin koji će nakon instalacije i aktivacije unutar upravljačke ploče WordPress nadzorne ploče prikazati trenutno korištenu verziju PHP-a.

U mojem slučaju to je bila verzija 5.3.29.

Promjena verzije PHP-a za WordPress

Nakon što sam saznao koju verziju PHP-a trenutno koristim zaključujem da bi se trebao prebaciti na (naj)noviju verziju.

Promjena verzije PHP-a za WordPress
PHP Supported Versions

Međutim, prije nego to napravim trebam se uvjeriti da su tema koju koristim i svi pluginovi kompatibilni sa verzijom PHP-a, na koju se planiram prebaciti, jer se u suprotnom WordPress stranica može srušiti.

Kompatibilnost nove verzije PHP-a

Kada se koriste najnovije verzije teme i pluginova mala je vjerojatnost da isti neće biti kompatibilni sa novom verzijom PHP-a, ali ipak može se i to dogoditi. Zato je važno prije promjene provjeriti jesu li tema i svi pluginovi kompatibilni sa novom verzijom PHP-a.

To je moguće učiniti koristeći PHP Compatibility Checker plugin.

Nakon instalacije i aktivacije dovoljno je otići u izbornik Alati -> PHP Compatibility -> odabrati željenu verziju PHP-a i kliknuti na Scan site.

Prvo ću provjeriti kompatibilnost sa trenutno najnovijom verzijom PHP-a, a to je verzija 7.0

Promjena verzije PHP-a za WordPress

Iz analize mogu vidjeti da mi jedan plugin, konkretno Social Warfare Pro kojeg sam platio 30ak $, nije kompatibilan sa verzijom 7.0 PHP-a. Zbog toga trenutno odlučujem da neću prelaziti na najnoviju verziju PHP-a, barem ne dok ne istražim moguće načine kako taj plugin prilagoditi ili moguće posljedice nadogradnje unatoč nekompatibilnosti.

Promjena verzije PHP-a za WordPress

Sljedeća logična verzija PHP-a je 5.6 te odlučujem testirati kompatibilnost svoje instalacije WordPressa s tom verzijom. Zaključujem da imam punu kompatibilnost i da se slobodno mogu prebaciti na verziju PHP-a 5.6

Promjena verzije PHP-a za WordPress

Promjena verzije PHP-a

Sada mogu otići u cPanel i promijeniti verziju PHP-a koristeći Select PHP Version.

Promjena verzije PHP-a za WordPress

Odabirem verziju 5.6 i klikom na Set as current potvrđujem da tu verziju želim koristiti.

Promjena verzije PHP-a za WordPress

Ako se sada vratim u nadzornu ploču mogu vidjeti da je nova verzija PHP-a za WordPress 5.6.32

Promjena verzije PHP-a za WordPress

Zaključak

So, now you know – PHP versions aren’t something you have to think about a lot, but it’s the engine that runs everything else. It matters, and you can improve your speed, security and compatibility, by making the right choice. – Does your PHP version matter?

Kako prebaciti WordPress blog na HTTPS?

U ovom ću blog postu pokazati postupak prebacivanja WordPress bloga s HTTP protokola na HTTPS. Ako to već niste učinili krajnje je vrijeme. Za prebacivanje WordPress bloga na HTTPS protokol treba vam plan, malo vremena, tehničkog znanja, backup i naravno SSL certifikat.

Uvod

Što je SSL?

SSL (Secure Sockets Layer) tehnologija je enkripcije podataka koji putuju između web-preglednika i web-poslužitelja koja pomaže u zaštiti korisničkih podataka. Web-adrese koje su zaštićene SSL protokolom započinju izrazom “https://, a ne izrazom “http://, pa zato neki SSL nazivaju i HTTPS. – Wiki

Postoji više vrsta SSL certifikata,  a glavni su:
DV (Domain Validation) – ovaj certifikat je dovoljan za vaš blog
OV (Organization Validation)
EV (Extended Validation

Zašto SSL/HTTPS?

Kako prebaciti WordPress blog na HTTPS?

Nekoliko je razloga zašto bi trebali na svojem WordPress blogu koristiti SSL/HTTPS.

Sigurnost – Ovo je osnovni razlog zašto je potrebno koristiti SSL certifikat tj. HTTPS protokol. Za običan blog ovaj razlog i nije toliko bitan, osim možda za administratora, međutim web stranice/trgovine koje vrše naplatu putem kreditnih kartica svakako moraju koristiti SSL/HTTPS zbog potrebe za enkriptiranim prijenosom korisničkih podataka kao što su broj kreditne kartice, osobni identifikacijski broj (OIB) i sl.

Povjerenje/vjerodostojnost –  Iako korisnici u ovom trenutku možda ne ostavljaju povjerljive podatke na vašem blogu oni mogu biti sigurni da s vaše strane ulažete maksimalne napore kako bi osigurali sigurno korištenje vašeg bloga. Na taj način podižete razinu povjerenja korisnika. To će posebno doći do izražaja kada većina stranica bude koristila SSL/HTTPS jer će tada biti neobično posjetiteljima vidjeti neku stranicu koja nije ‘zelena’.

Bolja pozicija na tražilicama/SEOGoogle je i službeno objavio da je ne/korištenje HTTPS-a na web stranicama jedan od faktora koji će utjecati na rangiranje web stranica. To znači da je veća šansa da posjetitelji pronađu vašu web stranicu ako koristite SSL/HTTPS. Iako je taj faktor tek jedan mali dio onoga što Google gleda ipak nije zanemariv.

Migracija na HTTPS

Nabava i instalacija SSL certifikata

SSL certifikat možete kupiti ili koristiti neku od besplatnih verzija kao što su Let’s Encrypt ili AutoSSL od cPanela ako vaš pružatelj hosting usluga to dopušta.

Postavljanje SSL certifikata možete prepustiti hosting tvrtki ili odraditi samostalno putem npr. cPanela.

Kako prebaciti WordPress blog na HTTPS?

Kada je SSL certifikat uspješno instaliran možete pristupiti HTTS i HTTPS verziji vašeg bloga. Međutim postupak je daleko od gotovog jer potrebno je napraviti konkretne i trajne promjene kako bi vaš blog postojao samo u HTTPS verziji. Više o tome u nastavku.

Prije nastavka testirajte ispravnost SSL certifikata:
https://www.ssllabs.com/ssltest/analyze.html
https://www.sslshopper.com/ssl-checker.html

Promjena HTTP poveznica na HTTPS

WordPress sve poveznice sprema u MySQL bazu podataka. U bazi može biti više tisuća poveznica i sve ih je potrebno prebaciti na HTTPS. To ćemo ovdje učiniti ručno na način da ćemo preuzeti MySQL bazu podataka na lokalno računalo, otvoriti bazu koristeći Notepad++, promijeniti sve poveznice sa “http://” na “https://“ i ponovno vratiti bazu podataka na hosting.

1 – Izvoz MySQL baze na lokalno računalo

Kako prebaciti WordPress blog na HTTPS?

2 – Zamjena HTTP poveznica sa HTTPS

Kako prebaciti WordPress blog na HTTPS?

3 – Pražnjenje aktivne MySQL baze. Prije ovog koraka budite sigurni da imate kopiju originalne baze na lako dostupnom mjestu.

Kako prebaciti WordPress blog na HTTPS?

4 – Uvoz nove MySQL baze sa HTTPS poveznicama

Kako prebaciti WordPress blog na HTTPS?

Vaš blog bi blog sada trebao biti dostupan na HTTP i na HTTPS protokolu. Ako se nakon ovog koraka vaš blog ne prikazuje kako bi trebao znači da je došlo do greške prilikom rada s bazom podataka. Provjerite jeste li uspješno napravili uvoz nove MySQL baze i ako je potrebno ponovite postupak.

Ako se ne usudite raditi promjene ovakve vrste na MySQL bazi možete koristiti plugin Better Search Replace, ili neki drugi, koji obavlja isti posao.

Na stranici https://www.whynopadlock.com možete provjeriti postoji li još neka zaostala HTTP poveznica, ako ne postoji znači da ste sve do sada uspješno napravili i možete nastaviti dalje.

301 redirekcija

301 redirekcija je službeni standard koji se koristi za označavanje trajno premještenog sadržaja. U ovom slučaju vaš se blog trajno premješta sa HTTP protokola na HTTPS protokol.

Spojite se putem FTP-a na svoj hosting i unutar .htaccess datoteke dodajte sljedeće:


S postavkama unutar .htaccess datoteke budite jako oprezni, obavezno u blizini imajte kopiju originalnih postavki i ako niste sigurni što napraviti kontaktirajte korisničku podršku tvrtke u kojoj imate zakupljen hosting paket ili se poslužite pluginom Easy HTTPS Redirection koji će za vas obaviti izmjenu postavki unutar .htaccess datoteke tj. dodati će sljedeće:


Ako sada posjetite HTTP verziju vašeg bloga trebali bi automatski biti preusmjereni na HTTPS verziju.

To je sve što se tiče vašeg hosting i WordPress bloga. Sve dalje što ću navesti tiče se marketing strane cijelog ovog postupka. S obzirom da većina prometa web stranica stiže od strane web tražilica kao što je Google Search potrebno je i njih obavijestiti o ovoj promjeni kako ne bi došlo do zabune ili još gore kako vas Google ne bi kaznio jer može pomisliti da imate dvije različite web stranice s potpuno istim sadržajem, a Google to ne voli.

Gdje su nestali ‘lajkovi’?

Nakon promjene na HTTPS protokol možete primijetiti da se stanje na gumbima za ‘šeranje‘ na društvene mreže resetiralo na nulu! Ako imate relativno aktivan blog čiji se sadržaj dijeli na društvenim mrežama nije lako za prihvatiti da je odjednom sve vraćeno na nulu. Također kada dođu novi posjetitelji vrlo lako mogu pomisliti da vaš sadržaj nikome nije zanimljiv jer se uopće ne dijeli.

Ipak nije sve izgubljeno. Postoji način za vraćanje statistike dijeljenja vašeg sadržaja. Rješenje se zove Social Warfare Pro.

Kako prebaciti WordPress blog na HTTPS?

Nakon što kupite plugin i aktivirate ga imate dostupnu opciju “Share Recovery” koja vam omogućava vraćanje teško stečenih ‘šerova‘ vašeg sadržaja na društvenim mrežama.

Kako prebaciti WordPress blog na HTTPS?

Nakon što pokrenete vraćanje broja ‘šerova‘ možete vidjeti da se stanje vratilo na prijašnje.

Kako prebaciti WordPress blog na HTTPS?

Google Search Console

Potrebno je kreirati novi Google Search Console profil za HTTPS
verziju vašeg bloga zato što Search konzola ne podržava promjenu adrese sa HTTP na HTTPS verziju.

Kako prebaciti WordPress blog na HTTPS?

Nakon toga kreirajte i dodajte novu sitemap.xml datoteku koja će vam pomoći u bržem indeksiranju. sitemap.xml možete generirati na adresi https://www.xml-sitemaps.com

Kako prebaciti WordPress blog na HTTPS?

Nakon što ste uspješno napravili novi HTTPS profil slobodno možete obrisati stari HTTP profil ako ga imate.

Kako prebaciti WordPress blog na HTTPS?

Google Analytics

Ako do sada niste koristili Google Analtycs onda je pravo vrijeme da počnete, no ako ste ga koristili potrebno je napraviti manje izmjene kako bi se počela prikupljati statistika i za vašu HTTPS verziju bloga.

Ako ovo ne napravite Google Analtycs više neće prikupljati vrlo korisnu statistiku posjećenosti vaših web stranica, a siguran sam da to ne želite.

Ažurirajte “postavke web entiteta”

Kako prebaciti WordPress blog na HTTPS?

i ažurirajte “postavke vlasničkog pregleda”

Kako prebaciti WordPress blog na HTTPS?

Zaključak

Osim ranije navedenog postoji još nešto što možete učiniti kako bi tranzicija na HTTPS prošla u najboljem redu. Svakako ažurirajte sve poveznice koje vode na vašu novu web stranicu.

Kako prebaciti WordPress blog na HTTPS?

Ovo je samo jedan od načina kako svoj WordPress blog možete prebaciti na HTTPS. Ja sam odabrao ovaj način što ne znači da morate i vi. U svakom slučaju naoružajte se strpljenjem i rezervirajte si nekoliko sati vremena samo za ovaj posao kako bi ga napravili kako treba i mogli mirno spavati.

Najgora stvar koju možete napraviti je žuriti i napraviti polovičan posao zbog kojeg vas i Google može kazniti iako ste imali najbolju namjeru, a da ne govorim koliko možete razočarati svoje posjetitelje kada dođu na vaš blog koji ne radi.

Nadam se da sam vam barem donekle uspio pojasniti postupak prebacivanja WordPress bloga sa HTTP protokola na HTTPS.

Za one koji žele znati više:

Vlastite web lokacije kao garancija dobre online reputacije

Nakon što ste se ‘guglali‘ i uklonili podatke iz rezultata pretraživanja vrijeme je da se pozabavite stvaranjem sadržaja, a da biste isti mogli stvarati morate imati dobre temelje u vidu web lokacija nad kojima imate kontrolu (osnovno – objava, uređivanje i brisanje sadržaja). Uvijek je bilo i uvijek će biti negativnog sadržaja kojeg nećete moći ukloniti ma koliko to željeli i zato se trebate okrenuti onome što možete učiniti, a to je dati tražilicama ono što one najviše vole – puno novog i kvalitetnog sadržaja.

Ako do sada niste susretali negativan sadržaj vezan uz vaše ime to znači da ste u najboljoj poziciji da se za to pripremite. Nije pitanje hoće li vam netko pokušati ugroziti online reputaciju nego kada će to učiniti!

Često u razgovoru s ljudima na ovu temu čujem komentare poput ‘Ma neću ja raditi te stranice i profile. Ne volim da svatko čita što pišem i neću se hvaliti.‘ pri tome zaboravljajući da time dopuštaju nekome drugome da stvara sliku o njima. Ako i vi razmišljate na taj način sada bi bilo dobro da prestanete. Dolje navedene opcije nude vam mogućnost iznošenja činjenica i vlastitog mišljenja jednako kao što to radite u stvarnom životu kada nekome prepričavate životopis ili komentirate današnje vijesti. Vi odlučujete što ćete i gdje reći tj. objaviti.

1.) Osobne web stranice
Ovo je nešto najbolje što možete učiniti za sebe. Ulaganje u budućnost koje će se sigurno isplatiti. imeiprezime.com je adresa koja će zauzeti prvo mjesto u rezultatima pretraživanja za vaše ime, a to je ono što želite. Što se vizualnog identiteta tiče kao i sadržaja stranice to ostaje vama na odluci. Neka vam osobne web stranice budu polazno i završno mjesto za sve ostale online aktivnosti. Više o tome možete pročitati u postu ‘Zašto imati osobne web stranice?‘.

2.) Blog
Pokrenite blog, aktivno stvarajte sadržaj i uživajte u rezultatima pretraživanja vašeg imena na način kako to nikada do sada niste imali priliku. WordPress.com i Blogger.com su kombinacija koja sigurno daje rezultate. Objavite nekoliko blog postova i čekajte čaroliju. Kroz nekoliko dana svjedočit ćete novoj slici prve stranice s rezultatima neke od tražilica kada je u pitanju vaše ime i prezime. Ovdje vam neću savjetovati da se držite samo jedne teme o kojoj ćete pisati jer se time na samom početku ograničavate. Oslobodite svoje kreativne potencijale i pišite o svemu onome što vas zanima, što vas čini sretnima i željnima da to isto dijelite s drugima.

3.) Servisi za razmjenu audio, foto i video sadržaja
YouTube, Flickr i SoundCloud su u ovom trenutku najbolji izbor. Odlična nadopuna osnovnoj vrsti sadržaja kao što je tekst. Bitno je da imate otvoren korisnički račun na servisima takve vrste i da budete spremni za objavu sadržaja na istima ukoliko i kada se ukaže potreba za tim. Ton i boja glasa, pokreti, govor tijela, završna obrada videa, glazbena podloga, i dr. reći će o vama puno više nego što možete i zamisliti. Oslobodite vlastitu kreativnost. Osim plasiranja vlastitog audio, foto i video sadržaja možete stvoriti i nekoliko (play) lista koje će posjetiteljima nuditi zanimljiv sadržaj o određenim temama na jednostavan način.

4.) Servisi za stvaranje besplatnih web stranica
Često spominjem Google pa moram spomenuti i mogućnost izrade besplatnih web stranica putem Google Sitesa. https://sites.google.com/site/imeiprezime/ adresa pomoći će vam u nastojanju da prvu stranicu s rezultatima pretraživanja ispunite vlastitim sadržajem. Ove web stranice možete ispuniti istom vrstom sadržaja kao i osobne web stranica na adresi imeprezime.com ili si možete stvoriti mjesto gdje ćete se izraziti na drugačiji način.

5.) Društvene mreže
Facebook, Twitter, Google+ i LinkedIn mogu za vas puno napraviti. To su društvene mreže koje će vam uz prostor za plasiranje sadržaja ponuditi mnoštvo kvalitetnih osoba s kojima se možete povezati i družiti. Ovdje je bitno napomenuti da trebate koristiti svoje pravo ime i prezime umjesto pseudonima jer vam pseudonim neće biti od koristi. Svaka od ranije navedenih društvenih mreža nudi specifične postavke privatnosti koje svakako trebate detaljno proučiti kako sami sebe ne biste doveli u neugodnu poziciju.

Mogao bih listu nastaviti s mnoštvom drugih mogućnosti, ali nema potrebe za tim jer vjerujem da ste shvatili u kojem smjeru trebate ići. Gore navedenih pet opcija nude vam odlične temelje za sve vaše online aktivnosti. Iskoristite najbolje od svake.

P.S. U idućem blog postu obradit ću temu o zamci u koju možete upasti prilikom rada na online reputaciji.