Cum să adăugați cu ușurință bannere inteligente pentru aplicații în WordPress

Am primit multe solicitări de la dezvoltatori de aplicații: există o modalitate de a promova aplicațiile mobile direct de pe site-ul dvs. WordPress? Răspunsul este da, și este mai ușor decât ați crede.

Una dintre cele mai simple modalități de a face acest lucru este cu bannere inteligente pentru aplicații. Aceste bannere apar în partea de sus a site-ului dvs. web atunci când sunt vizualizate pe iPhone și iPad, încurajând vizitatorii să descarce sau să deschidă aplicația dvs. Puteți chiar să afișați bannere utilizatorilor Android folosind pluginul potrivit.

Bannerele inteligente pentru aplicații nu sunt enervante ca pop-up-urile. În schimb, se integrează natural pe site-ul dvs. și oferă vizitatorilor un impuls blând pentru a descărca sau a deschide aplicația dvs. Rezultatul? Mai multe descărcări, o mai bună implicare a utilizatorilor și o experiență mobilă mai profesională.

Am testat diverse metode pentru a adăuga aceste bannere în WordPress și am găsit două abordări care funcționează perfect pentru orice nivel de experiență.

Prima folosește un fragment de cod simplu pentru a adăuga bannerul nativ iOS de la Apple, în timp ce a doua folosește un plugin care suportă atât dispozitivele iOS, cât și Android, cu personalizare completă a designului. Vă vom ghida prin ambele opțiuni pas cu pas.

Rezumat rapid TLDR: Bannerele inteligente pentru aplicații sunt bannere native iOS care apar în Safari, încurajând vizitatorii să descarce sau să deschidă aplicația dvs. Cea mai ușoară modalitate de a le adăuga în WordPress este cu un plugin gratuit numit WPCode.

Dacă doriți să afișați bannere și utilizatorilor Android, puteți folosi pluginul Mobile Smart App Banner, care suportă ambele platforme și vă permite să personalizați complet designul bannerului.

De ce să adăugați Smart App Banners în WordPress?

Utilizarea unui banner inteligent pentru aplicații pe site-ul dvs. WordPress vă poate ajuta să obțineți mai multe descărcări și achiziții ale aplicației dvs. mobile.

Mulți proprietari de site-uri web creează o aplicație mobilă însoțitoare unde vizitatorii își pot naviga conținutul într-un mod optimizat pentru mobil.

Deoarece aceste aplicații sunt concepute pentru dispozitive mobile, ele oferă adesea o experiență de utilizare mai bună. De asemenea, puteți afișa memento-uri, conținut personalizat, oferte, actualizări și multe altele folosind notificări push mobile. Toate acestea înseamnă mai multă implicare, conversii și vânzări.

Puteți încuraja utilizatorii de iPhone și iPad să descarce aplicația dvs. mobilă folosind un banner inteligent pentru aplicații.

Acesta este un banner care apare în partea de sus a ecranului atunci când un utilizator iOS vizitează site-ul dvs. folosind browserul Safari.

Vizitatorii pot face clic pe banner pentru a descărca aplicația dvs. din App Store. Dacă vizitatorul are deja aplicația dvs., atunci bannerul îi va cere să deschidă aplicația în schimb. În acest fel, puteți obține mai multe descărcări și interacțiuni cu aplicația.

Dacă vizitatorul folosește un dispozitiv non-Apple sau un browser web diferit, atunci bannerul inteligent nativ de la Apple nu va apărea.

Cu toate acestea, așa cum vă vom arăta în Metoda 2, puteți folosi un plugin pentru a afișa bannere de descărcare a aplicațiilor și utilizatorilor Android și vizitatorilor care folosesc alte browsere.

Acestea fiind spuse, haideți să vedem cum puteți adăuga smart app banners în WordPress. Pur și simplu utilizați linkurile rapide de mai jos pentru a sări direct la metoda pe care doriți să o utilizați:

Metoda 1: Folosind WPCode (Afișarea unui banner inteligent pentru aplicații pe WordPress)

Cel mai simplu mod de a adăuga bannere inteligente pentru aplicații pe site-ul dvs. WordPress este prin utilizarea WPCode. Acest plugin gratuit vă permite să afișați același banner pe fiecare pagină și postare folosind o singură linie de cod.

Când adăugați cod personalizat în WordPress, unele ghiduri vă vor cere să editați fișierul functions.php al site-ului dvs. Nu recomandăm acest lucru, deoarece chiar și o mică greșeală de scriere sau o eroare ar putea cauza erori comune WordPress sau chiar ar putea face site-ul dvs. inaccesibil.

Folosind WPCode, puteți adăuga cod personalizat în fișierele temei WordPress fără niciun risc. De asemenea, puteți activa și dezactiva fragmente de cod printr-o simplă apăsare de buton.

