Cara Mengubah Situs Divi Anda menjadi Aplikasi Seluler Dengan AppPresser
Diterbitkan: 2017-05-06Memastikan situs web WordPress Anda siap untuk seluler tidak pernah sepenting ini. Lagi pula, pengguna seluler sekarang menjadi mayoritas lalu lintas online. Itu berarti Anda harus melakukan segala daya Anda untuk memastikan pengalaman mereka sebaik mungkin.
Berkat layanan seperti AppPresser, Anda sekarang dapat membuat aplikasi sederhana untuk situs WordPress Anda, bahkan jika Anda tidak memiliki latar belakang pengembangan. Dalam artikel ini, kami akan mengajari Anda cara menggunakan platform untuk mengembangkan aplikasi seluler. Namun, pertama-tama mari kita bicara tentang aplikasi seluler, masa depan penjelajahan web, dan apa yang dapat ditawarkan AppPresser kepada Anda.
Mengapa Aplikasi Seluler Adalah Masa Depan Penjelajahan Web
Mengingat statistiknya, Anda mungkin membaca ini dari perangkat seluler – dan ini mungkin cara Anda paling sering berinteraksi dengan web akhir-akhir ini. Lagi pula, kebanyakan dari kita akan mengeluarkan ponsel cerdas kita setiap ada kesempatan, termasuk untuk menjelajahi web.

Membuat situs Anda responsif tidak berarti Anda harus mengorbankan gaya agar dapat digunakan.
Sebagai pemilik situs, cara paling sederhana untuk melayani pengguna perangkat pintar adalah dengan mengoptimalkan situs Anda untuk area pandang yang lebih kecil. Dengan begitu, pengguna akan memiliki pengalaman yang konsisten terlepas dari perangkat yang mereka gunakan. Namun, ada juga opsi lain – meskipun yang melibatkan sedikit lebih banyak pekerjaan – dan itu membuat aplikasi untuk situs Anda.
Aplikasi memiliki beberapa keunggulan berbeda dibandingkan situs web ramah seluler biasa:
- Mereka menawarkan pembaca pengingat situs Anda. Memiliki aplikasi khusus di perangkat mereka mungkin membuat beberapa pengguna berpikir untuk memeriksa konten baru. Anda juga dapat menjaring frekuensi kunjungan yang lebih tinggi dari biasanya.
- Anda dapat menyertakan fitur khusus seluler khusus. Banyak aplikasi menyertakan fitur menarik seperti login sosial dan pemberitahuan push. Tentu, ini juga memungkinkan untuk menerapkan ini di situs biasa, tetapi mereka merasa lebih alami sebagai bagian dari sebuah aplikasi.
- Ini terlihat profesional. Memiliki aplikasi untuk situs web Anda membuatnya terlihat profesional. Selama Anda menawarkan penawaran yang modern dan stabil, kemungkinan besar pengguna akan pergi dengan perasaan terkesan.
Tentu saja, membuat aplikasi untuk situs web Anda tidak berarti Anda harus membuatnya ramah seluler. Anggap saja sebagai ukuran pelengkap untuk memaksimalkan eksposurnya. Bagian terbaiknya adalah, proses pembuatan aplikasi tidak terlalu rumit, berkat beberapa layanan baru yang menarik.
Pengantar AppPresser

AppPresser adalah layanan yang memungkinkan Anda untuk mengambil situs web WordPress yang ada dan mengubahnya menjadi aplikasi seluler yang tampak modern. Dengan menggunakan platform ini, Anda dapat menambahkan halaman mana pun yang ada, membuat menu, dan memanfaatkan fitur-fitur canggih termasuk pemberitahuan push untuk membuat aplikasi Anda terlihat lebih profesional.
Bagian terbaiknya adalah, menggunakan layanan ini sangat sederhana. Faktanya, sangat mungkin untuk membuat aplikasi yang berfungsi (dan bergaya) aktif dan berjalan dalam hitungan jam menggunakan AppPresser.
Anda mungkin ingin memilih paket awal $19 per bulan, yang mendukung satu aplikasi. Jika Anda membutuhkan lebih dari itu (atau Anda berencana untuk memonetisasi aplikasi Anda), ada tingkatan lain yang tersedia.
Fitur Utama:
- Memungkinkan Anda membuat aplikasi seluler untuk Android dan iOS.
- Termasuk tema dan plugin WordPress yang memungkinkan Anda mengakses fitur aplikasi lanjutan.
- Menawarkan login sosial dan opsi berbagi.
Harga: $19 per bulan | Informasi Lebih Lanjut
Cara Mengubah Situs Divi Anda menjadi Aplikasi Seluler dengan AppPresser
Sebelum kita masuk ke tutorial, Anda harus mendaftar akun di AppPresser – yang, seperti yang kami sebutkan sebelumnya, adalah layanan berbayar – dan Phonegap (yang harus Anda gunakan untuk langkah terakhir).
Setelah mendaftar ke yang pertama, Anda akan mendapatkan email yang menyediakan akses ke plugin AppPresser dan tema pelengkapnya (yang tidak dapat ditemukan di tempat lain).

