Vet du hur man skapar en Android- eller IOS-applikation av din blogg eller hemsida under WordPress? Vill du också ha din webbplatsikon på din telefon? Ja ?

Men alla alternativ du har provat är antingen för komplicerade eller för dyra och du kastade motvilligt in handduken eftersom " för svårt för dig ”.

Innan vi slänger in handduken helt, ska vi än en gång försöka med dig ett nytt tillvägagångssätt som heter DIY, vilket gör att du billigt kan skapa en grundläggande applikation av din WordPress-webbplats.

 PhoneGap-Built-image-tutorial

PhoneGap Inbyggd: ett enkelt och kostnadseffektivt sätt att föra din WordPress-webbplats till användarnas mobilvärld.

Anledningarna till att skapandet av mobilappar har exploderat idag är att det att ha en mobilapp har blivit en form av marknadsföring som skulle öka chansen att din app upptäcks av nya typer av besökare.

Idag handlar det om att ge dina läsare valet att se ditt innehåll. Och med den fortsatta ökningen av internetåtkomst via mobila enheter blir det naturligtvis mer och mer populärt att ha en mobilapp.

Den mycket goda nyheten är att det inte längre är nödvändigt att leta efter bra apputvecklare med behärskning av CSS eller Java för att bygga en mobilapp för din WordPress-webbplats.

Du kan göra det gratis och mycket ofta utan kostnad. Du kan också spendera några $ 99 / år för att gå med i IOS-utvecklargruppen för att bygga och distribuera din app (direkt eller via App Store).

Låt mig också säga något annat helt klart: det handlar om att skapa en mobilapplikation för att visa innehållet på din WordPress-webbplats på dina läsares mobila enheter. Det handlar inte om att skapa faktiska applikationer med WordPress som ett Application Framework.  

Hur fungerar det?

PhoneGap-Built-how-ca-walking

PGB skapar applikationer mycket enklare

Denna lösning bygger på skapandet av en enkel mobilapplikation med hjälp av tjänsten PhoneGap Build (BMP) som verkligen lever upp till sina påståenden:

Ta ditt tålamod om du vill utveckla WordPress-mobilapplikationer.

Huvudsyftet med ansökan är att taInAppBrowser enheten och peka på startsidan på din webbplats. Som om din läsare använder en mobil webbläsare. Skönheten i detta tillvägagångssätt är att allt effektivt styrs i WordPress med hjälp av de verktyg, tekniker och tekniker du redan känner till.

Om du vill ändra utseendet på din applikation behöver du bara uppdatera Wordpress tema, du behöver inte distribuera en uppdatering till själva appen.

Så lösningen är 1% av applikationen, 99% av WordPress. Vilket innebär att du måste vara försiktig med vad din WordPress-webbplats levererar som innehåll. Även det mest lyhörda temat kommer sannolikt att sakna mobilappar. Du måste se till att du har den bästa mobilupplevelsen, vilket betyder: tänka på temat, innehåll, menyer och interaktion.

Denna handledning kommer därför att fokusera på att stärka applikationen och ställa in WordPress.

Först ladda ner WordPress, sedan kan du testa det genom att helt enkelt surfa på en mobil enhet eller använda en simulator - innan du skapar appen. Och kom alltid ihåg att det är lättare att ta bort en app från en startskärm än att ställa in den därifrån.

4-steg för att skapa en WordPress mobilapp

Låt oss gå steg för steg för att skapa vår applikation. Eftersom Android är enkelt kommer vi att fokusera på det operativsystemet, men kom ihåg att processen för alla operativsystem är ungefär densamma.

innan du börjar

Medan webbappar enkelt kan testas med hjälp av emulatorer, är mobilappar mycket lättare att testa på en riktig enhet. Så om du inte har en Android-enhet, borde du hitta en om du vill fortsätta med den här guiden.

Om du inte har använt PGB ännu, måste du skapa ett konto. BMP har en gratis plan som låter dig skapa en enda privat app (som du kan skapa genom att ladda upp en zip-fil) eller obegränsad open source-applikationer.

Om du är ny på PGB rekommenderar jag att du använder den tillsammans med GitHub eftersom det gör processen att uppdatera och bygga om din app mycket mer sömlös. Det betyder också att du kommer att kunna använda dina GitHub-referenser för att logga in på PGB.

Steg 1. Skapa PGB-appfiler

PhoneGap-Inbyggd create-the-fochiers-från-app

De flesta filerna i den här applikationen är logotyper och startskärmar!

Strukturen är mycket enkel med en rotkatalog som innehåller index.html, config.xml-filerna. Mycket viktigt!, en uppsättning ikonfiler i formatet png standard och en katalog Res som innehåller ikonerna för det specifika operativsystemet för välkomstskärmar och försättsblad.

du kan ladda ner den här appen och använd den för att starta enkelt.