Mai întâi, trebuie să instalați și să activați pluginul gratuit WPCode. Pentru mai multe instrucțiuni, vă rugăm să consultați ghidul nostru pentru începători despre cum să instalați un plugin WordPress.

La activare, accesați Fragmente de cod » Adăugare fragment. Apoi, faceți clic pe butonul „+ Adăugare fragment personalizat” sub opțiunea „Adăugați codul dvs. personalizat (Fragment nou)”.

Apoi, trebuie să selectați „Fragment HTML” ca tip de cod din lista de opțiuni care apar pe ecran.

Acest lucru vă va duce la pagina „Creați un fragment personalizat”, unde puteți introduce un nume pentru fragmentul de cod.

Acesta este doar pentru referința dvs., deci puteți folosi orice doriți.

Pentru următorul pas, va trebui să cunoașteți ID-ul aplicației dvs.

Pentru a obține aceste informații, deschideți o nouă filă în browser și accesați pagina Apple Services Marketing Tools. Aici, introduceți numele aplicației pe care doriți să o promovați și faceți clic pe pictograma „Căutare”.

Pentru a vedea toate aplicațiile iOS care corespund termenului dvs. de căutare, derulați pur și simplu la secțiunea „Aplicații”.

Aici, găsiți aplicația pe care doriți să o promovați și faceți clic pe ea.

În partea de jos a ecranului, veți vedea un „Link de conținut”.

ID-ul aplicației este valoarea dintre id și ?. Veți avea nevoie de aceste informații în pasul următor, așa că fie lăsați această filă deschisă, fie notați ID-ul aplicației.

Acum că aveți ID-ul aplicației, reveniți la tabloul de bord WordPress.

Puteți adăuga acum următorul fragment în editorul de cod, înlocuind ID-ul aplicației cu informațiile pe care le-ați obținut în pasul anterior:

<meta name="apple-itunes-app" content="app-id=12345678">

Cu aceasta făcută, derulați în jos la caseta „Inserare”.

Dacă nu este deja selectat, faceți clic pe „Inserare automată” și apoi selectați „Antet la nivel de site” din meniul derulant.

Când sunteți gata, derulați în partea de sus a paginii și comutați comutatorul „Inactiv” la „Activ”.

În cele din urmă, pur și simplu faceți clic pe butonul „Salvează fragmentul” pentru a vă stoca modificările.

Acum, bannerul inteligent pentru aplicație va apărea pe site-ul dvs. WordPress.

Cum să afișați bannere diferite pe pagini și postări specifice

Așa cum ați văzut, este ușor să adăugați un banner inteligent în WordPress folosind WPCode.

Dar ce se întâmplă dacă doriți să promovați aplicații diferite pe pagini diferite?

De exemplu, poate aveți un blog de stil de viață și aveți o aplicație de rețete pe care doriți să o promovați pe postările dvs. legate de mâncare. În același timp, ați putea avea o aplicație de fitness pe care doriți să o promovați pe paginile dvs. de antrenament.

În acest caz, recomandăm upgrade-ul la WPCode Premium (începând de la 49 USD/an). Acest plugin are o logică condițională inteligentă care vă permite să controlați exact unde rulează fiecare fragment de cod. Aceasta înseamnă că puteți crea mai multe bannere inteligente pentru aplicații și apoi să le afișați pe orice pagină sau postare. 

Mai întâi, accesați site-ul WPCode și achiziționați un abonament. Apoi îl puteți instala, la fel ca orice alt plugin WordPress.

După aceea, accesați WPCode » Setări în tabloul de bord WordPress și introduceți cheia de licență.

Puteți găsi aceste informații conectându-vă în contul dvs. pe site-ul WPCode sau verificând e-mailul de confirmare a achiziției pe care l-ați primit când ați cumpărat WPCode. 

Cu aceasta făcută, accesați Fragmente de cod » Adăugare fragment în tabloul de bord WordPress. Aici, treceți cu mouse-ul peste secțiunea „Adăugați codul dvs. personalizat”.

Când apare, selectați „Adăugare fragment personalizat”.

În panoul următor, faceți clic pe „Fragment HTML”.

Apoi, dați un nume descriptiv fragmentului dvs., astfel încât să puteți identifica cu ușurință aplicația pe care o promovează.

De exemplu, ați putea să-l numiți „Banner inteligent pentru aplicație – Aplicație de rețete”.

În Editorul de cod, adăugați meta tag-ul pentru prima aplicație.

Asigurați-vă că înlocuiți ID-ul aplicației cu cel corect pentru aplicația dvs.:

<meta name="apple-itunes-app" content="app-id=YOUR_FIRST_APP_ID">

