If you are ready to learn how to customize your Drupal site and unlock all its possibilities and functionalities, it means you’re ready to jump into code.
To start extending a Drupal site hosted on Pantheon, adding new contributed or custom modules or themes, you can use this approach that will allow you to push changes to Pantheon using VS Code and SFTP.
Requirements
- OS: Windows, Linux, Mac OS
- Download Visual Studio Code
- Any SFTP client: Filezilla, WinSCP or your preferred option.
- Composer: Recommended for installing modules. See instructions to install
- Estimated time: 20-30 minutes
Steps
- Create a site on Pantheon
- Configure VS Code for Pantheon
- Download the codebase
- Push changes to Pantheon
Create a site on Pantheon
1. Follow our tutorial and within a few clicks, you'll Create a New Drupal Site with Pantheon. If you already have a Drupal development environment set up, then just make sure you create a fresh install before the course.
Configure VS Code for Pantheon
2. Create a folder on your local machine where you'll keep your website files.
Install and open VS Code. On the “Welcome” screen, click on “Open folder” (or use the menu File - > Open) and select the folder you just created for your website. Now install the SFTP extension following this process:
3. Open the VS Code command palette (using Ctrl/Command + Shift + P) and run SFTP: config to open the SFTP config file:
4. Edit the config file with the credentials you got from Pantheon. Make sure the remotePath value is /code/. With uploadOnSave set to true, the next time you save changes to a file, they'll be pushed automatically to Pantheon.
5. If you can generate an SSH key on your local machine, add it to Pantheon. See the instructions to Generate and Add SSH Key (for Linux, Mac and Windows 10). Then, add the following line in the SFTP config file, replacing the file’s path corresponding to your local machine: "privateKeyPath": "/Users/localUser/.ssh/id_rsa".
After the configuration is done, you can test if it’s working by downloading the codebase (using the first method described in the following step).
Download the codebase
6. Log in to Pantheon. If you were registered previously via “Connect with Google” and are not using SSH on your local machine, visit Pantheon’s Dashboard and add a password for your account.
On the Pantheon dashboard, click on “Connect with SFTP” to get the credentials.
The initial codebase may be downloaded from Pantheon in 2 different ways:
- Using VSCode (recommended)
- Using an SFTP client
Using VS Code
Download the initial codebase from Pantheon by right-clicking in the empty section of the project folder and then selecting the option “Download folder” from the menu.
If required, enter your Pantheon password and wait for the files to be downloaded.
Using an SFTP client
Open your favourite SFTP client (like Filezilla or WinSCP) and use the credentials to connect (the password is the same for logging into Pantheon). Remember to set “SFTP” as the protocol.
If using FileZilla, go to File > Site Manager. Then, add and save a new connection, as shown below.
You're now ready to copy files located in the /code/ folder into the folder you created for your website files in your local machine. You can also upload files to Pantheon from your local machine. Depending on the software, you'll be able to drag and drop the folder from the server to your machine.
This process can take several minutes, depending on your internet connection.
Push changes to Pantheon
7. Well done! Now that the SFTP set up in VScode is done, and the codebase is downloaded, you can start making changes to the code using VS Code. When you save changes (depending on the configured values), they will be pushed to Pantheon. You’ll be prompted to enter your password according to the configuration method used.
The fun is about to start! Here’s a step-by-step example of how to customize your Drupal site by adding a new contrib module:
- Open a terminal window and locate the root folder of your site.
- Use the following composer command to add a module, for example, Focal Point:
composer require drupal/focal_point.
- This will generate changes in 2 files: composer.json and composer.lock
- Open VS Code, click on the “File” menu and then click on “Save all,” enter your password if needed.
- Open the Pantheon dashboard and check if the changes were implemented. Depending on your internet connection, it might take a few seconds.
- When you get a message like the following, click to obtain further details.
- Now commit those changes by adding a commit message and clicking on “Commit.”
- Visit your site as an admin user and open the “Extend” page. You’ll be able to search the module recently added and proceed to its installation.
You're all set! 
Did something go wrong? Don't worry! If you have any issues, you can check the troubleshooting section in Pantheon’s documentation or don't hesitate to contact us at [email protected]