Untuk tema, jangan khawatir – Anda tidak perlu mengaktifkannya. Itu hanya perlu diinstal untuk mengaktifkan plugin AppPresser dan aplikasi web untuk mengakses data, dan itu hanya akan muncul untuk aplikasi seluler Anda. Jika Anda pengguna Divi, menggunakan tema dan plugin AppPresser tidak akan memengaruhi instalasi Anda.
Setelah Anda menginstal dan mengaktifkan plugin AppPresser, lalu mengunggah temanya (tetapi tidak mengaktifkannya), lanjutkan ke langkah pertama!
Langkah #1: Buat Aplikasi Baru dan Sesuaikan Gayanya
Untuk memulai, Anda harus masuk ke akun AppPresser Anda menggunakan kredensial yang sama dengan yang Anda daftarkan. Layanan akan meminta Anda untuk membuat aplikasi baru, jadi setelah Anda menambahkan judul, klik Buat Aplikasi :

Selanjutnya, Anda harus menautkan situs web ke aplikasi Anda sebelum mulai menyesuaikannya. Untuk melakukannya, klik tab Umum di dasbor AppPresser Anda dan cari bagian yang bertuliskan PENGATURAN API:

Salin siput situs dan ID aplikasi Anda , lalu buka tab AppPresser di dasbor WordPress Anda. Anda akan menemukan dua bidang yang sesuai, jadi tempelkan data Anda di sana, lalu simpan perubahannya:

Dengan itu, Anda dapat mulai mengerjakan penyesuaian aplikasi Anda. Kembali ke dasbor AppPresser Anda, navigasikan ke Customize , lalu klik tombol Customize and Build App :

Layar berikutnya akan terlihat familier karena dimodelkan setelah penyesuai langsung WordPress, dan Anda juga akan melihat mockup perangkat seluler yang menampilkan prototipe aplikasi Anda. Setelah kami selesai, Anda akan dapat mengunduh versi yang berfungsi penuh.

Selama beberapa langkah berikutnya, kita akan membahas bagian paling penting dalam penyesuai, tetapi untuk sekarang mari kita fokus pada tab Warna . Di sini Anda akan menemukan beberapa opsi untuk mengubah warna dan penjelasan aplikasi Anda untuk masing-masing opsi:

Setelah Anda mengubah palet warna aplikasi Anda dan puas dengan hasilnya, saatnya untuk melihat menu Anda.

Langkah #2: Ubah Menu Aplikasi Anda
Setiap aplikasi AppPresser dimulai dengan menu default yang sama: Layar beranda, halaman pengantar dan Tentang , dan tautan ke halaman beranda layanan. Untuk menggantinya, Anda harus masuk ke tab Menu dalam penyesuai Anda dan klik opsi Menu Aplikasi :

Pada layar berikutnya, Anda dapat memilih elemen dari menu sebelah kiri. Dalam hal ini, tombol Beranda, Intro, dan Tentang semuanya mengarahkan Anda ke halaman khusus, dan Anda dapat memilih apakah akan menghapus item menunya sekarang dengan mengeklik opsi Hapus :

Anda juga dapat menyimpan item menu tersebut dan menyesuaikan halamannya masing-masing (lebih banyak lagi dalam satu menit). Untuk saat ini, hapus item menu yang tidak Anda inginkan dan gunakan opsi Add Items untuk mengisi menu Anda dengan halaman lain. Untuk ini, Anda dapat memilih halaman WordPress, posting, atau kustom yang ada (dibuat menggunakan AppPresser)…

…dan mengklik tombol WordPress/Tautan Eksternal akan memberi Anda opsi untuk menyertakan tautan ke salah satu halaman situs WordPress Anda :

Setelah menu Anda terisi (dan tema AppPresser diinstal), aplikasi akan dapat 'mengekspor' konten situs Anda dan menampilkannya secara otomatis:

Dalam waktu kurang dari satu menit, Anda baru saja menambahkan halaman mobile-ready baru ke aplikasi Anda. Ulangi proses yang diperlukan untuk halaman Anda yang lain, sebelum melihat pengaturan yang khusus.
Langkah #3: Tambahkan Halaman Kustom ke Aplikasi Anda
Untuk mengatur halaman khusus, buka tab yang sesuai di penyesuai. Seperti menu standar Anda, Anda akan menemukan tiga halaman yang ada: Beranda, Intro, dan Tentang. Pada tahap ini, Anda dapat memilih untuk menggunakan kembali masing-masing untuk aplikasi Anda sendiri, atau abaikan saja dan buat halaman baru:

