Jak zmienić położenie Narzędzi Chrome dla programistów

489

Narzędzia są domyślnie otwierane na dole okna chrome. Jest to raczej zły wybór w przypadku ekranu szerokoekranowego, ponieważ po prawej stronie jest dużo pustej przestrzeni, ale nie ma zbyt wiele miejsca w pionie. Niestety nie znalazłem sposobu na zmianę położenia narzędzi. Chciałbym mieć je z boku, podobnie jak firebug.

Jedyną opcją podobną do tego, czego chcę, jest odłączenie narzędzi programistycznych i umieszczenie chrome i okna narzędzi obok siebie. Nie jest to jednak bardzo wygodne w przypadku szybkiego Alt-Tabping z IDE do przeglądarki iz powrotem, więc „zintegrowane” rozwiązanie byłoby fajne.

google-chrome google-chrome-devtools kostja
źródło
github.com/melat0nin/chrome-devtools-vertical
Raghav
stackoverflow.com/questions/14386994/…
Nate

Odpowiedzi:

895

Chrome 46 lub nowszy

Kliknij przycisk pionowej elipsy (⋮), a następnie wybierz żądaną opcję dokowania.

Chrome 45 lub starszy

Przytrzymaj długo ikonę dokowania w prawym górnym rogu. Pojawia się opcja zmiany dokowania

Aby zmienić podział między panelami HTML i CSS, przejdź do DevTools do Ustawienia (F1)> Ogólne> Wygląd> Układ panelu.

Loislo
źródło
2
Fajnie, jest obecny w stabilnej wersji, po prostu nie wiedziałem o tym, ma jeszcze więcej fajnych opcji :) Dzięki
kostja
8
w najnowszych wersjach Chrome i Canary opcja została usunięta, ale nadal możesz uzyskać do niej dostęp, klikając i przytrzymując ikonę doku w lewym dolnym rogu, pojawia się opcja dokowania w prawo.
Paul Spencer
2
Fajnie, dokuj w prawo działa. Jak teraz przenieść inspektora CSS na karcie Elementy na dół okienka narzędzi deweloperskich? W przeciwnym razie muszę przeglądać HTML i CSS obok siebie w bardzo wąskich kolumnach.
Vicky Chijwani,
11
Co za okropny projekt! Nigdzie sam bym tego nie wymyślił. Nigdzie indziej nie widziałem tego wstrzymania i oczekiwania.
Dmitri Zaitsev
4
@blrbr Tak, tak prawdziwe. Jeśli musisz przeprowadzić wyszukiwanie w Google, aby dowiedzieć się, jak aktywować opcję, o której wiesz, że istnieje, coś jest nie tak z projektem interfejsu użytkownika. Słowo kluczowe to „wykrywalność”. To nie jest łatwe do wykrycia.
Stijn de Witt
70

Umieść wskaźnik na przycisku dokowania i kliknij go długo (kilka sekund) lub kliknij prawym i lewym przyciskiem myszy w zależności od wersji przeglądarki.

wprowadź opis zdjęcia tutaj wprowadź opis zdjęcia tutaj

użytkownik3246105
źródło
41

Skrót klawiaturowy do przełączania pozycji dokowania (z boku / u dołu)

CTRL+ SHIFT+D

Istnieje wiele skrótów, które możesz zobaczyć, przechodząc do

Ustawienia »Skróty , jak pokazano tutaj:
Zrzut ekranu ustawień

Alternatywnie, użyj CTRL+, ?aby przejść do ustawień, stamtąd można przejść do podelementu „Skróty” po lewej stronie lub skorzystać z oficjalnego odniesienia .

Alupotha
źródło
6
⌘-Shift-D również w OSX.
Meatspace
2
Jeśli nie możesz w ogóle otworzyć doku, spróbuj Ctrl+Shift+I- ale jeśli twoje okno jest wyskakujące, nie sądzę, aby dokowanie nawet działało.
Noumenon,
Dziękuję Ci! Inspektor jakoś utknął WAY poza ekranem, CTRL + SHIFT + D zadokował go dla mnie!
Stan
1
Z jakiegoś powodu, gdy oddokowuję narzędzia programistyczne Chrome, narzędzie wydaje się działać po prawej stronie mojego monitora i nie jest już widoczne. Jedynym sposobem, aby ponownie go wyświetlić, jest Ctrl + Shift + D i zadokować narzędzia programistyczne z boku lub u dołu. To dziwne
jazzBox
Chciałbym tylko wyrazić swoją miłość do ciebie. 🐐💘🐐
Curtis Blackwell
18

Wygląda na to, że znajduje się teraz w lewym dolnym rogu jako ikona z nakładającymi się oknami i „Oddokuj do osobnego okna”. etykietka.

wprowadź opis zdjęcia tutaj

brian_d
źródło
13
Możesz wyjaśnić, że musisz kliknąć I ZATRZYMAĆ ten przycisk, aby zadokować po prawej stronie. Jak zauważył @PaulSpencer, wystarczy kliknąć tylko oddokowanie.
0x89
11

Po umieszczeniu stacji dokującej po prawej stronie (patrz starsze odpowiedzi) nadal znajdowałem panele podzielone pionowo.

Aby podzielić panele w poziomie - a nawet uzyskać więcej z szerokości ekranu - przejdź do Ustawień (prawy dolny róg) i usuń zaznaczenie opcji „Podziel panele pionowo po zadokowaniu w prawo”.

Teraz masz wszystkie panele od lewej do prawej: str

użytkownik2243570
źródło
8

Od października 2014 r., Wersja 39.0.2171.27 beta (64-bit)

Musiałem przejść w Panelu Chrome Web Developper do „Ustawień” i odznaczyć Podział paneli w pionie po zadokowaniu w prawo

Pierre Maoui
źródło
1

Wersja 56.0.2924.87, w której teraz jestem, Odblokowuje DevTools automatycznie, jeśli NIE jesteś na pulpicie. W przeciwnym razie Otwórz NOWĄ nową kartę Chrome i sprawdź, aby zadokować DevTools z powrotem w oknie.

Charix
źródło
Co masz na myśli mówiąc „nie na pulpicie”? Jestem na 59.0.3067.6 (dev) i robi pewne dziwne rzeczy na niektórych stronach internetowych. Na przykład w Vtiger 6.5, kliknięcie prawym przyciskiem myszy i „inspekcja” otwiera narzędzia deweloperskie w nowym oknie, w którym brakuje opcji „Strona dokowania”, jednak użycie klawisza F12 powoduje normalne osadzenie w bieżącej karcie z dostępną opcją „Strona dokowania”. Dziwne.
dhaupin
0

Ponadto, jeśli chcesz zobaczyć Źródła i konsolę w jednym oknie, przejdź do:

„Dostosuj i kontroluj DevTools ->„ Pokaż szufladę konsoli ”

Możesz go również zobaczyć tutaj w prawym rogu:

„Pokaż szufladę konsoli”

Anton Polkanov
źródło