WorryFree Computers   »   [go: up one dir, main page]

Skip to content

Studio

Studio by WordPress.com is a free desktop app that helps developers streamline their local WordPress development workflows.

With Studio, you’ll be able to easily build and maintain local WordPress websites without manual server setup or tool configuration. It also allows you to share your work publicly (think: with clients, team members, or design teams) through temporary demo sites hosted on WordPress.com

Quick Start

To install Studio, visit the official Studio page and download the installer for your operating system: macOS or Windows. 

Install Studio for macOS

To install and start using Studio on macOS:

  1. Download the correct installer for your computer’s specs: Silicon or Intel.
  2. Open the downloaded file.
  3. Drag the Studio application to your Applications folder.
  4. Double-click the Studio icon to start the Studio app.
  5. Name your first site and click Continue.

Install Studio for Windows

To install and start using Studio on Windows:

  1. Download the Windows installer.
  2. Open the setup .exe file.
  3. Wait for Studio to install, it will launch automatically once the installation is complete. 
  4. Name your first site and click Continue.

If you use an early version of Studio for Windows (downloaded before May 29, 2024), please follow the steps above to install the latest version to ensure you receive updates when available.

Connect to WordPress.com

By connecting your WordPress.com account to Studio, you can start using demo sites and ensure that you get immediate access to any upcoming features that depend on a WordPress.com connection.

If you don’t already have a WordPress.com account, you can create one for free here.

To connect Studio to WordPress.com:

  1. Click the WordPress.com button in Studio’s sidebar.
  2. A new browser window will open. Log into WordPress.com.
  3. On the authorization screen, click Approve to connect Studio to your account.
  4. Once approved, a popup will appear prompting you to open the Studio app. Click on the “Open Studio” option to finalize the process. If the “Share” settings do not change after logging into WordPress.com, you might need to re-start the desktop app.

Studio Features

Studio makes it easy to access settings, view styling, and implement changes on your local sites. You can quickly turn sites on/off, create demo sites, and change your sites’ names, all within the Studio app.

Sites

A Studio site is a WordPress instance running locally on your computer, and each of your sites will be listed in the Studio sidebar. 

Studio allows you to create, maintain, and work on unlimited local WordPress websites.

Add a New Site

To add a new site to Studio:

  1. Click the Add site button.
  2. Name your site, choose a path (or accept the default), and then click Add site.

Any new site is started by default, which is depicted by a green dot in the sidebar:

an orange arrow pointing to a green dot next to a local site name in Studio by WordPress.com

Add a New Site Using an Existing WordPress Directory

You can also add a site to Studio using an existing WordPress directory:

  1. Remove wp-config.php file from the existing WordPress site directory.
  2. Click the Add site button.
  3. Name your site, choose a path with an existing WordPress site, and click Add site.

If you’d prefer to use an existing wp-config.php file, you can follow these instructions.

Starting and Stopping Sites

You can view any running site in your browser. With a stopped site, viewing the site in your browser will be disabled until you start it again.

To start a site:

  1. Click on a site name from the sidebar.
  2. Click the Start button. 
an orange arrow pointing to the Start button for a local website on Studio by WordPress.com

The button will now say “Running,” and the WP admin and Open site buttons will be enabled, allowing you to view the site in your browser. 

Another way to quickly start your site is to hover over the gray dot in the sidebar and click the start icon.

When you want to stop your site, click the Running button.

an orange arrow pointing to a start icon next to a site name in Studio by WordPress.com

To quickly stop all of your local sites from running, click the Stop all button in the sidebar.

an orange arrow pointing to the Stop all button on the sidebar of the Studio by WordPress.com app

View Sites

Once you start a site, there are two different ways to view it in your browser:

  • WP admin: Opens your local site’s dashboard.
  • Open site: Opens your local site’s homepage.

You do not need a username or password to view your site’s dashboard as you will be automatically logged in.

an orange arrow pointing to the WP Admin and Open site buttons on Studio by WordPress.com

Site Overview