Mengklik tombol Tambahkan Halaman Baru akan memberi Anda dua opsi: menggunakan HTML khusus untuk membuat halaman baru Anda…

…atau memilih dari salah satu gaya bawaan AppPresser, yang mencakup format daftar dan tata letak kartu:

Untuk menyiapkan salah satunya, Anda harus membuat halaman daftar kustom menggunakan API WordPress. Kemudian, cukup tempel tautan ke halaman baru Anda di bidang tepat di bawah salah satu gaya bawaan aplikasi:

Ketika Anda selesai mengutak-atik halaman kustom Anda, saatnya untuk menyelesaikan semuanya dengan mengutak-atik beberapa pengaturan tambahan untuk aplikasi Anda.
Langkah #4: Sesuaikan Pengaturan Aplikasi Anda
Pada tahap ini, Anda harus memiliki aplikasi yang berfungsi – setidaknya di dalam penyesuai – tetapi yang masih menggunakan ikon dan logo AppPresser . Untuk menggantinya, navigasikan ke tab Pengaturan di dalam penyesuai:

Di sini, Anda dapat menunjukkan menu mana yang Anda inginkan untuk digunakan oleh aplikasi Anda. Untuk saat ini, kami sarankan untuk tetap menggunakan yang Anda buat sebelumnya kecuali jika Anda ingin menyiapkan yang tambahan.
Jika Anda terus menggulir ke bawah, Anda akan melihat opsi untuk mengubah nama aplikasi, deskripsi, dan info penulis Anda. Isi bidang ini jika perlu, lalu lanjutkan menggulir hingga Anda mencapai ikon dan bagian gambar percikan:

Anda harus mengunggah file PNG di sini untuk setiap opsi yang tersedia. Setelah selesai, ikon Anda akan muncul di atas menu utama Anda, dan layar splash Anda akan ditampilkan saat aplikasi Anda dimuat.
Ingatlah bahwa AppPresser menyertakan beberapa informasi tentang ukuran gambar yang harus Anda unggah, jadi Anda harus mematuhinya kecuali jika Anda ingin gambar Anda terlihat terdistorsi. Setelah selesai di sini, saatnya untuk mengaktifkan dan menjalankan aplikasi Anda.
Apa yang Harus Dilakukan Setelah Aplikasi Anda Siap Diluncurkan
Untuk menyelesaikan pembuatan aplikasi, Anda harus masuk ke bagian Bangun dan Pratinjau di dalam penyesuai. Di sana, Anda akan melihat opsi untuk memasukkan token otentikasi Phonegap Anda. Untuk yang belum tahu, Phonegap adalah kerangka kerja yang harus Anda gunakan untuk memasukkan aplikasi Anda ke perangkat, atau mengirimkannya ke toko.
Setelah memperbarui token, Anda akan melihat opsi untuk mengompilasi aplikasi, yang akan dilakukan layanan untuk Anda. Kemudian, tinggal mengirimkannya ke toko Android dan iOS (atau keduanya), menunggu persetujuan, dan menautkannya dari situs web biasa Anda.
Jika Anda berpikir untuk mendistribusikan aplikasi Anda langsung dari situs Anda, kami sarankan untuk tidak melakukannya – terutama karena alasan keamanan. Terlebih lagi, pengguna mungkin merasa tidak aman mengunduh aplikasi yang belum disetujui oleh salah satu layanan, sehingga upaya Anda mungkin akan sia-sia jika Anda melewatkan langkah pengiriman. Tentu saja, plugin WordPress seperti Easy Digital Downloads mungkin sesuai dengan tagihan, tetapi pertimbangan yang sama di atas harus tetap berlaku.
Kesimpulan
Membangun aplikasi untuk situs WordPress Anda mungkin terdengar berlebihan, tetapi sebenarnya itu bisa menjadi ide yang cerdas. Bagaimanapun, layanan seperti AppPresser telah membuatnya lebih mudah dari sebelumnya. Terlebih lagi, aplikasi mungkin hanya apa yang Anda butuhkan untuk melibatkan pengguna ponsel Anda lebih jauh berkat fitur seperti pemberitahuan push.
Dalam posting ini, kami telah menunjukkan kepada Anda cara mengubah situs Divi Anda di aplikasi seluler menggunakan AppPresser. Mari kita rekap langkah-langkahnya dengan cepat:
- Buat aplikasi baru dan sesuaikan gayanya.
- Ubah menu aplikasi Anda.
- Tambahkan halaman khusus ke aplikasi Anda.
- Sesuaikan pengaturan aplikasi Anda.
Apakah Anda memiliki pertanyaan tentang penggunaan AppPresser untuk membuat aplikasi seluler untuk Divi? Tanyakan di bagian komentar di bawah!
Gambar mini artikel oleh 31moonlight31 / shutterstock.com
