{"id":38758,"date":"2016-11-22T08:00:40","date_gmt":"2016-11-22T15:00:40","guid":{"rendered":"http:\/\/webdesignledger.com\/?p=38758"},"modified":"2016-11-21T22:24:52","modified_gmt":"2016-11-22T05:24:52","slug":"center-logo-within-browser-adobe-muse","status":"publish","type":"post","link":"https:\/\/webdesignledger.com\/center-logo-within-browser-adobe-muse\/","title":{"rendered":"How To Center a Logo Within the Browser in Adobe Muse"},"content":{"rendered":"<p>[youtube https:\/\/www.youtube.com\/watch?v=Zb_lIiBsais]<\/p>\n<h2 style=\"text-align: center;\">Center Your Logo Vertically and Horizontally Within the Browser in Adobe Muse. No Coding Skills Required.<\/h2>\n<p style=\"text-align: center;\"><a href=\"http:\/\/museforyoushop.com\">\u00a0<\/a><a href=\"http:\/\/museforyoushop.com\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-35409 lazyload\" data-src=\"https:\/\/storage.googleapis.com\/webdesignledger.pub.network\/WDL\/2016\/05\/muse-for-you-shop-adobe-muse-cc-logo.png\" alt=\"Muse For You - Adobe Muse CC\" width=\"100\" height=\"100\" data-srcset=\"https:\/\/webdesignledger.com\/wp-content\/uploads\/2016\/05\/muse-for-you-shop-adobe-muse-cc-logo.png 500w, https:\/\/webdesignledger.com\/wp-content\/uploads\/2016\/05\/muse-for-you-shop-adobe-muse-cc-logo-250x250.png 250w\" data-sizes=\"(max-width: 100px) 100vw, 100px\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" style=\"--smush-placeholder-width: 100px; --smush-placeholder-aspect-ratio: 100\/100;\" \/><noscript><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-35409\" src=\"https:\/\/storage.googleapis.com\/webdesignledger.pub.network\/WDL\/2016\/05\/muse-for-you-shop-adobe-muse-cc-logo.png\" alt=\"Muse For You - Adobe Muse CC\" width=\"100\" height=\"100\" srcset=\"https:\/\/webdesignledger.com\/wp-content\/uploads\/2016\/05\/muse-for-you-shop-adobe-muse-cc-logo.png 500w, https:\/\/webdesignledger.com\/wp-content\/uploads\/2016\/05\/muse-for-you-shop-adobe-muse-cc-logo-250x250.png 250w\" sizes=\"(max-width: 100px) 100vw, 100px\" \/><\/noscript><\/a>\u00a0<a href=\"http:\/\/museforyoushop.com\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-35410 lazyload\" data-src=\"https:\/\/storage.googleapis.com\/webdesignledger.pub.network\/WDL\/2016\/05\/Adobe_Muse_logo-500x487.png\" alt=\"Adobe Muse CC Logo\" width=\"103\" height=\"100\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" style=\"--smush-placeholder-width: 103px; --smush-placeholder-aspect-ratio: 103\/100;\" \/><noscript><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-35410\" src=\"https:\/\/storage.googleapis.com\/webdesignledger.pub.network\/WDL\/2016\/05\/Adobe_Muse_logo-500x487.png\" alt=\"Adobe Muse CC Logo\" width=\"103\" height=\"100\" \/><\/noscript><\/a><\/p>\n<p class=\"p1\">Branding plays a big part in web design and most websites are branded with a logo and a slogan. A lot of times web designers and developers look for the best way to initially show the brand when someone visits their website. That is why I decided to create the Browser Centering Widget. With this widget you can initially center any element directly in the center of the browser. The element will be vertically centered and horizontally centered across all devices until the user scrolls, and then the element scrolls with the website. You can also fix the element in the center of the browser. This will insure that the brand or logo gets maximum attention and looks great when the user first visits the website. In the video above I go over how to use the Browser Centering Widget in your Adobe Muse website.<\/p>\n<p class=\"p1\">The steps are as follows:<\/p>\n<p class=\"p1\">1. Drag and drop the widget from the library panel onto your Adobe Muse website. If you do not see the library panel go to <strong>Window &gt; Library<\/strong>.<\/p>\n<p class=\"p1\">2. Assign the graphic style name that is in the widget to the element you would like to center via the graphic styles panel. If you do not see the graphic styles panel go to <strong>Window &gt; Graphic Styles<\/strong>.<\/p>\n<p class=\"p1\">3. Place the element at the very top of your Adobe Muse website. Element can be anywhere at the top.<\/p>\n<p class=\"p1\">4. If you would like the element to stay fixed in the center and not scroll with the website select \u2018Fixed in Center\u2019 within the widget.<\/p>\n<p class=\"p1\">5. Done.<\/p>\n<p class=\"p1\">\u00a0<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-38762 size-large lazyload\" data-src=\"https:\/\/storage.googleapis.com\/webdesignledger.pub.network\/WDL\/muse-for-you-browser-centering-widget-adobe-muse-cc-web-design-ledger-970x546.png\" alt=\"Muse For You - Browser Centering Widget - Adobe Muse CC\" width=\"970\" height=\"546\" data-srcset=\"https:\/\/webdesignledger.com\/wp-content\/uploads\/muse-for-you-browser-centering-widget-adobe-muse-cc-web-design-ledger-970x546.png 970w, https:\/\/webdesignledger.com\/wp-content\/uploads\/muse-for-you-browser-centering-widget-adobe-muse-cc-web-design-ledger-500x281.png 500w, https:\/\/webdesignledger.com\/wp-content\/uploads\/muse-for-you-browser-centering-widget-adobe-muse-cc-web-design-ledger-768x432.png 768w, https:\/\/webdesignledger.com\/wp-content\/uploads\/muse-for-you-browser-centering-widget-adobe-muse-cc-web-design-ledger.png 1280w\" data-sizes=\"(max-width: 970px) 100vw, 970px\" src=\"data:image\/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\" style=\"--smush-placeholder-width: 970px; --smush-placeholder-aspect-ratio: 970\/546;\" \/><noscript><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-38762 size-large\" src=\"https:\/\/storage.googleapis.com\/webdesignledger.pub.network\/WDL\/muse-for-you-browser-centering-widget-adobe-muse-cc-web-design-ledger-970x546.png\" alt=\"Muse For You - Browser Centering Widget - Adobe Muse CC\" width=\"970\" height=\"546\" srcset=\"https:\/\/webdesignledger.com\/wp-content\/uploads\/muse-for-you-browser-centering-widget-adobe-muse-cc-web-design-ledger-970x546.png 970w, https:\/\/webdesignledger.com\/wp-content\/uploads\/muse-for-you-browser-centering-widget-adobe-muse-cc-web-design-ledger-500x281.png 500w, https:\/\/webdesignledger.com\/wp-content\/uploads\/muse-for-you-browser-centering-widget-adobe-muse-cc-web-design-ledger-768x432.png 768w, https:\/\/webdesignledger.com\/wp-content\/uploads\/muse-for-you-browser-centering-widget-adobe-muse-cc-web-design-ledger.png 1280w\" sizes=\"(max-width: 970px) 100vw, 970px\" \/><\/noscript><\/p>\n<p class=\"p1\">You now have a centered element on your website. No matter what device the user is on you can be sure that the centered element will be the first thing they see.<\/p>\n<p class=\"p1\">For more video tutorials and widgets for Adobe Muse visit <a href=\"http:\/\/museforyoushop.com\">http:\/\/museforyoushop.com<\/a>.<\/p>\n<p class=\"p1\">Happy Musing :).<\/p>\n","protected":false},"excerpt":{"rendered":"<p>[youtube https:\/\/www.youtube.com\/watch?v=Zb_lIiBsais] Center Your Logo Vertically and Horizontally Within the Browser in Adobe Muse. No Coding Skills Required. \u00a0\u00a0 Branding plays a big part in web design and most websites are branded with a logo and a slogan. A lot of times web designers and developers look for the best way to initially show the [&hellip;]<\/p>\n","protected":false},"author":1897,"featured_media":38761,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[7635,476,7560,31,11],"tags":[615,8082,8950,8701],"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/posts\/38758"}],"collection":[{"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/users\/1897"}],"replies":[{"embeddable":true,"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/comments?post=38758"}],"version-history":[{"count":0,"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/posts\/38758\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/media\/38761"}],"wp:attachment":[{"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/media?parent=38758"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/categories?post=38758"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/webdesignledger.com\/wp-json\/wp\/v2\/tags?post=38758"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}