Each local site has its own quick-access buttons under the Overview tab for easy navigation and an efficient workflow.

Select one of your sites and make sure that it is running. Under Customize, you can quickly open site setting pages with just one click. 

If you’re using a block theme on your local site, you’ll see the following options:

  • Site Editor
  • Styles
  • Patterns
  • Navigation
  • Templates
  • Pages

If you’re using a classic theme on your local site, you’ll see the following options, depending on their availability in the theme:

  • Customizer
  • Menus
  • Widgets

Under the Open in… heading, Studio will show buttons that will open your site in the following apps if detected on your computer:

  • Finder (macOS only)
  • File Explorer (Windows only)
  • VS Code
  • Terminal
  • PhpStorm

Demo Sites

With Studio, you can share your work with demo sites. These demo sites are powered by WordPress.com on a temporary domain (wp.build), and they allow you to share snapshots of your local sites with clients or team members. 

You can create up to five demo sites at a time per WordPress.com account, and you can view the total number of demo sites you have associated with your account by clicking on your avatar within the Studio app.

Create a Demo Site

To create a demo site: 

  1. Select the local site within the Studio.
  2. Click on the “Share” tab.
  3. Log in to WordPress.com if you haven’t already.
  4. Click on the “Add demo site” button.

Your demo site should be ready to view in a few seconds, and it will be available to access publicly for seven days.

Update Your Demo Site

By design, demo sites are generated as one-time “snapshots” of your work. That said, you may synchronize local site changes with your demo site: 

  1. Select the local site within Studio.
  2. Click on the “Share” tab.
  3. Click “Update demo site” and confirm.

Your demo site will be updated with the local changes in a few seconds. This will also reset the demo site expiration date back to seven days.

Demo Site Expiration

Demo sites are temporary, and each demo site will be automatically deleted after seven days from the last update. This feature ensures that demo environments are used for short-term feedback and review purposes.

Delete All Demo Sites

To quickly delete all of your demo sites within Studio:

  1. Click on your avatar within Studio.
  2. Click the three stacked dots (⋮) next to your demo site count.
  3. Click the Delete all demo sites button.

Site Settings

You can view each site’s settings by selecting a site and then clicking on the Settings heading.

  • Site name: Your local site’s name (editable).
  • Local domain: The domain you can use to view your site in your browser, provided your site is running
  • Local path: Where your site files are located on your computer.
  • WP Version: The current version of your local site.
  • Username: The username for the admin account on your local site and can be used to log into your demo site. 
  • Password: The password for the admin account on your local site and can be used to log into your demo site. 
  • Admin URL: The login page for your local site.

You may also delete your local site by clicking the Delete site button. You’ll have the option to delete site files from your computer before confirming the deletion.

An orange arrow pointing to the 'Delete site files from my computer' toggle on Studio by WordPress.com

Frequently Asked Questions

How can I export a theme I created in Studio?

Themes created in Studio are the same as themes created on traditional WordPress sites. You can export your theme by following these steps:

  1. Select the local site within Studio.
  2. Ensure that your site is already running.
  3. Click on the Overview tab.
  4. Click the Site Editor button.
  5. Once the site editor loads in your browser, expand the editor by clicking anywhere on the site preview.
an orange arrow pointing to a WordPress theme in the site editor
  1. Click the Options menu button, represented by three stacked dots (⋮). 
  2. Click Export, and your browser should begin downloading a .zip file of your theme.

You can then upload your theme to any live or staging WordPress site by following these instructions.

How can I publish my Studio site into any host?

While demo sites are intended for sharing with clients and gathering early feedback, a hosting plan is required to make your site permanently accessible.

If you want to deploy the files and the database to a hosted website that’s publicly available, you’ll need a hosting plan with plugin support, such as the WordPress.com Creator plan. Then you can follow the Import using All in One WP Migration guide to create an export of your source site and then import that content to the destination site.

How can I manage the Studio site’s SQLite database?

