Using LAN Sharing for Mobile Device Testing

Mobile Friendly is No Longer Optional

Now that Google is essentially requiring all sites to be mobile friendly it is more important than ever for web developers and designers to ensure web development projects respond appropriately across a wide range of mobile devices. If you’ve ever transitioned a website with legacy code into a modern web experience (think responsive design elements and web development standards) you already know how time consuming it can be to test all the different responsive breakpoints using just your browser, or calling friends with various devices to send you screenshots of projects that are still in active development. It’s a clunky process that can be extremely frustrating. However, using LAN sharing for mobile device testing via DesktopServer, developers and designers can quickly test their projects in secure, local environments. This post will focus on how to do this with DesktopServer and your development WordPress websites.

The Complicated Issue

You can already access your DesktopServer websites (on your computer) via the fictitious “.dev” domain names you create for each of your website projects (i.e. http://www.example.dev). However, how do you access the site from a mobile device on your LAN (local area network)? The .dev domain names won’t work as they are not real and no one knows about them except the computer running DesktopServer.  But what about your mobile device that is not running DesktopServer? It turns out that every device on your LAN (or WiFi network) uses an IP address, an enumerated number that can be used to access the device. You can use this number to access DesktopServer from your mobile device (if you knew the numerical address). Unfortunately this address may vary depending on the number of network devices you have, your router manufacturer or ISP provided hardware. It gets even more complicated as unlike traditional HTML based websites that may use relative URLs, WordPress uses fully qualified URLs to reference the various components that make up a given site. While fully qualified URLs have security benefits, it inhibits the ability to easily change them (which we will need to do to access your website from a mobile device using the numerical address i.e. http://192.168.0.88).

The DesktopServer Solution

DesktopServer provides an easy way to resolve this issue by finding out the IP address of your computer for you. DesktopServer also adjusts WordPress’ fully qualified URL requirements so that you can properly access your site from your mobile device. DesktopServer will handle address translation in realtime to allow for office workgroups. For instance, you can have a co-worker access your development website’s WordPress admin pages from another computer to upload and update media, posts, and pages to accelerate your website development needs. DesktopServer will automatically handle remapping of the IP address back to the project domain name in the database to make sure everything stays tidy. An important provision is that just one development website can be accessed or “shared” via the IP address at a time (which also excludes sub-domains in WordPress Multisite mode). Because DesktopServer only takes a few seconds to switch between sites to share, you can test all your projects conveniently and in a timely manner. Follow the stapes below to get started using DesktopServer’s sharing feature and to see what your development website looks like on your mobile device (such as an iPhone, iPad or Android device).

First, from DesktopServer’s main menu of options, select the last item titled “Import, export or share a website”, followed by the option “Share a development website”.

You will then be presented with a list of your development websites.

  1. Highlight the development website that you want to share and access from another computer or mobile device.
  2. Click the option ‘Local Area Network’, followed by clicking next. DesktopServer will then initialize sharing.