VS Code SFTP to cPanel

This guide covers the "Best Practice" setup for managing cPanel/FTP connections in VS Code. It keeps your credentials global (on your local machine) and your project rules local (in your code folder), ensuring you never accidentally leak a password.

Part 1: Global Setup (The "Keyring")

We store the sensitive login details in your Windows User Profile. This stays on your machine and is never shared with your project.

Open VS Code.
Press Ctrl + Shift + P to open the Command Palette.
Type "user settings json" and select Preferences: Open User Settings (JSON).
Paste the following block into your settings (ensure it's inside the main {} braces).

"remotefs.remote": {
    "PROFILE_NAME": {
        "scheme": "ftp",
        "host": "YOUR_HOST",
        "username": "YOUR_USERNAME",
        "password": "YOUR_PASSWORD",
        "port": 21
    }
}

Scheme: Use ftp (or sftp if your host enables SSH later).
Password: This is the only place you will ever type this password.

Part 2: Project Setup (The "Rules")

This file tells VS Code which global login to use and what files to ignore. Create this inside your project folder at .vscode/sftp.json.

{
    "remote": "PROFILE_NAME",
    "name": "ANY_NAME_HERE",
    "protocol": "ftp",
    "port": 21,
    "uploadOnSave": true,
    "syncMode": "full",
    "remotePath": "/",
    "ignore": [
        ""
    ]
}

remote: Must match the name you chose in Part 1 exactly.
name: Required for the VS Code UI to display the connection.
ignore: Critical for preventing VS Code from uploading your local config files or Git history to the live site.

Part 3: The Security Safety Net

To ensure your project folder remains clean, create or update your .gitignore file in the project root:

Open your .gitignore file.
Add this line: .vscode/sftp.json

Why? Even though the file no longer contains your password, it’s still good practice to keep server paths and connection nicknames out of public repositories.

Part 4: Workflow & Verification

Once configured, here is how you use it:

Automatic Upload: Simply save any file (Ctrl + S), and you will see a progress bar at the bottom of VS Code uploading it to the server.
Manual Sync: Right-click a file or folder in the sidebar and select SFTP: Upload or SFTP: Download.
The Safety Check: Before a major change, right-click the root folder and select SFTP: Diff. This opens a side-by-side view comparing your local code to what is currently live on the server.

Troubleshooting Tips

Connection Errors: Check the Output tab in VS Code and select sftp from the dropdown. It will tell you if the login failed or if the port was blocked.
Schema Errors: If you see "Matches multiple schemas," ignore it or ensure remote is at the top of your sftp.json. It is a visual bug in the extension and won't break the functionality.

Now that the setup is complete, would you like me to help you create a separate "Staging" profile in your global settings for testing changes before they go live?

Staging Profile

Created: March 17, 2026 • Last Modified: February 23, 2026

Docs Login