Apoi, derulați la secțiunea „Inserare” și selectați „Inserare automată”, dacă nu este deja selectată.

După aceea, deschideți meniul derulant „Locație” și selectați „Antetul întregului site”.

Apoi, derulați puțin mai jos la secțiunea „Logică condițională inteligentă”. 

Aici, faceți clic pentru a activa setarea „Activare logică”.

Acum este momentul să creați regula de logică condițională inteligentă.

Pentru a începe, deschideți meniul derulant „Condiții” și selectați „Afișare”. Apoi, faceți clic pe „Adăugare grup nou”.

După aceea, faceți clic pe primul meniu derulant (care afișează implicit „Conectat”).

Aceasta adaugă o secțiune complet nouă.

În meniul din stânga, selectați „Unde”.

Apoi, alegeți „Postare/Pagină”.

Cu aceasta făcută, faceți clic pe al doilea meniu derulant și alegeți „Este unul dintre”, dacă nu este deja selectat.

În final, faceți clic pe al treilea câmp și căutați pagina sau postarea specifică unde doriți să afișați acest banner pentru aplicație.

Doriți să afișați acest banner pe mai multe pagini sau postări? Atunci pur și simplu faceți clic pe „Adăugare grup nou”.

Acum puteți repeta acești pași pentru a selecta postări sau pagini suplimentare.

Când sunteți mulțumit de modul în care este configurat acest fragment, derulați în partea de sus a paginii și comutați comutatorul „Inactiv” la „Activ”. În final, faceți clic pe butonul „Salvare fragment” pentru a salva modificările.

Acum, repetați acest proces pentru fiecare aplicație suplimentară pe care doriți să o promovați. 

WPCode va afișa acum bannerul inteligent corect pentru aplicație, în funcție de pagina sau postarea pe care vizitatorul o vizualizează în prezent.

Cum să testezi codul Smart App Banner în WordPress

Cel mai bun mod de a testa bannerul inteligent pentru aplicație este vizitând site-ul dvs. pe un dispozitiv iOS folosind aplicația mobilă Safari. De fapt, bannerul inteligent pentru aplicație nici măcar nu va apărea dacă încercați să vizualizați versiunea mobilă a site-ului dvs. WordPress de pe desktop.

Dacă trebuie să verificați rapid dacă fragmentul de cod funcționează, atunci o soluție este să utilizați instrumentul Inspect tool al browserului dvs. Acesta vă permite să vedeți dacă codul <meta name> a fost inserat în secțiunea <head> a site-ului dvs., ceea ce sugerează că funcționează conform așteptărilor.

Pentru a face acest lucru, accesați orice pagină sau postare de pe blogul dvs. WordPress. Apoi, faceți clic dreapta oriunde pe pagină și selectați „Inspect”.

Se va deschide un nou panou, afișând codul complet al site-ului.

Pur și simplu găsește secțiunea <head> și dă clic pe săgeata sa pentru a o extinde.

Acum, căutați codul <meta name="apple-itunes-app"> pe care l-ați adăugat în pasul anterior.

Dacă vedeți acest cod, atunci bannerul inteligent pentru aplicații ar trebui să apară pe dispozitivele iOS.

Metoda 2: Utilizarea Mobile Smart App Banner (Adăugare bannere pentru iOS și Android)

Dacă doriți un plugin care acceptă atât utilizatorii iOS, cât și Android, atunci recomandăm utilizarea pluginului Mobile Smart App Banner.

Este un plugin gratuit care detectează automat dispozitivul vizitatorului și afișează linkul corespunzător către magazinul de aplicații. 

Bannerul include un buton „Închide” încorporat, astfel încât vizitatorii să poată închide bannerul, și folosește cookie-uri pentru a reține această decizie.

Rețineți că bannerul nu va apărea timp de 7 zile după ce a fost închis.

Mai întâi, va trebui să instalați și să activați pluginul Mobile Smart App Banner. Dacă aveți nevoie de ajutor, consultați ghidul nostru despre cum să instalați un plugin WordPress.

După activare, accesați Setări » Mobile Smart App Banner în tabloul de bord WordPress.

Aici, bifați căsuța de lângă opțiunea „Activați bannerul aplicației” pentru a activa bannerul pe site-ul dvs. 

După ce ați făcut acest lucru, faceți clic pe butonul „Încărcați”.

Apoi, selectați imaginea pe care doriți să o utilizați ca pictogramă a aplicației dvs. (recomandăm utilizarea unei imagini de 512x512px).

De asemenea, puteți alege unde apare bannerul pe ecran, deschizând meniul derulant „Poziția bannerului” și alegând o opțiune din listă.

Am constatat că plasarea bannerului în partea de jos a ecranului este mai puțin intruzivă și poate duce adesea la o implicare mai mare.

