Cum să vă transformați site-ul Divi într-o aplicație mobilă cu AppPresser

Asigurarea că site-ul dvs. WordPress este pregătit pentru mobil nu a fost niciodată mai critic. La urma urmei, utilizatorii de telefonie mobilă reprezintă acum majoritatea traficului online. Asta înseamnă că trebuie să faci tot ce îți stă în putință pentru a te asigura că experiența lor este cât se poate de bună.

Datorită serviciilor precum AppPresser, puteți crea acum aplicații simple pentru site-ul dvs. WordPress, chiar dacă nu aveți un background de dezvoltare. În acest articol, vă vom învăța cum să utilizați platforma pentru a dezvolta o aplicație mobilă. Cu toate acestea, să vorbim mai întâi despre aplicațiile mobile, despre viitorul navigării pe web și despre ce vă poate oferi AppPresser.

De ce aplicațiile mobile sunt viitorul navigării pe web

Având în vedere statisticile, probabil că citiți acest lucru de pe un dispozitiv mobil - și poate fi chiar modul în care interacționați în principal cu webul în aceste zile. La urma urmei, majoritatea dintre noi ne vom scoate smartphone-urile de fiecare dată când avem șanse, inclusiv să navigăm pe web.

Creșterea sensibilității site-ului dvs. nu înseamnă că trebuie să sacrificați stilul pentru al face utilizabil.

În calitate de proprietar al site-ului, cel mai simplu mod de a răspunde utilizatorilor de dispozitive inteligente este să vă optimizați site-ul pentru spații de vizualizare mai mici. În acest fel, utilizatorii vor avea o experiență consistentă, indiferent de dispozitivul pe care îl folosesc. Cu toate acestea, există și o altă opțiune - deși una care implică un pic mai multă muncă - și asta creează o aplicație pentru site-ul dvs.

Aplicațiile au câteva avantaje distincte față de site-urile obișnuite pentru dispozitive mobile:

1. Acestea oferă cititorilor un memento constant al site-ului dvs. Deținerea unei aplicații dedicate pe dispozitivul lor ar putea determina unii utilizatori să se gândească la verificarea conținutului nou. Puteți, de asemenea, să obțineți o frecvență de vizitare mai mare decât de obicei.
2. Puteți include caracteristici dedicate, specifice dispozitivelor mobile. O mulțime de aplicații includ funcții interesante, cum ar fi conectări sociale și notificări push. Sigur, este de asemenea posibil să le implementați pe un site obișnuit, dar se simt mai natural ca parte a unei aplicații.
3. Pare profesional. A avea o aplicație pentru site-ul dvs. web îl face să pară profesional. Atâta timp cât oferiți o ofertă modernă și stabilă, șansele sunt ca utilizatorii să plece simțindu-se impresionați.

Desigur, crearea unei aplicații pentru site-ul dvs. web nu înseamnă că ar trebui să renunțați la a-l face compatibil cu dispozitivele mobile. Gândiți-vă la aceasta ca la o măsură complementară pentru a maximiza expunerea sa. Cea mai bună parte este că procesul de creare a aplicațiilor nu este atât de complicat, datorită unor noi servicii interesante.

O introducere în AppPresser

AppPresser este un serviciu care vă permite să luați site-ul dvs. WordPress existent și să îl transformați într-o aplicație mobilă cu aspect modern. Folosind platforma, puteți adăuga oricare dintre paginile dvs. existente, puteți crea meniuri și puteți beneficia de funcții avansate, inclusiv notificări push pentru a face aplicația să arate mai profesională.

Cea mai bună parte este că utilizarea serviciului este extrem de simplă. De fapt, este pe deplin posibil ca o aplicație funcțională (și elegantă) să funcționeze în câteva ore folosind AppPresser.

Probabil că veți dori să optați pentru planul inițial de 19 USD pe lună, care acceptă o singură aplicație. Dacă aveți nevoie de mai mult decât atât (sau intenționați să generați bani din aplicația dvs.), există și alte niveluri disponibile.

Caracteristici cheie:

• Vă permite să creați aplicații mobile pentru Android și iOS.
• Include o temă WordPress și un plugin care vă permite să accesați funcții avansate ale aplicației.
• Oferă opțiuni de conectare socială și partajare.

Preț: 19 USD pe lună | Mai multe informatii

Cum să vă transformați site-ul Divi într-o aplicație mobilă cu AppPresser

Înainte de a intra în tutorial, va trebui să vă înscrieți pentru un cont atât pe AppPresser - care, așa cum am menționat anterior, este un serviciu plătit -, cât și pe Phonegap (pe care va trebui să îl utilizați pentru ultimul pas).

