Boost your visitor mobile experience with this sticky menu navigation custom made for your Flatsome theme. No plugin needed, just import the pre-made UX Builder shortcode and CSS and modify the icons & links.
Video hướng dẫn của Sebdelaweb
UX Shortcode
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 | [section label="Sticky Mobile Menu" bg_color="rgb(72, 72, 72)" dark="true" padding="5px" video_visibility="visible" class="sticky-mobile-menu"] [row style="collapse" width="custom" custom_width="95%" v_align="equal" padding="10px 0px 10px 0px" depth_hover="4"] [col span="3" span__sm="3"] [featured_box img="https://www.sebdelaweb.com/wp-content/uploads/shopping.png" img_width="25" pos="center" font_size="small" link="#"] <h4>Shop</h4> [/featured_box] [/col] [col span="3" span__sm="3"] [featured_box img="https://www.sebdelaweb.com/wp-content/uploads/discount-badge.png" img_width="25" pos="center" font_size="small" link="#"] <h4>Sale</h4> [/featured_box] [/col] [col span="3" span__sm="3"] [featured_box img="https://www.sebdelaweb.com/wp-content/uploads/menu.png" img_width="25" pos="center" font_size="small" link="#"] <h4>Cart</h4> [/featured_box] [/col] [col span="3" span__sm="3"] [featured_box img="https://www.sebdelaweb.com/wp-content/uploads/avatar.png" img_width="25" pos="center" font_size="small" link="#"] <h4>Account</h4> [/featured_box] [/col] [/row] [/section] |
CSS
1 2 3 4 5 6 7 8 9 10 11 12 | /*************** STICKY MOBILE MENU ***************/ .sticky-mobile-menu { position: fixed; left: 0; bottom: 0; z-index: 999; } .row-box-shadow-4-hover .col-inner:hover { box-shadow: none; } |
Bài viết cùng chủ đề:
Bài viết cùng chuyên mục: