Czy wiesz jak stworzyć aplikację na Androida lub IOS? Twój blog lub strona internetowa pod WordPressem? Czy chcesz mieć także ikonę swojej witryny na swoim telefonie? Tak ?

Ale wszystkie opcje, które wypróbowałeś, są albo zbyt skomplikowane, albo zbyt drogie i niechętnie rzuciłeś ręcznik, ponieważ „ za trudne dla ciebie ”.

Cóż, zanim całkowicie rzucimy ręcznik, ponownie spróbujemy z Tobą nowego podejścia zwanego DIY, które pozwoli Ci niedrogo stworzyć podstawową aplikację Twojej witryny WordPress.

 PhoneGap budynek-image-tutorial

PhoneGap budowy: prosty i opłacalny sposób na przeniesienie witryny WordPress do mobilnego świata użytkowników.

Powody, dla których tworzenie aplikacji mobilnych rozwinęło się dzisiaj, to fakt, że posiadanie aplikacji mobilnej stało się formą marketingu, który zwiększyłby szanse na odkrycie Twojej aplikacji przez nowe typy użytkowników.

Dziś chodzi o to, aby dać swoim czytelnikom możliwość wyboru sposobu wyświetlania treści. I oczywiście, wraz z ciągłym wzrostem dostępu do Internetu za pośrednictwem urządzeń mobilnych, posiadanie aplikacji mobilnej staje się coraz bardziej popularne.

Bardzo dobrą wiadomością jest to, że szukanie dobrych programistów aplikacji z biegłością w CSS lub Javie nie jest już konieczne do zbudowania aplikacji mobilnej dla Twojej witryny WordPress.

Możesz to zrobić za darmo i bardzo często bez opłat. Możesz również wydać kilka $ 99 / rok dołączyć do społeczności programistów IOS w celu tworzenia i rozpowszechniania aplikacji (bezpośrednio lub przez App Store).

Pozwól, że powiem jeszcze coś całkiem jasnego: chodzi o stworzenie aplikacji mobilnej do wyświetlania zawartości Twojej witryny WordPress na urządzeniach mobilnych Twoich czytelników. Nie chodzi o tworzenie rzeczywistych aplikacji przy użyciu WordPressa jako struktury aplikacji.  

Jak to działa?

PhoneGap budynek-how-ca-walking

PGB tworzy aplikacje znacznie prościej

Rozwiązanie to polega na stworzeniu prostej aplikacji mobilnej z wykorzystaniem serwisu PhoneGap Build (PGB) kto naprawdę spełnia swoje roszczenia:

Zachowaj cierpliwość, jeśli chcesz tworzyć aplikacje mobilne WordPress.

Głównym celem aplikacji będzie pobranie plikuInAppBrowser urządzenie i skieruj je na stronę główną swojej witryny. Jakby Twój czytelnik korzystał z mobilnej przeglądarki internetowej. Piękno tego podejścia polega na tym, że wszystko jest skutecznie kontrolowane w WordPress przy użyciu narzędzi, technik i technologii, które już znasz.

Jeśli chcesz zmienić wygląd swojej aplikacji, wystarczy zaktualizować WordPress, nie ma potrzeby wdrażania aktualizacji samej aplikacji.

Tak więc rozwiązaniem jest 1% aplikacji, 99% WordPress. Oznacza to, że musisz uważać, jakie treści dostarcza Twoja witryna WordPress. Nawet najbardziej responsywny motyw prawdopodobnie nie będzie pasował do aplikacji mobilnych. Musisz upewnić się, że masz najlepsze wrażenia na urządzeniach mobilnych, co oznacza: pomyśl o temacie, treści, menu i interakcji.

Dlatego ten samouczek skupi się na wzmocnieniu aplikacji i konfiguracji WordPress.