După ce vă înscrieți la primul, veți primi un e-mail care oferă acces la pluginul AppPresser și la tema complementară a acestuia (care nu poate fi găsită în altă parte).

În ceea ce privește tema, nu vă faceți griji - nu este nevoie să o activați. Trebuie să fie instalat doar pentru a permite pluginului AppPresser și aplicației web să acceseze datele și va apărea numai pentru aplicația dvs. mobilă. Dacă sunteți utilizator Divi, utilizarea temei și pluginului AppPresser nu vă va afecta instalarea.

După ce ați instalat și activat pluginul AppPresser, apoi ați încărcat tema acestuia (dar nu l-ați activat), treceți la primul pas!

Pasul 1: Creați o aplicație nouă și personalizați-i stilul

Pentru a începe lucrurile, va trebui să vă conectați la contul dvs. AppPresser folosind aceleași acreditări cu care v-ați înscris. Serviciul vă va solicita să creați o aplicație nouă, așa că, după ce ați adăugat un titlu, faceți clic pe Creați aplicație :

Apoi, va trebui să vă conectați site-ul web la aplicație înainte de a începe să îl personalizați. Pentru aceasta, faceți clic pe fila General de pe tabloul de bord AppPresser și căutați secțiunea care citește SETĂRI API:

Copiați atât slugul site - ului, cât și ID-ul aplicației , apoi mergeți la fila AppPresser de pe tabloul de bord WordPress. Veți găsi două câmpuri corespunzătoare, așa că lipiți datele acolo, apoi salvați modificările:

Cu acest lucru în afara drumului, puteți începe să lucrați la personalizarea aplicației dvs. Reveniți la tabloul de bord AppPresser, navigați la Personalizare , apoi faceți clic pe butonul Personalizați și creați aplicația :

Următorul ecran ar trebui să pară familiar deoarece este modelat după personalizatorul live WordPress și veți vedea, de asemenea, o machetă a unui dispozitiv mobil care afișează un prototip al aplicației dvs. După ce am terminat, veți putea descărca o versiune complet funcțională a acesteia.

În următorii pași, vom acoperi cele mai critice secțiuni din personalizator, dar deocamdată să ne concentrăm pe fila Culoare . Aici veți găsi mai multe opțiuni pentru a schimba culorile aplicației și explicații pentru ceea ce face fiecare dintre ele:

După ce ați modificat paleta de culori a aplicației și sunteți mulțumit de rezultate, este timpul să vă uitați la meniul dvs.

Pasul 2: Schimbați meniul aplicației

Fiecare aplicație AppPresser începe cu același meniu implicit: un ecran de pornire, intro și Despre pagini și un link către pagina principală a serviciului. Pentru a le înlocui, va trebui să accesați fila Meniuri din personalizatorul dvs. și să faceți clic pe opțiunea Meniu aplicație :

În ecranul următor, puteți alege elemente din meniul din stânga. În acest caz, butoanele Acasă, Introducere și Despre toate vă conduc către pagini personalizate și puteți alege dacă ștergeți elementele de meniu ale acestora făcând clic pe opțiunea Eliminare :

De asemenea, puteți păstra acele elemente de meniu și personaliza paginile respective (dintre care mai multe într-un minut). Pentru moment, eliminați orice element de meniu pe care nu îl doriți și utilizați opțiunea Adăugați articole pentru a umple meniul cu alte pagini. Pentru aceasta, veți putea alege fie paginile WordPress existente, postările, fie cele personalizate (create cu AppPresser) ...

… Și făcând clic pe butonul WordPress / Link-uri externe vă va oferi opțiunea de a include un link către una dintre paginile site-ului dvs. WordPress :

Odată ce meniul dvs. este completat (și tema AppPresser este instalată), aplicația va putea „exporta” conținutul site-ului dvs. și îl va afișa automat:

În mai puțin de un minut, tocmai ați adăugat o nouă pagină pregătită pentru mobil în aplicația dvs. Repetați procesul după cum este necesar pentru celelalte pagini, înainte de a analiza configurarea celor personalizate.

Pasul 3: Adăugați pagini personalizate în aplicația dvs.

Pentru a configura pagini personalizate, accesați fila corespunzătoare din personalizator. La fel ca în meniul dvs. standard, veți găsi trei pagini existente: Acasă, Introducere și Despre. În acest stadiu, puteți alege să le reutilizați pentru fiecare aplicație proprie sau pur și simplu să le ignorați și să creați pagini noi:

