Over the past few weeks, we’ve been writing about the process of working offline by setting up a local development environment from within your device. During this blog series, we’ve recommended one of our favorite development tools, DesktopServer by ServerPress.
With DesktopServer, you can set up a local environment in a matter of minutes. Also, processes such as importing or migrating sites between the live and local environments is a breeze.
The following blog post discusses the process of importing a live website to a local DesktopServer development environment. For this, we’ll be detailing a step-by-step import tutorial using cPanel, and will also offer a few alternate import methods using various popular WordPress plugins.
If you need a little refresher on the previous blog posts, we recommend reading the two previous articles in this series:
Importing a Live Website to a Desktop Server Local Environment Using cPanel
While making changes and updates to a website, a web developer will more often than not opt to work offline as opposed to editing website files while a site is still live.
Working live might be a good idea for quick edits and small changes, however, there are far greater benefits in working offline in a local environment to make structural updates and site expansions that may take a while to complete.
- There’s little to no website downtime. Working offline allows you to keep the current version of a website in a live state while you work on updating the site files ‘in secret’. Only once the final site changes are complete will the updated files be moved from local to live, resulting in a website with far shorter time in edit or maintenance mode.
- Working offline requires no internet connection. Not only does this mean that your site changes will be done at rapid speed, but it also means that you can work in places that are devoid of connectivity (such as Wifi-less coffee shops, while in transit or even in nature). Also, working offline is a great option for those that live in areas with intermittent internet connections or generally poor signal strength.
If you’d like to make changes to an existing live website while working offline, you’ll need to import the live website to a local environment.
There are a number of methods for importing a website to DesktopServer. The most frequently used method involves accessing a number of files from your server’s cPanel.
There are four steps to importing a live website to a DesktopServer local environment:
- Export your website files via the cPanel File Manager console
- Export your website database via the cPanel phpMyAdmin console
- Combine both the site files and database and compress all files and folders
- Import your website into DesktopServer
Note: Before continuing with the tutorial, please note that importing sites from live to local development environments is a feature available exclusively through DesktopServer Premium.
While there are alternate local environment service providers, we highly recommend considering purchasing a DesktopServer license for a number of reasons, mainly the sheer amount of time saved due to increased speed of operation and value gained in convenience.
STEP 1: EXPORT YOUR WEBSITE’S FILES
First things first, log into your server’s cPanel interface and locate the ‘File Manager’ icon in the ‘Files’ drop down menu.
Next, click on the ‘File Manager’ icon. A pop-up window will appear, be sure to select the ‘Show hidden files’ option. Click ‘Submit’.
Your cPanel’s File Manager will open and load in a new tab. Split into two columns, the left-hand column lists each of the folders on your server while the right-hand column shows the contents of each of these folders when selected individually.
To access your WordPress website, navigate to the folder titled ‘public_html’. Note, depending on different configurations, the display and presentation of the cPanel interface can differ slightly between hosting companies. Typically, web files will either be located in the ‘public_html’ folder or an alternate folder titled ‘www’.
After clicking on the ‘public_html’ folder you’ll see an extensive list of your WordPress site files in the right-hand side column. Select all of the files that comprise your WordPress website. Be sure to include all files and folder prefixed with ‘wp’ as well as the “index.php”, “xmlrpc.php” and the “.htaccess” files.
Note: Over time, you may add a series of subdomains or similar to your main WordPress site. These might be additional testing environments, client preview sites or demo sites for your web development business. Even though subdomain folders are clearly marked, always be aware of the files that you’re selecting when importing websites in this manner.
Once all of the relevant site files relating to your WordPress website have been selected, click ‘Compress’.
Next, a pop-up window will ask you for a few details before creating your .zip archive. You’ll be asked to specify a compression type and a file name. Here, select the zip archive compression type (usually listed as the first available option), and specify a unique file name relating to either your or your client’s brand or business.
In our example, we’ve used the test website ‘Temp’ and have named our compression file as DESKTOPSERVER_TUTORIAL. Next, click ‘Compress Files(s)’.
Once the compression is complete, select the .zip file and click on the ‘Download’ icon in the main toolbar. If you don’t see the .zip folder straight away, click the Reload icon in the mini toolbar directly above the right-hand side column.
Once you download finishes, unzip the .zip file and leave the folder with its contents for a moment. We’ll return to the folder after we’ve exported our site database.
Before moving on, return to your cPanel and delete the .zip archive from your server. If left on your server, the .zip archive could possibly create a security threat at a later stage.
STEP 2: EXPORT YOUR WEBSITE’S DATABASE
Now that that’s done, return to the main cPanel interface. Locate and click on the phpMyAdmin icon in the ‘Database Tools’ or ‘Databases’ drop down menu.
Once phpMyAdmin has opened, you’ll see a list of databases associated with your web server on the left-hand side.
If you don’t know the name of your WordPress website’s database, return to the cPanel interface, locate and click on the File Manager icon and return to the ‘public_html’ folder.
If there is only one website, locate the wp-config.php file and click View. If there are a number of sub domains, enter the correct subdomain folder, locate the wp-config.php file and click View.
Once opened, search for the phrase DB_NAME and find the database name. It should look something like this:
/** The name of the database for WordPress */ define('DB_NAME', ‘coryjenk_wrd14’);
In phpMyAdmin, select the database that correlates to the wp-config file of the website you’re importing and click Export in the main menu.
Next, you’ll be met with a few configuration options for exporting your WordPress website’s database. Select ‘Quick’ as your Export Method and set the database Format to SQL. Then click Go.
Once the database finishes downloading, rename it to ‘database.sql’.
STEP THREE: COMBINE YOUR WEBSITE’S FILES AND DATABASE, THEN COMPRESS
Move the ‘database.sql’ file into the folder previously downloaded from the cPanel File Manager in Step One.
Now, all of your WordPress website’s files and SQL database will be in one place. Make sure that the file database.sql is located in the same folder (at the same level) as the wp-config.php file.
Next, zip the entire file. If you are using a Mac, simply right click on the folder and click compress. If you are using a PC then XYZ.
Once compressed, you’ll have a zip file of your entire WordPress website’s contents.
If your site has a large number of images or videos, it might be a good idea to leave these files (as well as the ‘wp-content’ folder) out of the compression process in order to save space. If you do choose to leave these files out of the compression, they can simply be moved back into the website folder once the import to DesktopServer process has been completed.
STEP FOUR: IMPORT YOUR WEBSITE INTO DESKTOPSERVER
Finally, we’ve reached the last stage of the import process.
Note: If you are using the free version of DesktopServer, you will not have the option to import a website. These and other features are available exclusively to DesktopServer Premium users. Read why we recommend purchasing Desktop Server.
Open the DesktopServer application, select the ‘Export or Import a Website’ option and click Next.
Next, select the ‘Import an existing WordPress website archive’ option and click Next.
You’ll be prompted for a number of actions:
- Import File: Browse through your device and locate the compressed file which comprises both your website’s site files and SQL database.
- Site Name: Give your local site a unique name relating to either your or your client’s brand or business. DesktopServer will automatically append the top-level ‘.dev’ domain name.
- Site Root: Finally, select the folder wherein which DesktopServer will store your website’s files. Should you wish to make use of a folder other than the one suggested by default, click the Browse button and navigate through your device folders to select the most applicable destination.
Note: Due to the fact that DesktopServer is operating as an administrator root user, it is advised to locate files using the drop-down menu at the top of the ‘Choose a Folder’ pop up window as opposed to navigating through the various folders (i.e. Desktop, Documents, or Downloads, etc.) on the right hand side.
Once all of the variables gave been determined, click Next to begin the import process. Once complete, you’ll be presented with a URL. This link will take you to your website’s local environment where you can begin working offline.
Note: In the event that you did not copy over the .htaccess file during Step 1’s cPanel File Manager export process, you might find that your site’s permalinks will be a bit jumbled. To solve this, you may need to resave your permalinks if DesktopServer’s automatic search and replace function fails.
As well as using cPanel, there are a number of alternate methods for importing a live website to a local environment.
If you own and use one of the following plugins, click on the link/s below to read the official DesktopServer by ServerPress tutorials for importing a live website using a plugin:
We hope that you reap all of the benefits of working offline, and too, have found a great local environment solution in DesktopServer as we have.
Next up is the fourth and final article: How to Migrate a Website from a Local Environment to Live Server (DesktopServer Series: Part 4 of 4)
If you have any queries or questions, please feel free to leave them in the comments section below. We love receiving your feedback!
Thanks for reading!