# Fix VS Code Explorer for Content Projects

The [**VS Code Explorer**](https://code.visualstudio.com/docs/getstarted/userinterface#_explorer) displays folders at the top of a directory. This is a common hierarchy that I like in *most* cases.

**But I hate it for content.**

For content sites — like [**chan.dev**](http://chan.dev) — I prefer alphabetical order. I want to see my files and folders all *mixed* up together.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1690304820028/93a4f1ea-4cf4-4e9d-b28f-1450e7ad1452.png align="center")

## **How to change the setting**

To change the default behavior, open Settings and find the option for `Explorer: Sort Order.`

![Screenshot of VS Code Settings, for the option Explorer: Sort Order. Selected is the mixed option.](https://chan.dev/_astro/vs-code-settings_explorer-sort-order-mixed.e078a41d.png align="left")

With this option enabled, files and folders are interwoven in the Explorer.

## **Why I prefer mixed sort order**

On [**chan.dev**](http://chan.dev), I have lots of markdown files. Some of them have images. And I want to keep those images in a folder nearby. I ain’t tryna faff with Cloudinary or hunt down shared `/assets/images` folder. *I want them right next to my post.*

This makes it easy to keep my place on the file system.

## **Take it further with workspaces**

As mentioned, I prefer the default sort order for most projects. So, I keep this setting stored in my [**chan.dev**](http://chan.dev) [**workspace**](https://code.visualstudio.com/docs/editor/workspaces). And only *this* project is impacted by the setting.

```json

// chan.dev/.vscode/settings.json
{
  "explorer.sortOrder": "mixed"
}
```

<iframe width="315" height="560" src="https://www.youtube.com/embed/RvYvyzsnFm8" style="font-size:16px;font-style:normal;font-variant-caps:normal;font-weight:400;letter-spacing:normal;orphans:auto;text-align:start;text-indent:0px;text-transform:none;white-space:normal;widows:auto;word-spacing:0px;-webkit-text-stroke-width:0px;text-decoration:none;box-sizing:border-box;border-width:0px;border-style:solid;border-color:rgb(229, 231, 235);display:block;vertical-align:middle;caret-color:rgb(55, 65, 81);color:rgb(55, 65, 81);font-family:"Work Sans", sans-serif"></iframe>