{"id":33995,"date":"2021-06-19T16:02:46","date_gmt":"2021-06-19T16:02:46","guid":{"rendered":"https:\/\/ubuntuhandbook.org\/?p=33995"},"modified":"2021-07-17T06:55:20","modified_gmt":"2021-07-17T06:55:20","slug":"windows-11-style-system-panel-ubuntu-20-04","status":"publish","type":"post","link":"https:\/\/ubuntuhandbook.org\/index.php\/2021\/06\/windows-11-style-system-panel-ubuntu-20-04\/","title":{"rendered":"How to Get Windows 11 Style System Panel in Ubuntu 20.04, 21.04"},"content":{"rendered":"<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/12\/gnome-icon250.png\" alt=\"\" width=\"250\" height=\"250\" class=\"alignleft size-full wp-image-33105\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/12\/gnome-icon250.png 250w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/12\/gnome-icon250-150x150.png 150w\" sizes=\"auto, (max-width: 250px) 100vw, 250px\" \/><\/p>\n<p>The upcoming Windows 11 has leaked online a few days ago. Here&#8217;s how to implement the new look and feel in Ubuntu 20.04, and\/or Ubuntu 21.04.<\/p>\n<p>Gnome has a large collection of extensions to get additional and optional functionality. You can use <i><b>dash to panel<\/b><\/i> to combine the top-bar and the left dock into single. And <i><b>Arc Menu<\/b><\/i> extension is available to replace the default system app launcher.<\/p>\n<p>So your Ubuntu Desktop can be customized to look like the picture shows:<\/p>\n<p><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/07\/archmenu-win11.jpg\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/07\/archmenu-win11-600x337.jpg\" alt=\"\" width=\"600\" height=\"337\" class=\"aligncenter size-large wp-image-34175\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/07\/archmenu-win11-600x337.jpg 600w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/07\/archmenu-win11-300x169.jpg 300w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/07\/archmenu-win11-768x431.jpg 768w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/07\/archmenu-win11.jpg 1100w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/p>\n<h3>Install Dash To Panel to get single system panel:<\/h3>\n<h4>1.) Install Dash to Panel extension:<\/h4>\n<p>For <b>Ubuntu 21.04<\/b>, simply press <i>Ctrl+Alt+T<\/i> on keyboard to open terminal and run command to install the extension:<\/p>\n<pre style=\"border:none;\">sudo apt install gnome-shell-extension-dash-to-panel<\/pre>\n<p><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/apt-dash2panel.jpg\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/apt-dash2panel-600x179.jpg\" alt=\"\" width=\"600\" height=\"179\" class=\"aligncenter size-large wp-image-33997\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/apt-dash2panel-600x179.jpg 600w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/apt-dash2panel-300x89.jpg 300w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/apt-dash2panel.jpg 759w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/p>\n<p>For <b>Ubuntu 20.04<\/b>, though the previous command works I recommend to do following steps instead to get the newer version:<\/p>\n<p>a. First run command to install required tools for installing &#038; managing Gnome extensions:<\/p>\n<pre style=\"border:none;\">sudo apt install chrome-gnome-shell gnome-shell-extension-prefs<\/pre>\n<p><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/10\/apt-chrome-gnome-shell-prefs.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/10\/apt-chrome-gnome-shell-prefs.png\" alt=\"\" width=\"600\" height=\"150\" class=\"aligncenter size-full wp-image-32875\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/10\/apt-chrome-gnome-shell-prefs.png 600w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/10\/apt-chrome-gnome-shell-prefs-450x113.png 450w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/p>\n<p>b. Next go to Dash-to-Panel web page and turn on the slider icon to install it:<\/p>\n<div class=\"wp-block-buttons aligncenter\">\n<div class=\"wp-block-button is-style-fill\"><a class=\"wp-block-button__link has-vivid-cyan-blue-to-vivid-purple-gradient-background has-text-color has-background\" href=\"https:\/\/extensions.gnome.org\/extension\/1160\/dash-to-panel\/\" target=\"_blank\" rel=\"noreferrer noopener\">Install Dash-to-Panel<\/a><\/div>\n<\/div>\n<p><i>If you don&#8217;t see the toggle icon, install browser extension via &#8220;<i>Click here to install browser extension<\/i>&#8221; link and refresh the web page.<\/i><\/p>\n<p><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/install-dash2panel.jpg\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/install-dash2panel-600x353.jpg\" alt=\"\" width=\"600\" height=\"353\" class=\"aligncenter size-large wp-image-33998\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/install-dash2panel-600x353.jpg 600w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/install-dash2panel-300x176.jpg 300w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/install-dash2panel-768x451.jpg 768w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/install-dash2panel.jpg 970w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/p>\n<h4>Enable &#038; Configure Dash to Panel:<\/h4>\n<p>Once installed the extensions, restart Gnome Shell by pressing <b><i>Alt+F2<\/i><\/b>, type <b>r<\/b> in popup &#8216;Run a Command&#8217; box, and hit Enter.<\/p>\n<p>Or just log-out and back in if you&#8217;re running on Wayland session.<\/p>\n<p><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/06\/restart-gnome.jpg\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/06\/restart-gnome.jpg\" alt=\"\" width=\"471\" height=\"239\" class=\"aligncenter size-full wp-image-10248\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/06\/restart-gnome.jpg 471w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/06\/restart-gnome-450x228.jpg 450w\" sizes=\"auto, (max-width: 471px) 100vw, 471px\" \/><\/a><\/p>\n<p>Next enable the extension via either <i>Gnome Extension app<\/i> or <i>Gnome Tweaks<\/i> tool.<\/p>\n<p><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/enable-arc-dash2panel.jpg\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/enable-arc-dash2panel-600x241.jpg\" alt=\"\" width=\"600\" height=\"241\" class=\"aligncenter size-large wp-image-33999\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/enable-arc-dash2panel-600x241.jpg 600w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/enable-arc-dash2panel-300x121.jpg 300w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/enable-arc-dash2panel-768x309.jpg 768w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/enable-arc-dash2panel.jpg 828w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/p>\n<p>Finally <i>right-click on blank area<\/i> of the new panel, and go to &#8216;Dash to Panel Settings&#8217;. There do:<\/p>\n<ul>\n<li>Toggle off &#8216;Show Applications&#8217; button.<\/li>\n<li>Change the position of &#8216;Left box&#8217;, &#8216;Taskbar&#8217;, and &#8216;Center box&#8217;. Use &#8216;Centered&#8217; or &#8216;Monitor Center&#8217; depends on your display.<\/li>\n<li>Change panel background opacity, icon size, etc in next tabs.<\/li>\n<\/ul>\n<p><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/dash2panel-position.jpg\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/dash2panel-position-443x600.jpg\" alt=\"\" width=\"443\" height=\"600\" class=\"aligncenter size-large wp-image-34000\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/dash2panel-position-443x600.jpg 443w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/dash2panel-position-222x300.jpg 222w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/dash2panel-position.jpg 715w\" sizes=\"auto, (max-width: 443px) 100vw, 443px\" \/><\/a><\/p>\n<h3>Install Arc Menu as Start Menu:<\/h3>\n<p>Though the Arc Menu is available to install via apt command, I recommend to install it from your web browser. That&#8217;s because the one in apt repository is the un-maintained versions though it still works in current releases.<\/p>\n<p>1.) First run command to install the required tools, if you didn&#8217;t do it in previous step:<\/p>\n<pre style=\"border:none;\">sudo apt install chrome-gnome-shell gnome-shell-extension-prefs<\/pre>\n<p><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/10\/apt-chrome-gnome-shell-prefs.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/10\/apt-chrome-gnome-shell-prefs.png\" alt=\"\" width=\"600\" height=\"150\" class=\"aligncenter size-full wp-image-32875\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/10\/apt-chrome-gnome-shell-prefs.png 600w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/10\/apt-chrome-gnome-shell-prefs-450x113.png 450w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/p>\n<p>Next go to Arc Menu web page and turn on the slider icon to install it:<\/p>\n<div class=\"wp-block-buttons aligncenter\">\n<div class=\"wp-block-button is-style-fill\"><a class=\"wp-block-button__link has-vivid-cyan-blue-to-vivid-purple-gradient-background has-text-color has-background\" href=\"https:\/\/extensions.gnome.org\/extension\/3628\/arcmenu\/\" target=\"_blank\" rel=\"noreferrer noopener\">Install Arc Menu<\/a><\/div>\n<\/div>\n<p><i>If you don&#8217;t see the toggle icon, install browser extension via &#8220;<i>Click here to install browser extension<\/i>&#8221; link and refresh the web page.<\/i><\/p>\n<p><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/install-arcmenu.jpg\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/install-arcmenu-600x353.jpg\" alt=\"\" width=\"600\" height=\"353\" class=\"aligncenter size-large wp-image-34001\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/install-arcmenu-600x353.jpg 600w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/install-arcmenu-300x176.jpg 300w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/install-arcmenu-768x451.jpg 768w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/06\/install-arcmenu.jpg 970w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/p>\n<p>You may need to press <i>Alt+F2<\/i>, type <b>r<\/b>, and hit Enter to restart Gnome Shell, or log out and back in to enable the extension. If you don&#8217;t see the new start menu, enable Arc Menu via either <i>Gnome Extension app<\/i> or <i>Gnome Tweaks<\/i> tool.<\/p>\n<p>Finally right-click on new start menu and open settings. Under &#8216;Menu Layout&#8217;, choose the Modern Menu Layouts and select &#8220;Eleven&#8221;. <\/p>\n<p><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/07\/archmenu-selectwin11.jpg\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/07\/archmenu-selectwin11-600x557.jpg\" alt=\"\" width=\"600\" height=\"557\" class=\"aligncenter size-large wp-image-34177\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/07\/archmenu-selectwin11-600x557.jpg 600w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/07\/archmenu-selectwin11-300x279.jpg 300w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/07\/archmenu-selectwin11-768x713.jpg 768w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2021\/07\/archmenu-selectwin11.jpg 941w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/p>\n<p>That&#8217;s it.<\/p>\n<h3>How to Restore:<\/h3>\n<p>Simple turn off or remove the two extensions via Gnome Extension App will restore your desktop appearance. If not, restart Gnome Shell via Alt+F2 run command box or log out and back in.<\/p>","protected":false},"excerpt":{"rendered":"<p>The upcoming Windows 11 has leaked online a few days ago. Here&#8217;s how to implement the new look and feel in Ubuntu 20.04, and\/or Ubuntu 21.04. Gnome has a large collection of extensions to get additional and optional functionality. You can use dash to panel to combine the top-bar and the left dock into single. [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":34175,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[9],"tags":[2041],"class_list":["post-33995","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-howtos","tag-windows-11"],"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/posts\/33995","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/comments?post=33995"}],"version-history":[{"count":0,"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/posts\/33995\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/media\/34175"}],"wp:attachment":[{"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/media?parent=33995"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/categories?post=33995"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/tags?post=33995"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}