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

Question

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

Just got added. You can view the pull request on [github](https://github.com/Microsoft/vscode/pull/36827). This feature is available on VS code insiders now. — Supra_01, Nov 03 '17 at 17:34

Pranav Asthana · Answer 1 · 2020-11-19T15:20:08.890

50

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

edited Nov 19 '20 at 15:20

answered Dec 21 '18 at 17:57

Pranav Asthana

892
1
9
21

1

yes, but you right-click on the tab bar itself, not where the arrow is pointing ( the arrow is backwards ) – Nick Perkins Nov 18 '20 at 19:51
Wow, I searched for this for so long, thanks! – Israel Unterman Aug 04 '23 at 09:04

Tobiah Zarlez · Accepted Answer · 2016-04-19T23:44:50.650

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

edited Apr 19 '16 at 23:44

answered Apr 19 '16 at 21:45

Tobiah Zarlez

1,680
1
12
13

1

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: http://www.wintellect.com/devcenter/jwood/a-quick-look-at-f-in-visual-studio-code – Stewart_R Apr 19 '16 at 22:28
2

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 – Tobiah Zarlez Apr 19 '16 at 23:42
2

Floating window support (to detach/move a tab to a separate window) is still a pending feature request: https://github.com/Microsoft/vscode/issues/10121 – Roy Tinker Feb 01 '18 at 19:19

score 7 · Answer 3 · answered Mar 31 '17 at 15:00

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.

answered Mar 31 '17 at 15:00

Vlad Bezden

83,883
25
248
179

score 6 · Answer 4 · answered Nov 14 '17 at 18:48

6

This feature is available from version 1.18.0+

Simply click this icon to dock to the right:

answered Nov 14 '17 at 18:48

Stewart_R

13,764
11
60
106

score 6 · Answer 5 · answered Mar 11 '19 at 10:13

6

Just follow the steps mentioned:

In Visual Studio Code -

View Tab > Appearance > Toggle Panel Position

That's it.

answered Mar 11 '19 at 10:13

Shakti Singh

76
1
5

score 5 · Answer 6 · answered Jun 08 '20 at 15:14

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:

score 2 · Answer 7 · answered Jun 30 '20 at 11:56

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

answered Jun 30 '20 at 11:56

Bruno

135
1
11

please, explain more. – Hamed Baziyad Jun 30 '20 at 13:35

score 1 · Answer 8 · edited Feb 08 '21 at 19:47

1

Vertical Split:

From VS Code Menu bar:

View >> Appearance >> Move Panel Right

edited Feb 08 '21 at 19:47

Bill Tür stands with Ukraine

3,425
30
38
48

answered Feb 08 '21 at 12:58

user15169030

11
1

score 0 · Answer 9 · edited Jul 22 '20 at 09:49

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.

edited Jul 22 '20 at 09:49

mate00

2,727
5
26
34

answered Jul 22 '20 at 07:48

lukhirt

7
3

score 0 · Answer 10 · answered Dec 15 '22 at 18:33

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.

answered Dec 15 '22 at 18:33

Yash Gaur

1

Atauã Doederlein · Answer 11 · 2023-01-11T22:41:11.113

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.

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

11 Answers11