How to Display VS Code output window to side rather than below

C

11

29

In my VS Code set up I see the output/FSI frame below the main text editor pane like this:

whereas I would love it to appear to the right in the side-by-side view like it does on the images in this link: http://www.wintellect.com/devcenter/jwood/a-quick-look-at-f-in-visual-studio-code

Is there a config option I cannot find somewhere?

I tried Googling but drew a blank and cannot see anything obvious in the config options mentioned on the vs code site page describing the config options

Convalesce answered 18/4, 2016 at 18:59 Comment(1)

Just got added. You can view the pull request on github. This feature is available on VS code insiders now. – Ectopia 3/11, 2017 at 17:34

W

13

I don't believe you can detach/move the output windows in Visual Studio Code. You can move the side bar to the left/right side, but that's it. There is no config option, sorry.

You could try posting a feature request on the GitHub page: https://github.com/Microsoft/vscode

EDIT: This was changed in VS Code 0.10.8, it was once on the side but was moved to the bottom. See this GitHub issue: https://github.com/Microsoft/vscode/issues/2806

Whitleather answered 19/4, 2016 at 21:45 Comment(3)

Thanks for responding. I couldn't find any config option either but, looking at the screengrabs on the blog, this guy seems to have done it: wintellect.com/devcenter/jwood/… – Convalesce 19/4, 2016 at 22:28

I believe in an older, previous version of Visual Studio Code the output window was on the right side. But it was moved at some point to be the bottom. - Edited with version it changed – Whitleather 19/4, 2016 at 23:42

Floating window support (to detach/move a tab to a separate window) is still a pending feature request: github.com/Microsoft/vscode/issues/10121 – Psittacosis 1/2, 2018 at 19:19

C

51

as of version 1.51.1 right click in the right corner on the output panel. then select option 'move panel right'

Cheddite answered 21/12, 2018 at 17:57 Comment(2)

yes, but you right-click on the tab bar itself, not where the arrow is pointing ( the arrow is backwards ) – Notepaper 18/11, 2020 at 19:51

Wow, I searched for this for so long, thanks! – Alexandriaalexandrian 4/8, 2023 at 9:4

W

13

I don't believe you can detach/move the output windows in Visual Studio Code. You can move the side bar to the left/right side, but that's it. There is no config option, sorry.

You could try posting a feature request on the GitHub page: https://github.com/Microsoft/vscode

EDIT: This was changed in VS Code 0.10.8, it was once on the side but was moved to the bottom. See this GitHub issue: https://github.com/Microsoft/vscode/issues/2806

Whitleather answered 19/4, 2016 at 21:45 Comment(3)

Thanks for responding. I couldn't find any config option either but, looking at the screengrabs on the blog, this guy seems to have done it: wintellect.com/devcenter/jwood/… – Convalesce 19/4, 2016 at 22:28

I believe in an older, previous version of Visual Studio Code the output window was on the right side. But it was moved at some point to be the bottom. - Edited with version it changed – Whitleather 19/4, 2016 at 23:42

Floating window support (to detach/move a tab to a separate window) is still a pending feature request: github.com/Microsoft/vscode/issues/10121 – Psittacosis 1/2, 2018 at 19:19

U

7

This feature is not available yet in VS Code. However as of today (March 30, 2017) it's on 6 months roadmap so it should be done in a near feature.

Unbent answered 31/3, 2017 at 15:0 Comment(0)

C

6

This feature is available from version 1.18.0+

Simply click this icon to dock to the right:

Convalesce answered 14/11, 2017 at 18:48 Comment(0)

M

6

Just follow the steps mentioned:

In Visual Studio Code -

View Tab > Appearance > Toggle Panel Position

That's it.

Maggs answered 11/3, 2019 at 10:13 Comment(0)

S

5

Your original link to the view your desire is obsolete, so it is a guess as to what you wanted. But here is a demo of setting up a terminal/output look side-by-side. It is a little tricky - you drag your Outline header over the Terminal header which will then allow you the option of putting it to the left or right of the Terminal:

Syne answered 8/6, 2020 at 15:14 Comment(0)

F

2

its easy. just right-click on the terminal, select 'move panel right' like in the image below and voila

the image can be found here

Fredenburg answered 30/6, 2020 at 11:56 Comment(1)

please, explain more. – Mckenna 30/6, 2020 at 13:35

H

1

Vertical Split:

From VS Code Menu bar:

View >> Appearance >> Move Panel Right

Hosmer answered 8/2, 2021 at 12:58 Comment(0)

N

0

Version 1.47.0 of VS Code (at the moment of posting this, the latest one) allows you to drag output (or any other panel tab, e.g. terminal) to the activity bar. This way you can obtain output to the side of the editor.

Negris answered 22/7, 2020 at 7:48 Comment(0)

L

0

Just right click on the panel of output section then select "Move panel left or right" as per your wish. here your can see the move panel left option.

Liebman answered 15/12, 2022 at 18:33 Comment(0)

T

0

Press CTRL + SHIFT + P
Select Preferences: Open User Settings (JSON)
Insert (or change if it is there --search for it) the following config line:

    "workbench.panel.defaultLocation": "right",

Save file.

That will work for new workspaces. VS-Code saves your preferences for each folder you start it in. So, if you navigate to a folder you previously called VS-Code in (I mean, from the terminal), it will open the output panel in the same location it was the last time you have used VS-Code from the same location.
After making the change above, go to a new place, like /opt and start VS-Code there to make a test.

Tadashi answered 11/1, 2023 at 22:4 Comment(0)

Recommended topics

Hot tags