Dacă faceți clic pe butonul Adăugați o pagină nouă, veți avea două opțiuni: utilizarea HTML personalizat pentru a crea noua dvs. pagină ...

… Sau alegerea dintre unul dintre stilurile pre-construite AppPresser, care include un format de listă și aspectul cardului:

Pentru a configura oricare dintre ele, va trebui să creați pagini de listă personalizate utilizând API-ul WordPress. Apoi, lipiți linkul către noua dvs. pagină în câmpul de sub oricare dintre stilurile încorporate ale aplicației:

Când ați terminat de jucat cu paginile dvs. personalizate, este timpul să încheiați lucrurile prin modificarea unor setări suplimentare pentru aplicația dvs.

Pasul 4: Personalizați setările aplicației

În acest stadiu, ar trebui să aveți o aplicație funcțională - cel puțin în cadrul personalizatorului - dar una care să poarte în continuare pictograma și sigla AppPresser . Pentru a le înlocui, navigați la fila Setări din personalizator:

Aici puteți indica ce meniuri doriți să utilizeze aplicația dvs. Deocamdată, vă recomandăm să rămâneți cu cel pe care l-ați creat mai devreme, cu excepția cazului în care doriți să configurați altele.

Dacă continuați să derulați în jos, veți vedea opțiunile pentru a schimba numele aplicației, descrierea acesteia și informațiile despre autor. Completați aceste câmpuri, dacă este necesar, apoi continuați să derulați până când ajungeți la pictogramă și strângeți secțiunile de imagine:

Va trebui să încărcați fișiere PNG aici pentru fiecare dintre opțiunile disponibile. După ce ați terminat, pictograma dvs. va apărea deasupra meniului dvs. principal, iar ecranele de vizualizare vor fi afișate la încărcarea aplicației.

Rețineți că AppPresser include câteva informații despre dimensiunea imaginilor pe care ar trebui să le încărcați, deci ar trebui să le respectați, cu excepția cazului în care doriți ca imaginile dvs. să pară distorsionate. Când ați terminat aici, este timpul să vă puneți în funcțiune aplicația.

Ce trebuie să faceți după ce aplicația dvs. este gata de lansare

Pentru a finaliza construirea aplicației, va trebui să accesați secțiunea Construire și previzualizare din cadrul personalizatorului. Acolo, veți vedea o opțiune pentru a introduce jetonul de autentificare Phonegap. Pentru cei neinițiați, Phonegap este un cadru pe care va trebui să îl utilizați pentru a vă pune aplicația pe un dispozitiv sau pentru a o trimite în magazine.

După actualizarea jetonului dvs., veți vedea o opțiune de compilare a aplicației, pe care serviciul o va face pentru dvs. Apoi, este doar o chestiune de a o trimite fie magazinelor Android și iOS (sau ambelor), așteptarea aprobării și conectarea la acestea de pe site-ul dvs. obișnuit.

Dacă vă gândiți să distribuiți aplicația direct de pe site-ul dvs., vă recomandăm să o împiedicați - în principal din motive de securitate. Mai mult decât atât, este posibil ca utilizatorii să nu se simtă în siguranță descărcând aplicații care nu au fost aprobate de niciunul dintre servicii, astfel încât eforturile dvs. se pot pierde dacă omiteți etapa de trimitere. Desigur, pluginurile WordPress, cum ar fi Easy Digital Downloads, se pot potrivi cu factura, dar aceleași considerații de mai sus ar trebui să se aplice.

Concluzie

Construirea unei aplicații pentru site-ul dvs. WordPress poate suna prea mult, dar poate fi de fapt o idee inteligentă. La urma urmei, servicii precum AppPresser au făcut-o mai ușoară ca niciodată. Mai mult, o aplicație ar putea fi exact ceea ce aveți nevoie pentru a vă implica mai mult utilizatorii de telefonie mobilă datorită funcțiilor precum notificările push.

În această postare, v-am arătat cum să vă transformați site-ul Divi într-o aplicație mobilă folosind AppPresser. Să recapitulăm rapid pașii:

1. Creați o aplicație nouă și personalizați-i stilul.
2. Schimbați meniul aplicației.
3. Adăugați pagini personalizate în aplicație.
4. Personalizați setările aplicației.

Aveți întrebări despre utilizarea AppPresser pentru a crea aplicații mobile pentru Divi? Întrebați în secțiunea de comentarii de mai jos!

Imagine în miniatură a articolului de la 31moonlight31 / shutterstock.com