{"id":2640,"date":"2021-09-13T03:19:50","date_gmt":"2021-09-13T10:19:50","guid":{"rendered":"https:\/\/www.ultimatewb.com\/blog\/?p=2640"},"modified":"2021-09-13T03:19:50","modified_gmt":"2021-09-13T10:19:50","slug":"responsive-app-upgrade","status":"publish","type":"post","link":"https:\/\/www.ultimatewb.com\/blog\/2640\/responsive-app-upgrade\/","title":{"rendered":"Responsive App Upgrade!"},"content":{"rendered":"\n<p>We have recently released an upgrade for the Responsive app in UltimateWB Full, Lite, and Essentials+, upgrade 7.2.<\/p>\n\n\n\n<p>If you are using the non-scrolling top menu feature on your website, with the right\/left sides content added to the menu bar , you will want these new responsive customization options. Namely, you can now update the width of the non-scrolling top menu bar based on a user&#8217;s screen size. No coding necessary &#8211; just update the fields on your admin panel Styles Manager, Responsive section.<\/p>\n\n\n\n<p>You can check this new Responsive app feature out on our website ultimatewb.com &#8211; scroll down and the menu bar jumps to the top, with the UltimateWB logo on the left side of the menu, and the shopping cart icon on the right:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\">    <picture>\n                <source type=\"image\/webp\" srcset=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example1-150x52.webp 150w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example1-500x172.webp 500w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example1-610x210.webp 610w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example1-800x276.webp 800w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example1-1200x413.webp 1200w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example1.webp 1225w\" sizes=\"(max-width: 767px) 100vw, (max-width: 1200px) 90vw, 70vw\">\n                <img src=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example1.jpg\" \n             srcset=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example1-150x52.jpg 150w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example1-500x172.jpg 500w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example1-610x210.jpg 610w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example1-768x265.jpg 768w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example1-800x276.jpg 800w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example1-1200x413.jpg 1200w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example1.jpg 1225w\" \n             sizes=\"(max-width: 767px) 100vw, (max-width: 1200px) 90vw, 70vw\" \n             width=\"1225\" \n             height=\"422\" \n             alt=\"UltimateWB homepage\" \n             loading=\"lazy\" \n              \n             decoding=\"async\" \n             class=\"wp-image-2642\" >\n    <\/picture>\n    <figcaption>UltimateWB homepage<\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\">    <picture>\n                <source type=\"image\/webp\" srcset=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example2-150x42.webp 150w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example2-500x141.webp 500w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example2-610x172.webp 610w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example2-800x226.webp 800w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example2-1200x338.webp 1200w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example2.webp 1220w\" sizes=\"(max-width: 767px) 100vw, (max-width: 1200px) 90vw, 70vw\">\n                <img src=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example2.jpg\" \n             srcset=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example2-150x42.jpg 150w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example2-500x141.jpg 500w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example2-610x172.jpg 610w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example2-768x217.jpg 768w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example2-800x226.jpg 800w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example2-1200x338.jpg 1200w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example2.jpg 1220w\" \n             sizes=\"(max-width: 767px) 100vw, (max-width: 1200px) 90vw, 70vw\" \n             width=\"1220\" \n             height=\"344\" \n             alt=\"UltimateWB homepage, non-scrolling top menu bar\" \n             loading=\"lazy\" \n              \n             decoding=\"async\" \n             class=\"wp-image-2643\" >\n    <\/picture>\n    <figcaption>UltimateWB homepage, scroll down for non-scrolling top menu bar to display at top<\/figcaption><\/figure>\n\n\n\n<p>Resize your internet browser window to simulate a user&#8217;s different device screen size, and you will find that the menu widths adjust accordingly, for a very user friendly experience:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\">    <picture>\n                <source type=\"image\/webp\" srcset=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example3-150x64.webp 150w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example3-500x212.webp 500w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example3-610x259.webp 610w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example3-800x339.webp 800w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example3.webp 905w\" sizes=\"(max-width: 767px) 100vw, 905px\">\n                <img src=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example3.jpg\" \n             srcset=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example3-150x64.jpg 150w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example3-500x212.jpg 500w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example3-610x259.jpg 610w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example3-768x326.jpg 768w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example3-800x339.jpg 800w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example3.jpg 905w\" \n             sizes=\"(max-width: 767px) 100vw, 905px\" \n             width=\"905\" \n             height=\"384\" \n             alt=\"uwb-responsive-example3\" \n             loading=\"lazy\" \n              \n             decoding=\"async\" \n             class=\"wp-image-2647\" >\n    <\/picture>\n    <figcaption>UltimateWB homepage on a smaller device screen size<\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\">    <picture>\n                <source type=\"image\/webp\" srcset=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example4-150x52.webp 150w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example4-500x174.webp 500w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example4-610x212.webp 610w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example4-800x278.webp 800w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example4.webp 903w\" sizes=\"(max-width: 767px) 100vw, 903px\">\n                <img src=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example4.jpg\" \n             srcset=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example4-150x52.jpg 150w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example4-500x174.jpg 500w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example4-610x212.jpg 610w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example4-768x267.jpg 768w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example4-800x278.jpg 800w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example4.jpg 903w\" \n             sizes=\"(max-width: 767px) 100vw, 903px\" \n             width=\"903\" \n             height=\"314\" \n             alt=\"uwb-responsive-example4\" \n             loading=\"lazy\" \n              \n             decoding=\"async\" \n             class=\"wp-image-2648\" >\n    <\/picture>\n    <figcaption>Non-scrolling top menu bar on a smaller screen size<\/figcaption><\/figure>\n\n\n\n<p>And, of course, there is still the Responsive feature geared towards smartphone screen sizes, where the menu button is used rather than the menu row:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\">    <picture>\n                <source type=\"image\/webp\" srcset=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example5-92x150.webp 92w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example5-305x500.webp 305w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example5.webp 366w\" sizes=\"(max-width: 767px) 100vw, 366px\">\n                <img src=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example5.jpg\" \n             srcset=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example5-92x150.jpg 92w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example5-305x500.jpg 305w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example5.jpg 366w\" \n             sizes=\"(max-width: 767px) 100vw, 366px\" \n             width=\"366\" \n             height=\"600\" \n             alt=\"uwb-responsive-example5\" \n             loading=\"lazy\" \n              \n             decoding=\"async\" \n             class=\"wp-image-2649\" >\n    <\/picture>\n    <figcaption>UltimateWB homepage on smartphone device screen sizes<\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\">    <picture>\n                <source type=\"image\/webp\" srcset=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example6-129x150.webp 129w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example6.webp 372w\" sizes=\"(max-width: 767px) 100vw, 372px\">\n                <img src=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example6.jpg\" \n             srcset=\"https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example6-129x150.jpg 129w, https:\/\/www.ultimatewb.com\/blog\/wp-content\/uploads\/uwb-responsive-example6.jpg 372w\" \n             sizes=\"(max-width: 767px) 100vw, 372px\" \n             width=\"372\" \n             height=\"432\" \n             alt=\"uwb-responsive-example6\" \n             loading=\"lazy\" \n              \n             decoding=\"async\" \n             class=\"wp-image-2650\" >\n    <\/picture>\n    <figcaption>Non-scrolling top menu bar on smartphone device screen sizes<\/figcaption><\/figure>\n\n\n\n<p>This new Responsive app upgrade is not applicable to UltimateWB Promo and PromoU, as those two versions don&#8217;t include the left\/right content options for the menu. UltimateWB Promo\/PtomoU do have the non-scrolling top menu feature though, with the option to set the menu width at a different value than the page&#8217;s menu width.<\/p>\n\n\n\n<p>Hope you like the new upgrade! You can test it out on the <a href=\"https:\/\/www.ultimatewb.com\/demolinks\">Demos<\/a>, now available under the ultimatewb.com Features tab on the top menu bar. Any questions, just ask.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>We have recently released an upgrade for the Responsive app in UltimateWB Full, Lite, and Essentials+, upgrade 7.2. If you are using the non-scrolling top menu feature on your website, with the right\/left sides content added to the menu bar &hellip; <a href=\"https:\/\/www.ultimatewb.com\/blog\/2640\/responsive-app-upgrade\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[1543,1542,739],"class_list":["post-2640","post","type-post","status-publish","format-standard","hentry","category-announcements","tag-non-scrolling-top-menu-bar","tag-responsive-app-upgrade","tag-ultimatewb-upgrade"],"_links":{"self":[{"href":"https:\/\/www.ultimatewb.com\/blog\/wp-json\/wp\/v2\/posts\/2640"}],"collection":[{"href":"https:\/\/www.ultimatewb.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.ultimatewb.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.ultimatewb.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.ultimatewb.com\/blog\/wp-json\/wp\/v2\/comments?post=2640"}],"version-history":[{"count":4,"href":"https:\/\/www.ultimatewb.com\/blog\/wp-json\/wp\/v2\/posts\/2640\/revisions"}],"predecessor-version":[{"id":2651,"href":"https:\/\/www.ultimatewb.com\/blog\/wp-json\/wp\/v2\/posts\/2640\/revisions\/2651"}],"wp:attachment":[{"href":"https:\/\/www.ultimatewb.com\/blog\/wp-json\/wp\/v2\/media?parent=2640"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.ultimatewb.com\/blog\/wp-json\/wp\/v2\/categories?post=2640"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.ultimatewb.com\/blog\/wp-json\/wp\/v2\/tags?post=2640"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}