Steg 2. Skapa applikationsikoner

Applikationsikonerna är viktiga: det är de som applikationen kommer att använda när du lägger till en ikon på enhetens startskärm. Använd en av följande tjänster för att skapa ikoner: appiconsizes ou makeappicon. När du har skapat dessa ikoner laddar du upp lämpliga bilder till rätt mapp.

Steg 3. Konfigurera applikationen

All konfiguration finns i filen config.xml. För din egen applikation måste du ändra följande:

  • @ Id widget – konventionen är att vända på domännamn på din webbplats och lägg till ett suffix till applikationen
  • namn - titeln på din webbplats
  • Beskrivning - en kort beskrivning av din webbplats
  • Författaren (@ mail, @ href) - dina kontaktuppgifter
  • src lycklig @ - ändra detta och peka på startsidan på din webbplats
  • Tillgång @ ursprung – det bestämmer vilka webbplatser applikationen kan besöka. De två möjligheterna är: ange din domännamn och därför begränsa appen till att bara surfa på din webbplats eller använda '*' och tillåta appen att surfa på vilken webbplats som helst.

Det finns ett antal plugin-element i den här konfigurationsfilen, varav några inte kommer att vara användbara. Det är dock fortfarande viktigt att skapa dina applikationer med hjälp av några av dessa plugins för att dra nytta av funktioner som geolokalisering utan att behöva återskapa din applikation.

Du kommer också att märka att det finns ett antal appikoner som kommer att användas för enhetens startskärm och för appens startsidor. Om du har flyttat de genererade ikonerna till exakta mappar behöver du inte göra någonting här.

Tänk dock på att namnen är skiftlägeskänsliga!

Steg 4. Låt oss starta PGB-generationsprocessen

Gå till PGB-webbplatsen och logga in, du kommer självklart att vända dig mot applikationsskärmen.

PhoneGap-Inbyggt START-the-process-of-skapande-of-the-genomförandet

PhoneGap Build är mycket lättare när det används tillsammans med GitHub

Förutsatt att du är inloggad på ditt GitHub-konto och ska bygga en öppen källkodsapp. Alla dina offentliga GitHub-förråd finns tillgängliga i « Befintliga hitta repo« , klicka bara på pilen, välj din katalog och klicka på tröja från GitHub förvaret.

PGB kommer att gå till din katalog och presentera en skärm med applikationsdetaljer.

PhoneGap-Built-screen-of-applikationer

När PGB har laddats in i GitHub-filerna är du redo att skapa din applikation.

Klicka på Redo att bygga

Sidan ändras sedan för att ge dig utvecklingen av skapandet av din applikation. Som standard försöker PGB skapa en applikation för iOS, Android och Windows 8. Rött betyder att generationen har misslyckats, medan blå indikerar en framgångsrik skapelse.

PhoneGap-Inbyggt process-of-skapande

PGB kommer att försöka skapa en app för Android, iOS och Windows. Blå betyder att skapandet var framgångsrikt.

iOS kommer alltid att misslyckas om du inte har tillhandahållit PGB dina iOS-utvecklare som kräver medlemskap iOS-utvecklarprogrammet som jag nämnde tidigare.

Förhoppningsvis lyckades dock skapandet av Android-appen och du är redo att testa!

Du kan ladda ner filen .apk genom att klicka på ikonen Android. Men det finns också andra metoder för att återställa den här filen. Men vilken metod du använder bör du hitta din appikon på din startskärm. (om ikonen inte ser ut som vad du förväntade dig, är det troligt att du angav fel webbadress i filen config.xml).

Klicka på din appikon så öppnas den och du hälsas av startskärmen och sedan den första sidan på din webbplats. (Beroende på enhetsspecifikationen kan det finnas små förseningar i att flytta startskärmen till webbplatsen).

Grattis, du har precis skapat din första WordPress-applikation!

Nu beror allt på hur du ställer in din WordPress-webbplats, men fördelen är att du nu bara behöver arbeta i WordPress för att göra förbättringar.

Om en bild-URL av någon anledning är felaktig måste du återskapa appen:

  • Uppdatera filerna i din GitHub-katalog
  • Gå till applikationssidan i PGB och klicka på  uppdateringen kod - filerna laddas upp till din GitHub-katalog
  • PGB bör automatiskt starta rekreationsprocessen - annars regenerera alla

Men om du vill dra nytta av fler funktioner på den mobila enheten, är det värt att titta närmare på det AppPresser.

Men om du bara behöver ge dina läsare ett val genom att förse dem med en mobilapp, kommer denna process att hjälpa dig att göra det.

Vi hoppas att den här guiden hjälpte dig att skapa en mobilapp för din WordPress-webbplats. Om du har några förslag eller kommentarer, vänligen dela dem med oss ​​i vårt avsnitt.