Najpierw pobierz WordPress, a następnie możesz go przetestować, po prostu przeglądając na urządzeniu mobilnym lub korzystając z symulatora - przed utworzeniem aplikacji. I zawsze pamiętaj, że usunięcie aplikacji z ekranu głównego jest łatwiejsze niż skonfigurowanie jej z tego miejsca.

4 kroki, aby utworzyć aplikację mobilną WordPress

Przejdźmy krok po kroku, aby stworzyć naszą aplikację. Ponieważ Android jest łatwy, skupimy się na tym systemie operacyjnym, ale pamiętaj, że proces dla każdego systemu operacyjnego jest prawie taki sam.

przed rozpoczęciem

Podczas gdy aplikacje internetowe można łatwo testować za pomocą emulatorów, aplikacje mobilne są znacznie łatwiejsze do testowania na prawdziwym urządzeniu. Więc jeśli nie masz urządzenia z Androidem, lepiej poszukaj go, jeśli chcesz kontynuować ten samouczek.

Jeśli jeszcze nie korzystałeś z PGB, musisz utworzyć konto. BMP ma darmowy plan, który umożliwia tworzenie jednej prywatnej aplikacji (które możesz utworzyć, przesyłając plik zip) lub nieograniczone aplikacje open source.

Jeśli dopiero zaczynasz korzystać z PGB, polecam używanie go w połączeniu z GitHub, ponieważ sprawia, że ​​proces aktualizacji i przebudowy aplikacji jest znacznie bardziej płynny. Oznacza to również, że będziesz mógł używać swoich poświadczeń GitHub do logowania się do PGB.

Krok 1. Utwórz pliki aplikacji PGB

PhoneGap budynek utworzyć-the-fochiers-z-app

Większość plików w tej aplikacji to logo i ekrany startowe!

Struktura jest bardzo prosta, z katalogiem głównym zawierającym pliki index.html, config.xml. Bardzo ważne!, zestaw plików ikon w formacie png domyślny i katalog res który zawiera ikony konkretnego systemu operacyjnego dla ekranów powitalnych i stron tytułowych.

Można pobierz tę aplikację i użyj go, aby łatwo zacząć.

Krok 2. Utwórz ikony aplikacji

Ikony aplikacji są ważne: to te, których aplikacja będzie używać podczas dodawania ikony do ekranu głównego urządzenia. Aby wygenerować ikony, użyj jednej z następujących usług: appiconsizes ou makeappicon. Po utworzeniu tych ikon prześlij odpowiednie obrazy do odpowiedniego folderu.

Krok 3. Skonfiguruj aplikację

Cała konfiguracja jest zawarta w pliku config.xml. W przypadku własnej aplikacji należy zmodyfikować następujące elementy:

  • Widżet @ id – konwencja polega na odwróceniu Nazwa domeny swojej witryny i dodaj sufiks do aplikacji
  • Nazwa - tytuł Twojej witryny
  • Opis - krótki opis Twojej witryny
  • autor (@ mail, @ href) - Twoje dane kontaktowe
  • src szczęśliwy @ - zmień to i skieruj na stronę główną swojej witryny
  • Dostęp @ pochodzenia – określa, które strony internetowe aplikacja może przeglądać. Dwie możliwości to: wprowadź swój Nazwa domeny i dlatego ogranicz aplikację do przeglądania tylko Twojej witryny lub użyj znaku „*” i zezwól aplikacji na przeglądanie dowolnej witryny.

W tym pliku konfiguracyjnym znajduje się wiele elementów wtyczki, z których niektóre nie będą przydatne. Jednak nadal ważne jest, aby tworzyć aplikacje przy użyciu niektórych z tych wtyczek, aby korzystać z funkcji, takich jak geolokalizacja, bez konieczności ponownego tworzenia aplikacji.

Zauważysz również, że istnieje wiele ikon aplikacji, które będą używane na ekranie głównym urządzenia i na stronach głównych aplikacji. Jeśli przeniosłeś wygenerowane ikony do dokładnych folderów, nie będziesz musiał tutaj nic robić.