Studio uses SQLite instead of MySQL server. SQLite is a lightweight, self-contained SQL database engine that stores your database in a single file. Each of your sites will have a database file available in the following path: wp-content/database/.ht.sqlite. This is a hidden file and may not be visible using your File Explorer. On a Mac you can press cmd+. to reveal the hidden files using Finder.

Once you’ve located the SQLite database file, you can manage the database using any application compatible with SQLite. We recommend using SQLite3, provided you are comfortable using the terminal and SQLiteStudio as a UI.

While connecting to the SQLite database directly can be useful for running SQL queries, the dump generated by SQLiteStudio or running “sqlite3 wp-content/database/.ht.sqlite .dump > backup.sql” will not be directly compatible with MySQL.

SQLite3

SQLite is installed by default in Unix systems like Mac. For Windows, you can download it from the official page.

Once you have it installed:

  1. Select the local site within Studio.
  2. Click on the Overview tab.
  3. Click the Terminal button.
  4. In your terminal, execute the following command to interact with your database:
    sqlite3 wp-content/database/.ht.sqlite

Learn more about using SQLite3 from the terminal in SQLite3 documentation.

SQLiteStudio

If you prefer using an application with a user interface, you can use SQLiteStudio.

Once you have it installed:

  1. Find the wp-content/database/ folder in your File Explorer or Finder.
  2. Make sure you can see hidden files.
  3. Open SQLiteStudio.
  4. Drag and drop the .ht.sqlite file into the application.

How can I use Studio with the MySQL server of my choice?

Studio has built-in support for a SQLite database, but you can use the MySQL server of your choice, e.g., Homebrew or Docker, to test your site with different database engines.

If you have a local site already configured to work with a custom MySQL server of your choice, you can add it to Studio. If the site files include a wp-config.php file, Studio will skip the SQLite database setup and use the already configured database.

If you have already created a site in Studio, and want to switch SQLite to the MySQL server of your choice, follow the steps below:

  1. Open your Studio’s site directory.
  2. Navigate to the wp-content directory and delete the db.php file and the database directory.
  3. Navigate to the mu-plugins directory and delete sqlite-database-integration-main directory.
  4. Update wp-config.php file and fill in your MySQL server’s credentials.
  5. Start the site.
  6. Start your MySQL server.
  7. Open the site.

Why isn’t the “Open In” button available for my preferred app?

The current buttons available in the Open in… area for each of your local sites are Finder (for macOS), File Explorer (for Windows), and then VS Code, Terminal, and PhpStorm for both platforms.

Studio, PhpStorm, and VS Code must live in your Applications folder to ensure the Open in… options are available.

How can I make Studio faster on Windows?

If the Real-Time Protection Service of Windows Defender is enabled on your machine, it may slow down the process of creating and starting a site, particularly when running PHP files of WordPress. To enhance site speed, we recommend adjusting the configuration accordingly:

Windows 11:

  1. Select Start, then open Settings. Under Privacy & security, select Virus & threat protection.
  2. Under Virus & threat protection settings, select Manage settings, and then under Exclusions, select Add or remove exclusions.
  3. Select Add an exclusion, and then select from process.
  4. Type the path of the Studio app executable file (e.g. C:\Users\<YOUR_USER>\AppData\Local\studio\Studio.exe) and then click on Add button.

Windows 10:

  1. Go to Start > Settings > Update & Security > Windows Security > Virus & threat protection.
  2. Under Virus & threat protection settings, select Manage settings, and then under Exclusions, select Add or remove exclusions.
  3. Select Add an exclusion, and then select from process.
  4. Type the path of the Studio app executable file (e.g. C:\Users\<YOUR_USER>\AppData\Local\studio\Studio.exe) and then click on Add button.

Next Steps and Feedback

We hope Studio effortlessly fits into your local development workflow. Be sure to check out our other developer tools and platform features that will provide you with the flexibility and control you need to build on WordPress.com.

Studio is an open source project that welcomes all contributions. If you spot a bug or the Studio feature you need is missing, we have some options:

Last updated: May 30, 2024