HF PanelDocsv1.0.0

Develop locally with HF Server and publish

Build a WordPress or PHP site on your own computer with HF Server, show it to a client, then move its files and database to your hosting.

This tutorial builds a site on your own computer with the free HF Server desktop app, lets a client see it with a public link, and then publishes it to your hosting account on example.com. The example is WordPress; the same steps work for any PHP site.

You need:

  • a Windows, macOS or Linux computer
  • a hosting account on HF Panel with example.com added

1. Install HF Server

  1. Install HF Server and open it.
  2. Open Components and click Install everything missing.
  3. Open Control panel and click Start all.

2. Make the site

  1. Open Sites and click New site.
  2. Type the Name shop, choose WordPress, and click Create site.
  3. When it is done, click Open and finish setup and finish the WordPress installer.

The site runs at http://shop.localhost and has its own database called shop. See New site.

3. Build it

Edit the files in the htdocs/shop folder, install your theme and plugins, and add the content. Emails the site sends are caught on the Mail page instead of going out. See Mail catcher.

4. Show it to your client

  1. Open Databases and click Root password to set a MySQL root password, if you haven't yet.
  2. On Sites, click Share next to the site, then Share in the dialog.
  3. Click Copy link and send the https:// link to your client.

Click Stop sharing when they have seen it. See Share a local site with HF Tunnel.

5. Export the database

On Databases, click Back up next to shop. The .sql file is saved in backups/databases in the HostFog folder.

6. Upload the files

Zip the contents of htdocs/shop on your computer, then on your hosting:

  1. Open Control Panel › Files › File Manager and go to web/example.com/public_html.
  2. Click Upload and choose the .zip file.
  3. Choose Extract here on the uploaded file, then delete the .zip.

For a big site, SFTP is faster: see SSH / SFTP keys. For code in Git, use Software › Git and Deploy now instead.

7. Import the database

  1. Open Databases › MySQL databases. Under Quick create, type shop and click Create. Copy the database name, user and password from the message.
  2. Click Import next to the new database, choose the .sql file from step 5 and click Import.

8. Connect the site to its new database

In the File Manager, open web/example.com/public_html/wp-config.php and set DB_NAME, DB_USER and DB_PASSWORD to the values from step 7. Keep DB_HOST as localhost.

9. Change the address

The database still uses http://shop.localhost.

  1. Open Websites › WordPress. The site is found by itself.
  2. In Change the address, enter the Old address http://shop.localhost and the New address https://example.com.
  3. Click Dry run, then Replace.

10. Go live

Check that example.com points at the server and has a certificate under Domains › SSL/TLS, then open https://example.com. Run Security hardening › Fix all on the WordPress screen while you are there.

Tip: for later changes, make them on a staging copy on the server, or repeat steps 5–9.