I’ve only been using Visual Studio Code for about a year now. I really like it of course. I’m not one who is all about creating a custom theme, but I do like to adjust some of the editor / syntax highlighting settings to suit my preferences.

I recently discovered that it’s quite easy to adjust some very basic settings at least. In particular, one of the editor settings I have wanted to customize is the font-size, as VS Code has a larger font size than I’d usually want. Add the following to your code-workspace file to set your custom font settings:

    "settings": {   
        "editor.fontSize": 12,
        "editor.lineHeight": 22,
        "editor.fontFamily": "Consolas"
    }

Reference the larger template below to see where to put those lines in the code-workspace file.

If you’re not already using Workspaces for your projects, I recommend you start. The project_name.code-workspace file is your place for custom settings which you can save and copy to new workspaces, so you don’t have to continually configure the editor to your preferences.

By default, the file will have nothing in it. On creating a new workspace by selecting File > Save Workspace As… , you’re able to create the file for wherever you’re working, and then you can manually add to that .JSON file your own preferred settings. You might keep those settings in a separate file, perhaps liked with your Google Drive or MS OneDrive, so you’ll always have those settings no matter where you are! A new VS Code workspace file might look like the following:

{
    "folders": [
        {
            "path": "."
        }
    ],
    "settings": {   
    }
}

I develop on both Windows a Linux systems, so I keep a .code-workspace file for both platforms to make it easy to setup the Integrated Development Enviroment (IDE) for either platform.

I’ll share here a template that I’ve used, to give you an idea of what can be done with it. The first thing you should notice in practice is a boost in your productivity. Assuming you’re familiar with the JSON file format, you can see here that your most common settings can be saved in a .code-workspace file (which is a JSON file). Some of the settings configured here are external apps, web server URL path mapping, default code formatters, file exclusions, and Xdebug settings:

{
    "folders": [
        {
            "path": "."
        }
    ],
    "settings": {
        "workbench.colorTheme": "Bluloco Dark Italic",
        "workbench.startupEditor": "none",
        "editor.minimap.enabled": false,
        "editor.fontSize": 12,
        "editor.lineHeight": 22,
        "editor.fontFamily": "Consolas",
        "[json]": {
            "editor.defaultFormatter": "Wscats.eno"
        },
        "[php]": {
            "editor.defaultFormatter": "bmewburn.vscode-intelephense-client"
        },
        "[css]": {
            "editor.defaultFormatter": "Wscats.eno"
        },
        "phpstan.binPath": "/var/www/html/vendor/bin/phpstan",
        "hide-files.files": [],
        "explorerExclude.backup": {},
        "files.exclude": {
            "**\\*.7z": true,
            "**\\*.gif": true,
            "**\\*.jpg": true,
            "**\\*.log": true,
            "**\\*.pdn": true,
            "**\\*.png": true,
            "**\\*.PNG": true,
            "**\\*.png~": true,
            "**\\*.psd": true,
            "**\\*.rar": true,
            "**\\*.zip": true,
            "**\\README": true,
            ".gitignore": true,
            "README": true,
        },
        "open-php-html-js-in-browser.alternativeDocumentRootFolders": [
            "C:\\apache2\\htdocs\\my_project"
        ],
        "open-php-html-js-in-browser.documentRootFolder": "C:\\apache2\\htdocs\\",
        "open-php-html-js-in-browser.customUrlToOpen": "http://localhost/my_project/${relativeDirnameDocumentRoot}/${fileBasename}",
        "open-php-html-js-in-browser.customBrowserPath": "C:\\Portable\\FirefoxNightly\\firefox.exe",
        "open-php-html-js-in-browser.customHost": "localhost:80",
        "open-php-html-js-in-browser.urlToOpen": "custom",
        "open-php-html-js-in-browser.selectedBrowser": "Ask always...",
        "compile-hero.sass-output-directory": "../",
        "compile-hero.scss-output-directory": "../",
        "autoHide.autoHideSideBar": true,
        "autoHide.autoHidePanel": true,
        "autoHide.panelDelay": 1999,
        "autoHide.sideBarDelay": 4999,
        "editor.wordWrap": "on",
        "php.debug.executablePath": "C:\\php\\php.exe"
    },
    "launch": {
        "version": "0.2.0",
        "configurations": [

            {
                "name": "Listen for Xdebug",
                "type": "php",
                "request": "launch",
                "port": 9003
            }
        ]
    }
}