# Introduction **WordPress Mobile Pack** is a mobile plugin that helps you transform your WordPress-based content into a *Progressive Web Application*. It comes with multiple [mobile app themes](https://wpmobilepack.com/mobile-app-themes.html) and [extensions](https://wpmobilepack.com/extensions.html) that you can purchase individually or as a [bundle](https://wpmobilepack.com/pricing.html). WordPress Mobile Pack comes in two flavors: the FREE one available on [WordPress.org repository ](https://wordpress.org/plugins/wordpress-mobile-pack/)that has \~1,000,000 downloads and the PRO version accessible at [WPMobilePack.com.](https://wpmobilepack.com/) ## The Benefits of Using WordPress Mobile Pack * **MULTIPLE MOBILE APP THEMES** Reach and engage your mobile users by choosing a customizable mobile app theme with a native app-like look & feel. Check out our collection of mobile app themes: OBLIQ, PALM, PHANTOM, EXTRUDE, POPSICLE, GHOST, INVISION, BLEND, FUTURE, LUCID, BASE, MOSAIC, ELEVATE, FOLIO, VEDI, FOTOLIA, PULSE, PURE, GOTHAM. * **CUSTOMIZE APPEARANCE** Once a favorite app theme has been selected, you can customize the colors & fonts, add your logo and graphic elements that can relate to your website's identity. * **NO TECHNICAL SKILLS REQUIRED** Simply download and install it, just like you would do with any other WordPress plugin. The dashboard is user-friendly and all the technical aspects are already taken care of behind the scenes. * **HANDS-ON SUPPORT** We take pride in offering fantastic WP Mobile Pack PRO maintenance and hands-on support. Our team of friendly WordPress experts makes sure technology doesn't stand in your way. ## Quick Start with WordPress Mobile Pack PRO | App Customization in WordPress Mobile Pack PRO | Monetize Your App with WordPress Mobile Pack PRO | | ---------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------- | | [![](https://dm6mgg4whxzuh.cloudfront.net/website-wpmp/1492598027925/img/wpmp/wpmp-customize-app-themes.png)](https://www.youtube.com/watch?v=elxjfdbAoqM) | [![](https://dm6mgg4whxzuh.cloudfront.net/website-wpmp/1492598027925/img/wpmp/wpmp-monetization.png)](https://www.youtube.com/watch?v=JSjhK8YI98M) | ## WordPress Mobile Pack PRO Features | **Rich UI/UX** | **Social Sharing** | | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | User can have an *app-like* experience on their favorite mobile device without having to go to an App Store and install anything. | Your users will be able to easily share your mobile web application through their favorite social media channels: Facebook, Twitter, Google+. | | **Translations** | **Google AMP Support** | | Automatically translate your progressive web app in one of the supported languages: Chinese (zh\_CN), Dutch, English, French, German, Hungarian, Italian, Polish, Portuguese (Brazil), Romanian, Spanish or Swedish. | Integrate with the official Google Accelerated Mobile Pages plugin. The Accelerated Mobile Pages (AMP) Project is an open source initiative that embodies the vision that publishers can create mobile optimized content once and have it load instantly everywhere. | | **Posts/Pages/Comments Sync** | **Google Analytics Integration** | | The articles/posts inside the progressive web application are organized into their corresponding categories, thus readers can simply swipe through articles and jump from category to category in a seamless way. | Get to know your mobile users and analyze your impact with our powerful yet simple reader-centric analytics. | | **DoubleClick for Publishers Integration** | **Add to Homescreen** | | Since progressive web apps don't have any shared revenue constraints, you can take full control of your income by integrating with Google DFP. | Users can add your progressive web application to their homescreens making it just a tap away. | | **Mobile SEO Support** | **Web Push Notifications** | | Optimized for search engines: parallel URL structure, use of mobile switchboard tags, schema.org, rich snippets and rich cards. | Web push notifications make it easy to re-engage with users by showing relevant, timely, and contextual notifications, even when the browser is closed. | | **Offline Mode Capability** | **Package for App Stores** | | Internet connections can be flaky or non-existent on the go. Enhance your mobile apps with service workers to work offline or on low-quality networks. | By bringing forth the latest Web technology we're able to provide you with the option (not the obligation!) of publishing your mobile applications on App Stores (iTunes, Google Play). | More details about each feature are provided throughout this documentation. ## About this documentation Our documentation provides everything you need to get started with WordPress Mobile Pack. You will find tutorials and guides, but also information about our premium version, mobile app themes, and extensions. Please use the navigation menu on the left to access the content of our documentation. If you have any questions or feedback, don't hesitate to get in touch at . ## Developer Resources For those of you interested in more in-depth technical details and the ability to extend WordPress Mobile Pack and its progressive web app themes to accommodate various use cases, you can check out # GETTING STARTED * [**WordPress Mobile Pack Compatibility**](/getting-started/wordpress-mobile-pack-compatibility) * [**Understanding Progressive Web Apps**](/getting-started/understanding-progressive-web-apps) # WordPress Mobile Pack Compatibility WordPress Mobile Pack is mostly suitable for content creators such as blogger, digital newspapers or magazines. It currently supports blog posts/articles and pages who want to repurpose their existing content into a *progressive web application*. Since it has been shown that progressive web applications greatly increase conversion rates () we've included in our roadmap to implement support for e-commerce business (get in touch if you want to know more). ## Will WordPress Mobile Pack Work With My Desktop Theme? The \_progressive web apps \_created by WordPress Mobile Pack are **independent of your WordPress desktop theme**. We use the WordPress REST API to take the content from your WordPress and we display it in a client-side rendered app, which is in fact a single-page application. By doing it like this you also have the option (not the obligation) to package it into a hybrid application and submit it to App Stores (Google Play, Apple Store). ## Will My Plugins Work With WordPress Mobile Pack? There are almost 50,000 plugins on WordPress.org repository. The objective answer is that **it depends**. Because we're using WordPress REST API to take the content from your WordPress, the question becomes: is your plugin compatible with the REST API? If the answer is YES, than it should also be compatible with WordPress Mobile Pack. Please notice that many plugins will only make sense in the desktop theme. Plugins implementing major features such as WooCommerce don't work with WordPress Mobile Pack out-of-the-box. We are already working on an extension to make WordPress Mobile Pack compatible with WooCommerce. If your WordPress site requires a plugin and it is not compatible with WordPress Mobile Pack, please reach out at . # Understanding Progressive Web Apps *Progressive Web App* (PWA) is a term used to denote web apps that uses the latest web technologies. Progressive web apps are technically regular web pages that can appear to the user like traditional applications or (native) mobile applications. This new application type attempts to combine features offered by most modern browsers with the benefits of mobile experience. In other words, progressive web apps are user experiences that have the reach of the web, and are: * **Reliable** When launched from the user’s home screen, service workers enable a Progressive Web App to load instantly, regardless of the network state. A service worker, written in JavaScript, is like a client-side proxy and puts you in control of the cache and how to respond to resource requests. By pre-caching key resources you can eliminate the dependence on the network, ensuring an instant and reliable experience for your users. * **Fast** 53% of users will abandon a site if it takes longer than 3 seconds to load! And once loaded, users expect them to be fast—no janky scrolling or slow-to-respond interfaces. * **Engaging** Progressive Web Apps are installable and live on the user's home screen, without the need for an app store. They offer an immersive full screen experience with help from a web app manifest file and can even re-engage users with web push notifications. The Web App Manifest allows you to control how your app appears and how it's launched. You can specify home screen icons, the page to load when the app is launched, screen orientation, and even whether or not to show the browser chrome. ## Why Build a Progressive Web App? Building a high-quality Progressive Web App has incredible benefits, making it easy to delight your users, grow engagement and increase conversions. | **✓ Worthy of being on the home screen** | **✓ Increased engagement** | | -------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------- | | When the Progressive Web App criteria are met, Chrome prompts users to add the Progressive Web App to their home screen. | Web push notifications helped eXtra Electronics increase engagement by 4X. And those users spend twice as much time on the site. | | **✓ Work reliably, no matter the network conditions** | **✓ Improved conversions** | | Service workers enabled Konga to send 63% less data for initial page loads, and 84% less data to complete the first transaction! | The ability to deliver an amazing user experience helped AliExpress improve conversions for new users across all browsers by 104% and on iOS by 82%. | ## How can Users Find my Progressive Web App? Progressive Web Apps are available at an URL, just like any other webpage. Through WordPress Mobile Pack you have two options: 1. **Make it available directly at "****"**\ *When mobile users land on yourdomain.com, instead of the responsive desktop theme they will see the PWA.* 2. **Have a dedicated sub-domain name, like "****"**\ *When mobile users land on yourdomain.com, they will be presented with a nonintrusive smart-app-banner inviting them to checkout the PWA available at your dedicated sub-domain name. They have the option to ignore the message and continue browsing the responsive desktop theme. However, if they choose to use the PWA, next time they're accessing yourdomain.com they'll be automatically redirected to the PWA (*[https://app.yourdomain.com\\](https://app.yourdomain.com\)_\\). ## Can I Submit my Progressive Web App to App Stores? Progressive Web Apps are single-page applications available at an URL, just like any other webpage. For all the reasons described above, the main benefit of a progressive web application is that it offers the same app-like experience within a browser. In other words, there's no longer the obligation/requirement to submit the application to App Stores for your mobile users to download/install. However, you do have the option, if that's really what you want, to package the PWA into a hybrid application using PhoneGap and submit it to Google Play and Apple Store. # WP MOBILE PACK FREE * [**Installation**](/wp-mobile-pack-free/installation) * [**App Themes**](/wp-mobile-pack-free/app-themes) * [**Look & Feel**](/wp-mobile-pack-free/look-and-feel) * [**Content**](/wp-mobile-pack-free/content) * [**⭐ Monetization**](/wp-mobile-pack-free/monetization) * [**⭐ Push Notifications**](/wp-mobile-pack-free/push-notifications) * [**Settings**](/wp-mobile-pack-free/settings) * [**Troubleshooting**](/wp-mobile-pack-free/faq) # Installation There are two ways to install WordPress Mobile Pack: (1) Install from your WordPress Admin Panel (2) Install from the WordPress Plugin Directory ## 1. Install from your WordPress Admin Panel From your WordPress Admin Panel navigate to `Plugins > Add new`, and search for "*WordPress Mobile Pack*". Click the `Install Now` button and once the plugin has been installed, click `Activate Plugin`. ![](/files/-LFSGCR-zxS1Zp6EhE8t) ## 2. Install from the WordPress Plugin Directory Once on the [WordPress Plugin directory](https://wordpress.org/plugins/wordpress-mobile-pack/) click the `Download` button to get the .zip file, then go to your `WordPress Admin Panel > Plugins > Add new` , click `Upload Plugin` and upload the .zip file. Remember to activate the plugin after installing it. ![](/files/-LFSGCR67X7sSQFcsetj) ## Accessing the Progressive Web App Once the plugin has been installed and activated, a new "*WP Mobile Pack*" menu item should appear on the left. Click on it to visit the "*WordPress Mobile Pack Admin*" page. WordPress Mobile Pack FREE comes with a default mobile app theme called "*OBLIQ*". You'll be able to access it by simply navigating to from your mobile device or simply use Chrome DevTools' Device Mode to simulate a wide range of devices and how the progressive web application behaves. ![](/files/-LFSGCRHM9xFt5JDOmZe) # App Themes Navigate to `WP Mobile Pack > App Themes` to access multiple mobile app themes that can be purchased individually or as a bundle: BASE, MOSAIC, OBLIQ, ELEVATE, FOLIO, INVISION, POPSICLE, PULSE, GHOST, PHANTOM, LUCID, EXTRUDE, VEDI, BLEND, PURE, GOTHAM, FUTURE & PALM. ![](/files/-LFSGCPtIRRKQwz_vOow) WordPress Mobile Pack comes with one FREE mobile app theme: OBLIQ. The rest of them are available with WP Mobile Pack PRO. More details about each one of othem are provided in the MOBILE APP THEMES section of this documentation. # Look & Feel Navigate to `WP Mobile Pack > Look & Feel` to customize your mobile app theme by: * Choosing color schemes & fonts * Adding your logo and app icon * Upload your cover * Setup "Add To Home Screen" ## 1. Customize Color Schemes and Fonts The color scheme will impact the following sections within the mobile app theme: 1. Headlines and primary texts 2. Article background 3. Article border 4. Secondary texts - dates and other messages 5. Category label color 6. Category text color 7. Buttons 8. Side menu background 9. Form inputs text 10. Cover text color ![](/files/-LFSGDt_TuovlxRWnzha) You have the possibility to choose from the predefined color schemes or create your own. When selecting the fonts, please notice how it impacts the overall readability of the application (Headlines, Subtitles, Paragraphs). ![](/files/-LFSGDtb-OmlsuAE9GWf)WordPress Mobile Pack FREE currently comes equiped with the following fonts: * Roboto Light Condensed, * Crimson Roman, * Open Sans Condensed Light, * Roboto Condensed Bold, * Roboto Condensed Regular, * Roboto Slab Light, * Helvetica Neue Light Condensed, * Helvetica Neue Bold Condensed, * Gotham Book. ## 2. Customize Your App's Logo and Icon You can also personalize your app by adding your own logo and icon. The logo will be displayed on the home page of your progressive web app, while the icon will be used when readers add your app to their homescreen. ![](/files/-LFSGDtdU5CNRce2V_uU)Both logo & icon should be in a `.png` format with a transparent background and should not exceed 1MB. For the icon we recommend a size of `256 x 256 px`. ## 3. Customize Your App's Cover OBLIQ theme comes with 6 abstract covers that are randomly displayed on the loading screen to give your app a magazine flavor. You can further personalize it by uploading your own cover. Your cover will be used in portrait and landscape modes, so choose something that will look good on different screen sizes. We recommend using a square image of minimum 500 x 500 px. The file size for uploaded images should not exceed 1MB. If you want to keep displaying random covers (not just one) but need to replace the default images, you can do so by uploading your own covers here: `/wp-content/plugins/wordpress-mobile-pack/frontend/images/` Make sure that you keep the same naming standard: `pattern-1.jpg, pattern-2, pattern-3, etc.` By default there are 6 covers, but if you need to extend that number, you need to operate a small change: 1. Open the following file: `/wp-content/plugins/wordpress-mobile-pack/frontend/themes/app1/template.php` 2. Find the line that writes: `defaultCover: "",` 3. Replace `rand(1, 6)` with `rand(1, your-number-of-covers)`, where "*your-number-of-covers*" should be a number matching the total number of images available in the above mentioned folder (`/wp-content/plugins/wordpress-mobile-pack/frontend/images/`) ## 4. Add to Home Screen In order for your app to prompt users with a web app install banner we first have to make sure certain conditions are met. 1. Your site needs to be on "https" - browsers will not register the service worker unless it is served through "https". 2. Make sure your icon is uploaded correctly. You can check this by opening your app in Chrome dev tools (in mobile device mode), opening the "Application" tab and looking in the "Manifest" section. You should see your icon in different sizes, you may need to refresh a few times or clear your cache. If you do not see your icon in different sizes as shown bellow, you need to re-upload it.![](/files/-LFSGDtrmj2kgXgJmwBU) 3. Once you have established that your manifest contains multiple sizes for your icon of type 'image/png', you need to copy the 'sw\.js' file contained in the WP Mobile Pack plugin directory to the root of your domain. Go to the "Look and Feel" page and scroll down to the "Add To Home Screen" section. Check the "Service Worker Installed" box and click "Save".![](/files/-LFSGDtzeAvY4ZmOhWDB) 4. Now we can check to see if the service worker is registered. Back in Chrome dev tools in the "Application" tab, click on the "Service Worker" section. You may need to clear your cache and refresh a few times after which you should see that the service worker has registered. ![](/files/-LFSGDu0Emp80VAlJDXc)Now users who visit your App at least twice with at least 5 minutes between visits, will be prompted to add to home screen. 5. If you are using the PRO version and have push notifications active you have to do one last step so that they can work together with Add to Home Screen. Go inside the OneSignal plugin directory and open the "sdk\_files" directory. Edit the following files one by one: "OneSignalSDKUpdaterWorker.js" & "OneSignalSDKWorker.js". In both of them right above the line that says: `echo "importScripts('https://cdn.onesignal.com/sdks/OneSignalSDK.js');";` insert the following line: `echo "importScripts('`[`https://your-domain.com/sw.js`](https://your-domain.com/sw.js)`');";` Remember to replace "your-domain" with the name of your actual domain. # Content Navigate to `WP Mobile Pack > Content` to manage your **Categories** & **Pages**. ## 1. Categories Choose what categories to be displayed in your progressive web application. Click on the rows to show/hide categories and order them by dragging the corresponding row on the desired position. ![](/files/-LFSGCQu12_3RkuMZkEZ) By default, the newest post's image is displayed in the progressive web application for each category. You can change this behavior by adding your own image for one or more categories. ![](/files/-LFSGCQwmrF2F6I9n80W) The image will be displayed in the progressive web application (categories menu). Editing the content from this section will not change your desktop category settings. In addition, you can disable a certain category by clicking the green button labeled `active` . Once you confirm the prompt: "*Are you sure you want to change the status for this category?*" it will be marked red and `inactive`. This means that the disabled category will not be displayed in the progressive web application. Again, this will not affect how your categories are behaving in the desktop theme. ## 2. Pages Decide what pages you want to display on your progressive web application. You can edit, show or hide different pages. The page order can be set from `Pages` available in the WordPress administrative panel. **Please note that deactivating a parent page will also hide its child pages on the mobile app theme.** By editing a certain page you'll, in fact, create a copy of the desktop version (which will remain unaltered for your desktop users). The new page (with the edited content) will be available only for your mobile users in the mobile app theme you've previously selected. Please keep in mind that the mobile copy will need to be edited separately from the desktop version (it will not automatically update when you change the desktop page).\ ![](/files/-LFSGCR5mzQwlEHuQblR) # Monetization This is a premium feature available with [WP Mobile Pack PRO](https://wpmobilepack.com/pricing.html). Navigate to `WP Mobile Pack > Monetization` to configure your Google DoubleClick for Publishers integration. 1. Login to your DoubleClick for Publishers account from ![](/files/-LFSGCS7387B89PcvOQU) 2. Navigate to `Inventory > Ad Units` units and click on `New ad unit` to create a dedicated ad for your progressive web application. ![](/files/-LFSGCS9MFIDxl-QRCF4) 3. Fill in the form by entering the Code and Name and leave the rest of the fields empty. ![](/files/-LFSGCSBRjZp0TFB-OHM) 4. Under the “*AdSense inventory settings*” click on `override` to display Google AdSense settings. Make sure you check “*Maximize revenue of unsold and remnant inventory with AdSense*” to enable Google AdSense. ![](/files/-LFSGCSIvKMo3ataiKnP) 5. Select “*Image*” as the Ad type and leave the default settings for the color palette. Click `Save` and you should see the newly created ad in the next screen. 6. Click `Generate Tags` button from the top right hand side.\ ![](/files/-LFSGCSKnv5f03RduI0_) 7. You’ll be presented with two codes after selecting the tag type and options (just go with the default settings): one for the document header and one for the body. Locate the Network Code and Ad Unit Code and copy-paste it into the WP Mobile Pack PRO admin panel. ![](/files/-LFSGCSMCtjI17DRrtuJ) 8. Once the codes have been entered in the WP Mobile Pack PRO admin panel (“*Monetize*” tab), click `Save` and you’re ready to go. Your ads should be displayed in your progressive web application right away. In case you experience delays in serving ads into your apps, that’s probably due to Google AdSense or DoubleClick for Publishers. Allow it 15 minutes and try it again.\ ![](/files/-LFSGCSOm2_LFeh_t6nE) ## Troubleshooting – Common Display Problems If you wish to preview the ads that will appear on your progressive web application, please view it from a smartphone or a tablet. The ads are being displayed throughout your content, so you just need to swipe 4-5 times to get a full screen ad or navigate inside an article to view a classic advertisement. There is a **minimum interval of 30 seconds** between loading ads, so not all the articles will include ads while you navigate through the application. Sometimes ads will not show even though you have edited the settings from the WP Mobile Pack PRO dashboard.**There is no processing involved at the progressive web application level, meaning that, in those cases, Google DFP is not loading anything.** There are various reasons for this issue: * Even if the \_Network Code \_and \_Ad Unit \_are correct, there is a delay before Google AdSense / DFP starts serving the ads. This time interval ranges from a few minutes to a few hours. * If a few hours have already passed and you still don’t see any ads in the progressive web application, is time to check your AdSense / DFP settings. Make sure you have not excluded mobile from your targeting and that you haven’t limited ads to sizes that are not added in the WP Mobile Pack PRO admin panel. You can debug by starting with minimal, basic settings, check if ads are displaying, then move on to more complex targeting. Let us know if you experience any issue with ad settings and we’ll be glad to help. # Push Notifications This is a premium feature available with [WP Mobile Pack PRO](https://wpmobilepack.com/pricing.html). In order for you to take advantage of push notifications using [WP Mobile Pack PRO](/wp-mobile-pack-free/push-notifications), you will first have to download and install the OneSignal WordPress plugin from the [WordPress Plugin Repository](https://wordpress.org/plugins/onesignal-free-web-push-notifications/). ![](/files/-LFSGCTM3E1JX2-MxN9T)To be able to use the OneSignal plugin, you first have to create an account at [OneSignal.com](https://onesignal.com/). ![](/files/-LFSGCTOYjYxOvdgzDgt) Now that you have installed the plugin and have created your OneSignal account, we can begin setting them up so that visitor will receive push notifications from your web app. 1. Follow the instructions on the OneSignal plugin `Setup` tab and configure a OneSignal app associated with your WordPress install. ![](/files/-LFSGCTRGwgBVmcHPdrl) 2. The next step will depend on whether your site is on http or https. If your site is on http, make sure you have set the subdomain correctly and skip to step 4.\ ![](/files/-LFSGCTTHeD9LeQT4MqK) 3. If your site is on https check the "*Use my own manifest.json*" in the OneSignal plugin `Configuration` tab and fill in the "*Custom manifest.json URL*" field with the URL found in the WP Mobile Pack PRO`Push Notifications` tab. ![](/files/-LFSGCTiLh65JheS6iwE) 4. Activate the "*Automatically prompt new site visitors to subscribe to push notifications*" option in the OneSignal plugin `Configuration` tab. ![](/files/-LFSGCTn13Lo7UtJZuQ1) Now you can use the OneSignal dashboard to start monitoring your users and send them push notifications. ## Sending Push Notifications To Your Mobile Users Notifications can be sent via your [OneSignal.com](https://onesignal.com/) dashboard on the `New Message` page. ![](/files/-LFSGCTqFyRVTqm6pIPg) You can send your notification to all users, a particular segment if you have segments setup or just a few users as a test. To send a link, find the `Launch URL`option and type in the link. Be sure to include the full URL including`http://`or`https://`. This will open an external link when the notification is tapped. ![](/files/-LFSGCTtRPDknv7eDVEj) Clicking the `Schedule` item lets you select among different notification delivery scheduling options: ![](/files/-LFSGCU4zI-SwFmGwR8X) When your mobile users access your Web App they will be prompted to subscribe to your notifications. Once they subscribe, every time you send out messages to them, they will receive a notification on their mobile device. ![](/files/-LFSGCU6_45ngiHrkYtZ) ![](/files/-LFSGCU81YmSSl4SkStS) ## User Segments Segments allow you to target a subset of your users with notifications. You may create any number of segments. Segments are created by adding *filters* based on certain data attributes. When creating segments with multiple filters, the users in that segment are those that pass *all* the filters. In other words, results are the intersection of all filters combined together. This allows for precise user targeting. The Segments page of your dashboard on [OneSignal.com](https://onesignal.com/) is where you can view an overview of your segments and add / edit / delete segments: ![](/files/-LFSGCUAjKET7FExiSOQ) To view the individual users within a segment, use the segments drop-down filter in `All Users`. Below is an example of viewing users within the 'Test Users' segment: ![](/files/-LFSGCUChVwnbqbke4ni) ## Troubleshooting – Common Problems 1. **Users aren't prompted for push notifications on your web app that uses** `https://` You have to make sure that all links to your site redirect to `https://`. Otherwise when a user gets to your site without the `https://`protocol, OneSignal will not send the prompt. 2. **Users aren't prompted for push notifications regardles of security protocol** Make sure that the "*Automatically prompt new site visitors to subscribe to push notifications*" option is enabled, else the plugin will not trigger a prompt when new users visit your web app. 3. **My browser theme color and other manifest options are being ignored by the browser on** `https://` This usually happens if you are using `https://`and don't have the "*Use my own manifest.json*" option configured correctly. Make sure you enable the option when using `https://` and have the correct address in the "*Custom manifest.json URL*" field. # Settings Navigate to `WP Mobile Pack > Settings` to set your progressive web app's configuration. ## 1. App Settings * You can edit the *Display Mode* of your app to enable/disable it for your mobile users. The \_**Preview** \_mode lets you edit your app without it being visible to anyone else. * By adding your Google Analytics ID, you will be able to track the progressive web application's visitors directly in your Google Analytics account. * When enabling iPads/Android tablets display, make sure to clear mobile browser cache before testing tablets settings. * The "*Visit Website*" can be enabled as well. ![](/files/-LFSGD01JwbJ92ZlHgoK) ## 2. Enable Facebook, Twitter, Google+ You can choose to display/hide Facebook, Twitter or Google+ sharing buttons inside the progressive web application by simply checking the corresponding boxes. ## 3. Language Settings Wordpress Mobile Pack will automatically translate your mobile web app in one of the supported languages: Chinese (zh\_CN), Dutch, English, French, German, Hungarian, Italian, Polish, Portuguese (Brazil), Romanian, Spanish or Swedish. This is done based on your Wordpress settings and doesn't require additional changes from the plugin. However, if you wish to add another language or change the labels for your current one, you can do so by editing the language files located in `/wp-content/plugins/wordpress-mobile-pack-pro/frontend/locales`. To ensure your translation file will not be overwritten by future updates, please [send it to our support team](mailto:contact@wpmobilepack.com). # FAQ ## 1. When I visit my website from a smartphone, I don’t see any posts or pages Please make sure that the endpoint exporting the content can be accessed and doesn’t show errors or notices. From a browser, go to the following address: `/wp-content/plugins/wordpress-mobile-pack/export/content.php?content=exportcategories&limit=5&callback=Ext.data.JsonP.callback`. You should see a text starting with “*Ext.data.JsonP.callback*”. If the page displays a “*403 forbidden*” message or has any errors / notices, it means that the content will not be available to the mobile web app. ## 2. I have enabled WordPress Mobile Pack, but I still see the desktop theme on my smartphone If you are using a cache plugin, please check the docs. Some additional settings on the cache plugin might be required to correctly enable the mobile detection from WordPress Mobile Pack. ## 3. What can I use to replace contact forms? Most of the sites we come across use contact forms to allow users to get in touch or/and send messages. However, when targeting mobile users, forcing them to fill out a dull form (usually pretty long) is the worst UX you can offer to your mobile audience. Instead, here are a couple of approaches you could try out in your mobile web application: * **Let users call you**\ You have to remember that they’re reading your content from a mobile device, so the most obvious way to get in touch with you is to actually call you directly. You can do that by editing a page and adding the following piece of code: `Call us now!` * **Sending a message over email**\ Why using a contact form when you can simply use the mailto: function: `Get in touch` * **Calling you on Skype** \ Maybe you’d like to be contacted over Skype. That’s insanely easy – just use this piece of code: `Call us using Skype!` Notice that instead of `skype:` you can use `callto:` in which case you can replace the `skype_user` even with your phone number. * **Maybe you prefer Whatsapp**\ Most of your mobile users might already have Whatsapp installed, so why not letting them get in touch with you through it: `Hello, world!` * **Or maybe you prefer good old SMS**\ Here’s a simple way of enabling mobile users to send you an SMS: `Hello, there!` # MOBILE APP THEMES # \[FREE] Obliq Under construction. # Premium Mobile App Themes Under construction. # EXTENSIONS Under construction. # TIPS & TRICKS # SSL Certification #### **What Is SSL And Why Should I Care?** ![](/files/-LFSGCTuaX0p1dQ4jZPC) In short, SSL is the “S” in HTTPS. It adds a layer of encryption to HTTP that ensures that the recipient is actually who they claim to be and that only authorized recipients can decrypt the message to see its contents. You should always protect all of your websites with HTTPS, even if they don’t handle sensitive communications. Aside from providing critical security and data integrity for both your websites and your users' personal information, HTTPS is a requirement for many new browser features, particularly those required for **progressive web apps**. HTTPS doesn't just block misuse of your website. It's also a requirement for many cutting-edge features and an enabling technology for **app-like capabilities** such as service workers. Having your site on and redirecting to HTTPS will significantly boost you Web Apps **Google Lighthouse** **PWA score** and make using **push notifications** with WordPress Mobile Pack a breeze. ## Setting up HTTPS on your private hosting server The fastest, simplest and **FREE** way of setting up an SSL certificate on your personal server is by following the tutorial at [letsencrypt.org.](https://letsencrypt.org/) ![](/files/-LFSGCU9nfEsZWX3f94G) ## Setting up HTTPS with CloudFlare ### I. **Configuring CloudFlare** 1. If you don't have a CloudFlare sign up for one at [cloudflare.com/a/sign-up](https://www.cloudflare.com/a/sign-up) and follow the instructions to add the WordPress site of your Web App. 2. In order to set up HTTPS on CloudFlare you must go to your CloudFlare dashboard corresponding to your WordPress site. In the `crypto` tab, activate "*flexible SSL*". ![](/files/-LFSGCUHa-qkHjt9x0zA) Choosing the “*flexible SSL*” setting is important because it doesn’t require you to buy and install your own SSL certificate on your WordPress site's server. As you can see in the diagram below, CloudFlare is acting as the middleman to secure traffic between your website and the client. ![](/files/-LFSGCUK7m8xHJPUPMGW) ### **II. Configuring WordPress** In order for your WordPress site to function properly with https we need to change a few things. 1. First you should change your URLs by going into the WordPress dashboard and clicking the `Settings > General` tab where you must add `https://` to your "*WordPress Address*" and "*Site Address*".\ ![](/files/-LFSGCURzTxoI6OC4go_) **Before** making any changes make sure your website is properly configured for HTTPS and the changes have taken effect on CloudFlare. Otherwise if you change these settings you could cause a redirect loop that will prevent you from accessing the dashboard. 2. The next step we have to take is **update the legacy content** on your WordPress site. WordPress stores links to pages and images as absoute URLs, meaning that the full URL, including the protocol, is saved in the database. To ensure that the entire website is consistently served via HTTPS (without spitting up warnings about mixed content), you will need to update them. If your host provides **phpMyAdmin** or some other interface to run **MySQL** queries, you could do this pretty easily with a few queries in the SQL tab. Replace `yourdomain.com` in the following queries with your actual domain and if you've customized WordPress' table prefix, replace `wp_` with the relevant prefix. Run the following set of queries: `UPDATE wp_postmeta SET meta_value = REPLACE(meta_value,'http://yourdomain.com', 'https://yourdomain.com')` `UPDATE wp_posts SET post_content = REPLACE(post_content, 'http://yourdomain.com', 'https://yourdomain.com')` 3. After running these queries, you will want to refresh your permalinks by going to `Settings > Permalinks`. Simply change the setting back to the default, and then set it back to whatever setting you were originally using.\ ![](/files/-LFSGCUnt2CMQLwo_HTC) If you don't have access to an interface you can follow the instructions at [thecustomizewindows.com](https://thecustomizewindows.com/2014/09/mysql-queries-change-wordpress-http-https/) to run the queries from the command line. **Warning!** If following the instructions at [thecustomizewindows.com](https://thecustomizewindows.com/2014/09/mysql-queries-change-wordpress-http-https/) do not execute the querie to change the **POST GUID**, see [codex.wordpress.com](https://codex.wordpress.org/Changing_The_Site_URL#Important_GUID_Note) for explanations as to why. In case you get **mixed-content warnings** cause by your other plugins and themes, make sure they properly [enqueue JavaScript](https://codex.wordpress.org/Function_Reference/wp_enqueue_script) and [CSS files](https://codex.wordpress.org/Function_Reference/wp_enqueue_style) and don't hardcode URLs that begin with `HTTP`. Most browsers will let you expand the warning to show the specific requests that are causing the error. You could also try one of the free plugins that can attempt to correct third-party plugins that have failed to do this, like [SSL Insecure Content Fixer](https://wordpress.org/plugins/ssl-insecure-content-fixer/). At this point you should see a green padlock in your browser when accessing your Web App. ## Redirecting HTTP Requests To HTTPS Just because you've setup HTTPS for your Web App doesn't mean all requests will actually use the protocol. If your website has been around for a while, users might have already bookmarked it with HTTP. By adding the following snippet to the top of the `.htaccess` file in the root of your website, you can redirect all HTTP requests to the new protocol. ``` RewriteEngine On RewriteCond %{HTTP:X-Forwarded-Proto} !https RewriteRule (.*) https://yourdomain.com/$1 [R=301,L] ``` If the file does not exist, you can safely add it. If an`.htaccess`file already exists, be careful not to change anything between the `# BEGIN WordPress` and `# END WordPress` lines in that file. # Content API * [**Categories**](/content-api/categories) * [**Posts**](/content-api/posts) * [**Pages**](/content-api/pages) * [**Comments**](/content-api/comments) * [**Manifest, Settings & Language**](/content-api/manifest-settings-and-language) # Categories The WP Mobile Pack content API implements a series of endpoints that are responsible for exporting categories. These are as follows: | **Endpoint** | **Description** | | ---------------- | --------------------------------------------------------------------- | | exportcategories | A list of all the categories with the latests posts for each of them. | | exportcategory | A category's details. | ## **Please note all endpoints support JSONP.** All URL’s are relative to the WP Mobile Pack installation folder, typically located at /wp-content/plugins/wordpress-mobile-pack. ## **1) Exporting categories** **Relative FREE URL:**/wp-content/plugins/wordpress-mobile-pack/export/content.php?content=exportcategories\&callback=CallbackMethod **Relative PRO URL:** /wp-content/plugins/wordpress-mobile-pack-pro/frontend/export/content.php?content=exportcategories\&callback=CallbackMethod Sample code: on [Gist](https://gist.github.com/appticles/d8c82615cc5d90af7f53#file-wpmp-content-api-exportcategories) **Parameters:** | **GET Params** | **Type** | **Required** | **Description** | | ----------------- | -------- | ------------ | ------------------------------------------------------------------------------------------------------------- | | content | String | Yes | Equal to "exportcategories". | | callback | String | Yes | The callback method. | | limit | Integer | No | The number of articles that are exported for each category. Default value 7. | | withArticles | Integer | No | Pass a value different than 1 to export the categories without articles. | | page | Integer | No | Used for paginating categories. Default value 1. | | rows | Integer | No | Used for paginating categories, indicates the number of categories per page. Default value 5. | | descriptionLength | Integer | No | (Deprecated) The length (number of characters) of an article's description. Default value 200. | **Response type:** JSONP **Response format (for a category):** | **Field** | **Type** | **Required** | **Description** | | ---------- | -------------------------------------- | ------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | id | Alphanumeric string or integer | Yes | The ID of the category. It is set to "0" (zero) for the "Latest" category which combines the newest articles from all categories. The "Latest" category is optional. | | order | Integer | Yes | The order in the categories menu. | | name | String | Yes | The category title. | | name\_slug | String | Yes | The category slug (used for url rewriting). | | parent\_id | Alphanumeric string | No | The parent's category ID. It is set to 0 (zero) for root categories. | | link | String, URL | No | The category's original link (used for setting a rel=canonical tag and prevent SEO duplicate content issues). Default value is " "(empty string) that indicates not to use a rel=canonical tag. | | image | Object or empty string | No | The icon, displayed in the categories menu. Click [ here](/content-api/posts) to see the specs for the image field. In case a category doesn't have an icon, this field is set to " " (empty string). | | articles | List | Yes | A list with the articles from the category. Click [here](/content-api/posts) to see the specs for an article. | ## **2) Exporting a category's details** **Relative FREE URL:**/wp-content/plugins/wordpress-mobile-pack/export/content.php?content=exportcategory\&categoryId=0\&callback=CallbackMethod **Relative PRO URL:** /wp-content/plugins/wordpress-mobile-pack-pro/frontend/export/content.php?content=exportcategory\&categoryId=0\&callback=CallbackMethod **Parameters:** | **GET Params** | **Type** | **Required** | **Description** | | -------------- | --------------------------------------- | ------------ | -------------------------- | | content | String | Yes | Equal to "exportcategory". | | callback | String | Yes | The callback method. | | categoryId | Alphanumeric string or integer | Yes | The ID of the category. | **Response type:** JSONP **Response format:** | **Field** | **Type** | **Required** | **Description** | | --------- | -------- | ------------ | ------------------------------------------------------------------ | | category | Object | Yes | The category's details. See below the category's format. | **Category format** | **Field** | **Type** | **Required** | **Description** | | ---------- | -------------------------------------- | ------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | id | Alphanumeric string or integer | Yes | The ID of the category. It is set to "0" (zero) for the "Latest" category. | | name | String | Yes | The category title. | | name\_slug | String | Yes | The category slug (used for url rewriting). | | parent\_id | Alphanumeric string | No | The parent category's ID. It is set to 0 (zero) for root categories. | | link | String, URL | No | The category's original link (used for setting a rel=canonical tag and prevent SEO duplicate content issues). Default value is " " (empty string) that indicates not to use a rel=canconical tag. | | image | Object or empty string | No | The icon, displayed in the categories menu. Click [here](/content-api/posts) to see the specs for the image field. In case a category doesnt' have an icon, this field is set to " " (empty string) or \[] (empty array). | # Posts The WP Mobile Pack content API implements a series of endpoints that are responsible for exporting posts. These are as follows: | **Endpoint** | **Description** | | -------------- | ------------------------------ | | exportarticles | List of posts from a category. | | exportarticle | A post's details. | ## **Please note all endpoints support JSONP.** All URL’s are relative to the WP Mobile Pack installation folder, typically located at /wp-content/plugins/wordpress-mobile-pack. ## 1) Exporting posts from a category **Relative FREE URL:**/wp-content/plugins/wordpress-mobile-pack/export/content.php?content=exportarticles\&categoryId=0\&callback=CallbackMethod **Relative PRO URL:** /wp-content/plugins/wordpress-mobile-pack-pro/frontend/export/content.php?content=exportarticles\&categoryId=0\&callback=CallbackMethod **Sample code:** on [Gist](https://gist.github.com/appticles/d8c82615cc5d90af7f53#file-wpmp-content-api-exportarticles) **Parameters:** | **GET Params** | **Type** | **Required** | **Description** | | ----------------- | -------------------------------------- | ------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | content | String | Yes | Equal to "exportarticles". | | callback | String | Yes | The callback method. | | categoryId | Alphanumeric string or integer | Yes | The ID of the category. | | lastTimestamp | Integer | No | Used for implementing the “load more” functionality for a list of articles. If this parameter is passed, the endpoint will return articles that were published before this date. Usually, the timestamp of the last displayed article is used as a parameter for reading older articles. | | limit | Integer | No | The number of articles that are exported for the category. Default value 7. | | descriptionLength | Integer | No | (Deprecated) The length (number of characters) of an article's description. Default value 200. | **Response type**: JSONP **Response format:** | **Field** | **Type** | **Required** | **Description** | | --------- | -------- | ------------ | --------------------------------------------------------------------------------------------------- | | articles | List | Yes | A list with the articles from the category. Click here to see the specs for an article. | ## 2) Exporting a post’s full content **Relative FREE URL:**/wp-content/plugins/wordpress-mobile-pack/export/content.php?content=exportarticle\&articleId=1\&callback=CallbackMethod **Relative PRO URL:**/wp-content/plugins/wordpress-mobile-pack-pro/frontend/export/content.php?content=exportarticle\&articleId=1\&callback=CallbackMethod **Sample code:** on[Gist](https://gist.github.com/appticles/d8c82615cc5d90af7f53#file-wpmp-content-api-exportarticle) **Parameters:** | **GET Params** | **Type** | **Required** | **Description** | | ----------------- | -------------------------------------- | ------------ | ------------------------------------------------------------------------------------------------------ | | content | String | Yes | Equal to "exportarticle". | | callback | String | Yes | The callback method. | | articleId | Alphanumeric string or integer | Yes | The ID of the article. | | descriptionLength | Integer | No | (Deprecated) The length (number of characters) of the article’s description. Default value 200. | **Response type:**JSONP **Response format:** | **Field** | **Type** | **Required** | **Description** | | --------- | -------- | ------------ | ------------------------------------------------------------------------------------------------- | | article | Object | Yes | The article's full details. Click [here](/content-api/posts) to see the specs for an article. | ## Post format **Sample code**: on [Gist](https://gist.github.com/appticles/d8c82615cc5d90af7f53#file-wpmp-content-api-exportarticle) The **exportcategories** and **exportarticles** endpoints export a list of posts objects. In a similar way, the **exportarticle** endpoint exports the details for a post. Each post object contains the following fields: | **Field** | **Type** | **Required** | **Description** | | -------------------- | -------------------------------------- | ------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | id | Alphanumeric string or integer | Yes | The id of the post | | title | String | Yes | The title of the post | | author | String | Yes | The author's name. | | author\_description | String | No | The author's description, it is exported only by the **exportarticle** endpoint. | | author\_avatar | String | No | The author's avatar, it is exported only by the **exportarticle** endpoint. | | link | String, URL | Yes | The article’s original link (from the desktop website). This field is also used to set the rel=”canonical” tag on the post’s details page. | | image | Object or empty string | No | The artucle's featured image. In case an article doesn't have an image, this field is set to " " (empty string). | | date | String, datetime | Yes | The date the post was published, in the site's time zone. | | timestamp | Integer | Yes | UNIX timestamp with the post's published date; it is used to order the posts from newest to oldest. | | description | HTML/Text | Yes | The first part from the article, in HTML format. | | content | HTML/Text | Yes | The content for the post. It is set to an empty string for the exportcategories and exportarticles endpoints. | | categories | List | Yes | A list with all the post's categories ( a post can belong to multiple categories). | | category\_id | Alphanumeric string or integer | No | (Deprecated) The current visible category ID for the post. This property is deprecated and should not be used by new apps. | | category\_name | String | No | (Deprecated) The current visible category name for the post. This property is deprecated and should not be used by new apps. | | comment\_status | String | No | If comments are opened or closed for the post. Allowed values are ‘open’, ‘closed’ or ‘disabled’. New comments are allowed only for posts with comment\_status = ‘open’. Default value is ‘disabled’. | | no\_comments | Integer | No | The number of comments added for the post. Default value is "0" (zero). | | show\_avatars | Integer | No | If the comments list should display users' avatars. Can be set to "0" (zero) or "1". Default value is "0" (zero). | | require\_name\_email | Integer | No | If name and email are required when submitting a new comment. Can be set to "0" (zero) or "1". Default value is "0" (zero). | # Pages The WP Mobile Pack content API implements a series of endpoints that are responsible for exporting pages. These are as follows: | **Endpoint** | **Description** | | ------------ | ------------------------ | | exportpages | A list of all the pages. | | exportpage | A page's details. | ## Please note all endpoints support JSONP. All URL’s are relative to the WP Mobile Pack installation folder, typically located at /wp-content/plugins/wordpress-mobile-pack. ## 1) Exporting pages **Relative FREE URL:**/wp-content/plugins/wordpress-mobile-pack/export/content.php?content=exportpages\&callback=CallbackMethod **Relative PRO URL:**/wp-content/plugins/wordpress-mobile-pack-pro/frontend/export/content.php?content=exportpages\&callback=CallbackMethod **Sample code:** on [Gist](https://gist.github.com/appticles/d8c82615cc5d90af7f53#file-wpmp-content-api-exportpages) **Parameters:** | **GET Params** | **Type** | **Required** | **Description** | | -------------- | -------- | ------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | content | String | Yes | Equal to "exportpages". | | callback | String | Yes | The callback method. | | page | Integer | No | Used for pagination, indicates the current page of the collection. If missing and rows is set, defaults to 1, otherwise the results are not paginated. | | rows | Integer | No | Used for pagination, indicates the maximum number of items to be returned per page. If missing and page is set, defaults to 5, otherwise the results are not paginated. | | limit | Integer | No | Deprecated, alias for 'rows'. | **Response type:** JSONP **Response format (for a page):** | **Field** | **Type** | **Required** | **Description** | | ------------ | -------------------------------------- | ------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | id | Alphanumeric string or integer | Yes | The id of the page. | | parent\_id | Alphanumeric string or integer | Yes | The parent page id. It is set to "0" (zero) for root pages. | | order | Integer | Yes | The order in the pages menu. | | title | String | Yes | The page's title. | | link | Stringm, URL | No | The page’s link (from the desktop website). This field is also used to set the rel=”canonical” tag on the object’s details page. Default value is “ ” (empty string) that indicates not to use a rel=canonical tag. | | image | Object or empty string | No | The page's featured image. Click [here](/content-api/posts) to see the specs for the image field. In case a page doesn't have an image, this field is set to " " (empty string). | | has\_content | Integer | Yes | If the page has content (some pages are usd just as parent pages to structure the menu). Can be set to "0" (zero) or "1". | | content | String | No | Is equal to " "(empty string). | ## 2) Exporting a page’s full content **Relative FREE URL:**/wp-content/plugins/wordpress-mobile-pack/export/content.php?content=exportpage\&pageId=1\&callback=CallbackMethod **Relative PRO URL:**/wp-content/plugins/wordpress-mobile-pack-pro/frontend/export/content.php?content=exportpage\&pageId=1\&callback=CallbackMethod **Sample code:** on [Gist](https://gist.github.com/appticles/d8c82615cc5d90af7f53#file-wpmp-content-api-exportpage) **Parameters:** | **GET Params** | **Type** | **Required** | **Description** | | -------------- | -------------------------------------- | ------------ | ---------------------- | | content | String | Yes | Equal to "exportpage". | | callback | String | Yes | The callback method. | | pageId | Alphanumeric string or integer | Yes | The ID of the page. | **Response type:** JSONP **Response format:** | **Field** | **Type** | **Required** | **Description** | | ------------ | -------------------------------------- | ------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | id | Alphanumeric string or integer | Yes | The ID of the page. | | parent\_id | Alphanumeric string or integer | Yes | The parent page ID. It is set to "0" (zero) for root pages. | | title | String | Yes | The page's title. | | link | String, URL | No | The page’s link (from the desktop website). This field is also used to set the rel=”canonical” tag on the object’s details page. Default value is “ ” (empty string) that indicates not to use a rel=canonical tag. | | image | Object or empty string. | No | The page's featured image. Click[ here](/content-api/posts) to see the specs for the image field. In case a page doesn't have an image, this field is set to " " (empty string). | | has\_content | Integer | Yes | If the page has content (some pages are used just as parent pages to structure the menu). Can be set to "0" (zero) or "1". | | content | HTML/Text | Yes | The page's content in HTML format. | # Comments The WP Mobile Pack content API implements a series of endpoints that are responsible for exporting comments. These are as follows: | Endpoint | Description | | -------------- | ------------------------------ | | exportcomments | A list of comments for a post. | | save\_comment | Submit a comment for a post. | ## **Please note all endpoints support JSONP.** All URL’s are relative to the WP Mobile Pack installation folder, typically located at /wp-content/plugins/wordpress-mobile-pack. ## 1) Exporting comments **Relative FREE URL:**/wp-content/plugins/wordpress-mobile-pack/export/content.php?content=exportcomments\&articleId=1\&callback=CallbackMethod **Relative PRO URL:**/wp-content/plugins/wordpress-mobile-pack-pro/frontend/export/content.php?content=exportcomments\&articleId=1\&callback=CallbackMethod **Sample code:** on [Gist](https://gist.github.com/appticles/d8c82615cc5d90af7f53#file-wpmp-content-api-exportcomments) **Parameters:** | **GET Params** | **Type** | **Required** | **Description** | | -------------- | -------------------------------------- | ------------ | -------------------------- | | content | String | Yes | Equal to "exportcomments". | | callback | String | Yes | The callback method. | | articleId | Alphanumeric string or integer | Yes | The post's ID. | **Response type:**JSONP **Response format (for a comment):** | **Field** | **Type** | **Required** | **Description** | | ----------- | -------------------------------------- | ------------ | -------------------------------------------------------------- | | id | Alphanumeric string or integer | Yes | The ID of the comment. | | author | String | Yes | The author's name. | | author\_url | String, URL | Yes | The comment author's URL (usually their web site), not linked. | | avatar | String, URL | Yes | Avatar URLs for the author. | | date | String, datetime | Yes | The comment's date. | | content | HTML/Text | Yes | The comment's content. | | article\_id | Alphanumeric string or integer | Yes | The post's id. | ## 2) Saving comments **Relative FREE URL:**/wp-content/plugins/wordpress-mobile-pack/export/content.php?content=savecomment\&articleId=1\&author=Author\&email=&\ comment=comment%text\&code=accessToken\&callback=CallbackMethod **Relative PRO URL:**/wp-content/plugins/wordpress-mobile-pack-pro/frontend/export/content.php?content=savecomment\&articleId=1\&author=Author\&email=&\ comment=comment%text\&code=accessToken\&callback=CallbackMethod **Parameters:** | **GET Params** | **Type** | **Required** | **Description** | | -------------- | -------------------------------------- | ------------ | ---------------------------------------------------------------------------------------------------------------- | | content | String | Yes | Equal to "savecomment". | | callback | String | Yes | The callback. | | articleId | Alphanumeric string or integer | Yes | The post's id. | | author | String | Yes/No | The comment author's name. Is required if require\_name\_email from the post is set to 1. | | email | String | Yes/No | The comment author's e-mail address. Is required if require\_name\_email from the post is set to 1. | | comment | String | Yes | The comment's text. | | code | String | Yes | Access token. | **Response type:** JSONP **Response format:** | **Field** | **Type** | **Required** | **Description** | | --------- | -------- | ------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | status | Integer | Yes | The status of the comment. Possible values are: **-** **0** -- error, comment was not added. **- 1** -- comment was successfully added and approved. **- 2** -- comment was successfully added and is awaiting moderation. | | message | String | Yes | Success / error message. Possible values are: **-** "Invalid post id" (status = 0). **-** "Comments are closed" (status = 0). **-** "Missing name or email" (status = 0). **-** "Invalid email address" (status = 0). **-** "Missing comment" (status = 0). **-** "Duplicate comment" (status = 0). **-** "Your comment was successfully added" (status = 1). **-** "Your comment is awaiting moderation" (status = 2). | # Manifest, Settings & Language The WP Mobile Pack content API implements a series of endpoints that are responsible for exporting comments. These are as follows: | Endpoint | Description | | -------------- | ------------------------------------------------------ | | exportmanifest | Export the manifest. | | exportsettings | Export the application's settings. | | exportlanguage | Export the application's texts in different languages. | ## **Please note all endpoints support JSONP.** All URL’s are relative to the WP Mobile Pack installation folder, typically located at /wp-content/plugins/wordpress-mobile-pack. ## 1) Exporting the manifest **Relative FREE URL:**/wp-content/plugins/wordpress-mobile-pack/export/content.php?content=androidmanifest **Relative PRO URL:**/wp-content/plugins/wordpress-mobile-pack-pro/frontend/export/content.php?content=androidmanifest **Parameters:** | **GET Params** | **Type** | **Required** | **Description** | | -------------- | -------- | ------------ | --------------------------- | | content | String | Yes | Equal to "androidmanifest". | **Response type:** JSONP **Response format** | **Field** | **Type** | **Required** | **Description** | | ----------------- | --------------------------------------- | ------------ | --------------------------------------------- | | name | Alphanumeric string or integer | Yes | The name of the web app. | | start\_url | URL | Yes | The homepage of the web app. | | display | String | Yes | Hide or show the browser UI | | orientation | String | Yes | The web app's orientation. | | theme\_color | String | Yes | The browser UI color. | | background\_color | String | Yes | Splash screen color on web app launch. | | icons | Array of string and URL | Yes | Home screen icons urls and sizes. | ## 2) Exporting settings **Relative FREE URL:**/wp-content/plugins/wordpress-mobile-pack/export/content.php?content=exportsettings **Relative PRO URL:**/wp-content/plugins/wordpress-mobile-pack-pro/frontend/export/content.php?content=exportsettings **Parameters:** | **GET Params** | **Type** | **Required** | **Description** | | -------------- | -------- | ------------ | -------------------------- | | content | String | Yes | Equal to "exportsettings". | **Response type:** JSONP **Response format:** | **Field** | **Type** | **Required** | **Description** | | --------------- | ----------------------- | ------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | export | Array of arrays and URL | Yes | URLs that lead to endpoints for: exporting one or more categories, exporting one or more posts, exporting one or more pages, exporting or inserting comments. | | Translate | Array of arrays and URL | Yes | Specifies the language and the path to the export language endpoint. | | socialMedia | Array of bool | Yes | Social media options. | | commentsToken | String | Yes | The generated comments token. | | articlesPerCard | String | Yes | For themes that use a carousel, specifies how many themes to show per card. | | homeText | String | Yes | The web app home text. | | logo | URL | Yes | Path to logo file. | | icon | URL | Yes | Path to the web app icon. | | defaultCover | URL | Yes | Path to the web app cover. | ## 3) Exporting the app texts for a locale **Relative FREE URL:**/wp-content/plugins/wordpress-mobile-pack/export/content.php?content=apptexts\&locale=en\_US\&format=json **Relative PRO URL:**/wp-content/plugins/wordpress-mobile-pack-pro/frontend/export/content.php?content=apptexts\&locale=en\_US\&format=json **Parameters:** | **GET Params** | **Type** | **Required** | **Description** | | -------------- | -------- | ------------ | -------------------------------------------------------------------- | | content | String | Yes | Equal to "apptexts" | | locale | String | No | The language prefix. Default english. | | format | String | No | The response format, can be set to json, defaults to javascript. | **Response type:** JSONP or javascript **Response format:** | **Field** | **Type** | **Required** | Description | | ------------- | ---------------- | ------------ | ---------------------------------------------------- | | links | Array of strings | Yes | Translations for link texts. | | texts | Array of strings | Yes | Translations for general texts. | | pull\_refresh | Array of strings | Yes | Translations for web app navigation instructions. | | forms | Array of strings | Yes | Translations for texts used in forms |