Pamiętaj jednak, że w nazwach rozróżniana jest wielkość liter!

Krok 4. Rozpocznijmy proces generowania PGB

Wejdź na stronę PGB i zaloguj się, znajdziesz się przed ekranem aplikacji, który oczywiście będzie pusty.

PhoneGap budynek-start-w-procesie-of-tworzenia-of-the-realizacji

PhoneGap Build jest znacznie łatwiejszy w połączeniu z GitHub

Zakładając, że jesteś zalogowany na swoje konto GitHub i zamierzasz stworzyć aplikację typu open source. Wszystkie Twoje publiczne repozytoria GitHub będą dostępne w « znajdź istniejące repo« , po prostu kliknij strzałkę, wybierz katalog i kliknij ściągnij z repozytorium GitHub.

PGB przejdzie do twojego katalogu i wyświetli ekran szczegółów aplikacji.

PhoneGap-Wbudowany ekran-of-aplikacji

Po załadowaniu PGB do plików GitHub będziesz gotowy do utworzenia aplikacji.

Kliknij Gotowy do zbudowania

Strona zmieni się następnie, aby pokazać postęp w tworzeniu aplikacji. Domyślnie PGB próbuje utworzyć aplikację dla iOS, Android i Windows 8, Kolor czerwony oznacza, że ​​generowanie nie powiodło się, natomiast kolor niebieski oznacza pomyślne utworzenie.

PhoneGap-Wbudowany proces-of-utworzenia

PGB spróbuje stworzyć aplikację na Androida, iOS i Windows. Niebieski oznacza, że ​​tworzenie się powiodło.

iOS zawsze zawiedzie, o ile nie dostarczysz PGB certyfikatów programistów iOS, które wymagają członkostwa Program dla programistów iOS Jak wspomniałem wcześniej.

Miejmy jednak nadzieję, że aplikacja na Androida zakończyła się sukcesem i jesteś gotowy do testowania!

Możesz pobrać plik apk klikając ikonę Android. Ale są też inne metody odzyskiwania tego pliku. Jednak niezależnie od używanej metody, ikona aplikacji powinna znajdować się na ekranie głównym. (jeśli ikona nie wygląda tak, jak się spodziewałeś, prawdopodobnie podałeś zły adres URL w pliku config.xml).

Kliknij ikonę swojej aplikacji, a otworzy się i przywita Cię ekran startowy, a następnie pierwsza strona Twojej witryny. (W zależności od specyfikacji urządzenia mogą wystąpić niewielkie opóźnienia w przenoszeniu ekranu głównego do witryny).

Gratulacje, właśnie stworzyłeś swoją pierwszą aplikację WordPress!

Teraz wszystko będzie zależeć od tego, jak skonfigurujesz swoją witrynę WordPress, ale zaletą jest to, że teraz wystarczy pracować w WordPress, aby wprowadzić ulepszenia.

Jeśli z jakiegoś powodu adres URL obrazu jest nieprawidłowy, musisz ponownie utworzyć aplikację:

  • Zaktualizuj pliki w katalogu GitHub
  • Przejdź do strony aplikacji w PGB i kliknij  Kod aktualizacja - pliki zostaną przesłane do Twojego katalogu GitHub
  • PGB powinien automatycznie rozpocząć proces odtwarzania - w przeciwnym razie Zregeneruj wszystko

Jeśli jednak chcesz skorzystać z większych możliwości urządzenia mobilnego, warto przyjrzeć się bliżej AppPresser.

Ale jeśli musisz tylko dać czytelnikom wybór, dostarczając im aplikację mobilną, ten proces pomoże ci to zrobić.

Mamy nadzieję, że ten samouczek pomógł Ci stworzyć aplikację mobilną dla Twojej witryny WordPress. Jeśli masz jakieś sugestie lub uwagi, podziel się nimi z nami w naszej sekcji komentarzy.