După aceea, puteți introduce numele aplicației dvs. în câmpul „Nume aplicație” și puteți introduce o scurtă descriere în caseta „Subtitlu aplicație”. 

În continuare, adăugați linkul către App Store și linkul către Play Store în câmpurile corecte.

Dacă doriți să schimbați aspectul bannerului, derulați pur și simplu la secțiunea „Setări de culoare”. 

Aici, puteți schimba culoarea de fundal, culoarea butonului, culoarea textului butonului și multe altele, utilizând diverse setări.

Există, de asemenea, o previzualizare în timp real, astfel încât să puteți încerca cu ușurință multe setări pentru a vedea ce arată cel mai bine. 

Alternativ, puteți utiliza bannerul inteligent nativ al Apple în Safari, debifând căsuța de lângă „Activați bannerul inteligent iOS”.

Va trebui apoi să introduceți ID-ul dvs. din App Store, pe care îl puteți găsi folosind aceeași procedură descrisă în Metoda 1. 

Când aceasta este activată, utilizatorii Safari vor vedea bannerul nativ Apple, în timp ce utilizatorii Chrome, Firefox și ai altor browsere iOS vor vedea bannerul dvs. personalizat în schimb.

După ce ați făcut acest lucru, derulați în partea de jos a ecranului și faceți clic pe „Salvați modificările” pentru a face bannerul dvs. live.

Întrebări frecvente despre adăugarea bannerelor inteligente pentru aplicații în WordPress

Dacă mai aveți întrebări, iată cele mai frecvente întrebări despre cum să adăugați bannere inteligente pe site-ul dvs. WordPress.

Ce este un banner inteligent pentru aplicații?

Bannerele inteligente pentru aplicații apar în partea de sus a browserului web Safari și oferă utilizatorilor aplicației opțiunea de a deschide o aplicație sau de a o descărca din Apple App Store.

Deoarece au fost create de Apple, bannerele inteligente pentru aplicații au un design consistent pe care mulți utilizatori iOS îl recunosc. Ele apar doar persoanelor care folosesc iPhone-uri și iPad-uri cu iOS 6 sau o versiune mai recentă.

De ce nu pot vedea bannerul meu inteligent pentru aplicații pe desktop?

Bannerul inteligent pentru aplicații nu va apărea pe computere desktop, chiar dacă vizualizați versiunea mobilă a site-ului dvs.

Pentru a vedea bannerul în acțiune, va trebui să vizitați site-ul dvs. pe un iPhone sau iPad folosind aplicația mobilă Safari.

De ce nu pot vedea bannerul inteligent pentru aplicații pe iPhone sau iPad?

Bannerele inteligente pentru aplicații apar doar pe dispozitivele care rulează iOS 6 sau o versiune mai recentă atunci când utilizați aplicația mobilă Safari. Dacă nu vedeți bannerul inteligent pentru aplicații, atunci ar trebui să începeți prin a verifica dacă aveți cele mai recente versiuni atât ale iOS, cât și ale aplicației mobile Safari.

Smart app banner-ul detectează, de asemenea, dacă dispozitivul poate suporta aplicația și dacă aplicația este disponibilă în locația dvs. Dacă nu vedeți smart app banner-ul, atunci este posibil ca dispozitivul dvs. să fi eșuat una dintre aceste verificări.

De ce a dispărut bannerul inteligent pentru aplicații în Safari?

Dacă respingi bannerul făcând clic pe butonul „x”, acesta nu va mai apărea implicit.

În funcție de dispozitivul dvs. mobil, este posibil să fie necesar să deschideți o filă privată de browser, să ștergeți cache-ul sau cookie-urile, sau să efectuați o altă acțiune pentru a reseta setările.

Funcționează bannerele inteligente pentru aplicații pe dispozitivele Android?

Nu, bannerele inteligente native pentru aplicații ale Apple sunt exclusive pentru dispozitivele iOS care utilizează browserul Safari. Android nu are un echivalent încorporat.

Cu toate acestea, puteți utiliza un plugin WordPress precum Mobile Smart App Banner pentru a afișa bannere personalizate de descărcare a aplicațiilor vizitatorilor Android.

Sperăm că acest tutorial v-a ajutat să învățați cum să adăugați bannere inteligente pentru aplicații în WordPress. De asemenea, ați putea dori să consultați ghidul nostru despre cele mai bune practici pentru apelurile la acțiune sau selecțiile noastre experte pentru cele mai bune instrumente de tip lead magnet WordPress pentru a crește conversiile.

Dacă v-a plăcut acest articol, atunci vă rugăm să vă abonați la Canalul nostru de YouTube pentru tutoriale video despre WordPress. Ne puteți găsi, de asemenea, pe Twitter și Facebook.