Code nút liên hệ website wordpress phần 3
Với việc chúng ta cái 1 plugin sẽ rất tiện lợi nhưng nó sẽ không cho các bạn custom trên cái mãu sẵn đó ! nhìn nó không đẹp nên mình thấy code HTML và Css vào cho lẹ mà nhẹ hơn plugin 1 xíu thôi !
Trước tiên các bạn cài Plugin này của việt nam nhưng nó có đầy đủ tính năng bạn cần mà không cần code nhiều wp-extra nó sẽ giúp bạn chèn mã vào Footer Scripts và css nhanh chóng
![Code nút liên hệ website wordpress phần 3 20 Code Nút Liên Hệ Website WordPress](https://nguyenthaimmo.com/wp-content/uploads/2023/12/Screenshot-2023-12-16-093012-Nguyen-thai-mmo-1024x424.png)
Code Nút Liên Hệ Website WordPress
- Code liên hệ mẫu 1
![Code nút liên hệ website wordpress phần 3 21 Code Nút Liên Hệ Website WordPress Phần 3](https://nguyenthaimmo.com/wp-content/uploads/2023/12/Screenshot-2023-12-16-180336-Nguyen-thai-mmo-528x1024.png)
Code Nút Liên Hệ Website WordPress Phần 3
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 | <div class="lienhe-top"> <div class="contact"> <a href="Link chèn vô fb" target="_blank" title="Facebook" class="fb"> <svg class="flex" xmlns="http://www.w3.org/2000/svg" width="36" height="36" viewBox="0 0 36 36" fill="none"> <path d="M18.0015 3.00293C9.71849 3.00293 3.00299 9.71843 3.00299 18.0014C3.00299 25.4864 8.48699 31.6904 15.6585 32.8199V22.3379H11.8485V18.0014H15.6585V14.6969C15.6585 10.9349 17.898 8.86043 21.3225 8.86043C22.9635 8.86043 24.6825 9.15293 24.6825 9.15293V12.8414H22.7865C20.9265 12.8414 20.3445 13.9994 20.3445 15.1859V17.9984H24.501L23.8365 22.3349H20.3445V32.8169C27.516 31.6934 33 25.4879 33 18.0014C33 9.71843 26.2845 3.00293 18.0015 3.00293Z" fill="#333333"></path> </svg> </a> <a href="Link chèn vô fb" target="_blank" title="Messenger" class="mess"> <svg class="flex" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" width="36" height="36" x="0" y="0" viewBox="0 0 100 100" style="enable-background:new 0 0 512 512" xml:space="preserve"> <g> <g xmlns="http://www.w3.org/2000/svg" id="_x33_4.Messenger"> <path id="Icon_78_" d="m50 10c-22.1 0-40 16.6-40 37.1 0 11.7 5.8 22.1 14.9 28.9l.2 13c0 .7.8 1.1 1.4.8l12.5-7c3.5.9 7.2 1.4 11.1 1.4 22.1 0 40-16.6 40-37.1s-18.1-37.1-40.1-37.1zm2.9 49.2-8.5-8.9c-.5-.5-1.3-.6-1.9-.3l-15 8.1c-.6.3-1.1-.4-.7-.9l17.7-18.8c.5-.5 1.4-.5 1.9 0l8.5 9.1c.5.5 1.3.7 1.9.3l14.7-8c.6-.3 1.1.4.7.9l-17.4 18.5c-.5.5-1.4.5-1.9 0z" fill="#333333" data-original="#333333" class=""></path> </g> </g> </svg> </a> <a href="Link chèn vô fb" target="_blank" title="Telegram" class="tele"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" width="35px" height="35px"><path d="M25,2c12.703,0,23,10.297,23,23S37.703,48,25,48S2,37.703,2,25S12.297,2,25,2z M32.934,34.375c0.423-1.298,2.405-14.234,2.65-16.783c0.074-0.772-0.17-1.285-0.648-1.514c-0.578-0.278-1.434-0.139-2.427,0.219c-1.362,0.491-18.774,7.884-19.78,8.312c-0.954,0.405-1.856,0.847-1.856,1.487c0,0.45,0.267,0.703,1.003,0.966c0.766,0.273,2.695,0.858,3.834,1.172c1.097,0.303,2.346,0.04,3.046-0.395c0.742-0.461,9.305-6.191,9.92-6.693c0.614-0.502,1.104,0.141,0.602,0.644c-0.502,0.502-6.38,6.207-7.155,6.997c-0.941,0.959-0.273,1.953,0.358,2.351c0.721,0.454,5.906,3.932,6.687,4.49c0.781,0.558,1.573,0.811,2.298,0.811C32.191,36.439,32.573,35.484,32.934,34.375z"></path></svg> </a> <a href="Link chèn vô fb" target="_blank" title="Zalo" class="zalo"> <svg width="35" height="35" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50"> <path d="M 9 4 C 6.2504839 4 4 6.2504839 4 9 L 4 41 C 4 43.749516 6.2504839 46 9 46 L 41 46 C 43.749516 46 46 43.749516 46 41 L 46 9 C 46 6.2504839 43.749516 4 41 4 L 9 4 z M 9 6 L 15.580078 6 C 12.00899 9.7156859 10 14.518083 10 19.5 C 10 24.66 12.110156 29.599844 15.910156 33.339844 C 16.030156 33.549844 16.129922 34.579531 15.669922 35.769531 C 15.379922 36.519531 14.799687 37.499141 13.679688 37.869141 C 13.249688 38.009141 12.97 38.430859 13 38.880859 C 13.03 39.330859 13.360781 39.710781 13.800781 39.800781 C 16.670781 40.370781 18.529297 39.510078 20.029297 38.830078 C 21.379297 38.210078 22.270625 37.789609 23.640625 38.349609 C 26.440625 39.439609 29.42 40 32.5 40 C 36.593685 40 40.531459 39.000731 44 37.113281 L 44 41 C 44 42.668484 42.668484 44 41 44 L 9 44 C 7.3315161 44 6 42.668484 6 41 L 6 9 C 6 7.3315161 7.3315161 6 9 6 z M 33 15 C 33.55 15 34 15.45 34 16 L 34 25 C 34 25.55 33.55 26 33 26 C 32.45 26 32 25.55 32 25 L 32 16 C 32 15.45 32.45 15 33 15 z M 18 16 L 23 16 C 23.36 16 23.700859 16.199531 23.880859 16.519531 C 24.050859 16.829531 24.039609 17.219297 23.849609 17.529297 L 19.800781 24 L 23 24 C 23.55 24 24 24.45 24 25 C 24 25.55 23.55 26 23 26 L 18 26 C 17.64 26 17.299141 25.800469 17.119141 25.480469 C 16.949141 25.170469 16.960391 24.780703 17.150391 24.470703 L 21.199219 18 L 18 18 C 17.45 18 17 17.55 17 17 C 17 16.45 17.45 16 18 16 z M 27.5 19 C 28.11 19 28.679453 19.169219 29.189453 19.449219 C 29.369453 19.189219 29.65 19 30 19 C 30.55 19 31 19.45 31 20 L 31 25 C 31 25.55 30.55 26 30 26 C 29.65 26 29.369453 25.810781 29.189453 25.550781 C 28.679453 25.830781 28.11 26 27.5 26 C 25.57 26 24 24.43 24 22.5 C 24 20.57 25.57 19 27.5 19 z M 38.5 19 C 40.43 19 42 20.57 42 22.5 C 42 24.43 40.43 26 38.5 26 C 36.57 26 35 24.43 35 22.5 C 35 20.57 36.57 19 38.5 19 z M 27.5 21 C 27.39625 21 27.29502 21.011309 27.197266 21.03125 C 27.001758 21.071133 26.819727 21.148164 26.660156 21.255859 C 26.500586 21.363555 26.363555 21.500586 26.255859 21.660156 C 26.148164 21.819727 26.071133 22.001758 26.03125 22.197266 C 26.011309 22.29502 26 22.39625 26 22.5 C 26 22.60375 26.011309 22.70498 26.03125 22.802734 C 26.051191 22.900488 26.079297 22.994219 26.117188 23.083984 C 26.155078 23.17375 26.202012 23.260059 26.255859 23.339844 C 26.309707 23.419629 26.371641 23.492734 26.439453 23.560547 C 26.507266 23.628359 26.580371 23.690293 26.660156 23.744141 C 26.819727 23.851836 27.001758 23.928867 27.197266 23.96875 C 27.29502 23.988691 27.39625 24 27.5 24 C 27.60375 24 27.70498 23.988691 27.802734 23.96875 C 28.487012 23.82916 29 23.22625 29 22.5 C 29 21.67 28.33 21 27.5 21 z M 38.5 21 C 38.39625 21 38.29502 21.011309 38.197266 21.03125 C 38.099512 21.051191 38.005781 21.079297 37.916016 21.117188 C 37.82625 21.155078 37.739941 21.202012 37.660156 21.255859 C 37.580371 21.309707 37.507266 21.371641 37.439453 21.439453 C 37.303828 21.575078 37.192969 21.736484 37.117188 21.916016 C 37.079297 22.005781 37.051191 22.099512 37.03125 22.197266 C 37.011309 22.29502 37 22.39625 37 22.5 C 37 22.60375 37.011309 22.70498 37.03125 22.802734 C 37.051191 22.900488 37.079297 22.994219 37.117188 23.083984 C 37.155078 23.17375 37.202012 23.260059 37.255859 23.339844 C 37.309707 23.419629 37.371641 23.492734 37.439453 23.560547 C 37.507266 23.628359 37.580371 23.690293 37.660156 23.744141 C 37.739941 23.797988 37.82625 23.844922 37.916016 23.882812 C 38.005781 23.920703 38.099512 23.948809 38.197266 23.96875 C 38.29502 23.988691 38.39625 24 38.5 24 C 38.60375 24 38.70498 23.988691 38.802734 23.96875 C 39.487012 23.82916 40 23.22625 40 22.5 C 40 21.67 39.33 21 38.5 21 z"></path> </svg> </a> </div> <a href="#" class="go-to-top top-lienhe"><svg viewBox="64 64 896 896" focusable="false" data-icon="vertical-align-top" width="20px" height="20px" fill="#fff" aria-hidden="true"> <path d="M859.9 168H164.1c-4.5 0-8.1 3.6-8.1 8v60c0 4.4 3.6 8 8.1 8h695.8c4.5 0 8.1-3.6 8.1-8v-60c0-4.4-3.6-8-8.1-8zM518.3 355a8 8 0 00-12.6 0l-112 141.7a7.98 7.98 0 006.3 12.9h73.9V848c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V509.7H624c6.7 0 10.4-7.7 6.3-12.9L518.3 355z"> </path> </svg></a> <style> .lienhe-top { position: fixed; top: 50%; right: 5px; z-index: 9; } .contact { display: flex; flex-direction: column; background: #fff; padding: 10px; border-radius: 50px; box-shadow: 0px 0px 3px #273647; } a.go-to-top.top-lienhe { margin-top: 10px; background: #273647; padding: 18px; border-radius: 50px; /* box-shadow: 0px 0px 3px #273647; */ display: flex; position: fixed; } </style> |
Bạn thay link liên hệ của mình vào là được nhé !
Xem thêm
- Mẫu code liên hệ mẫu 2
![Code nút liên hệ website wordpress phần 3 22 Code Nút Liên Hệ Website WordPress Phần 3](https://nguyenthaimmo.com/wp-content/uploads/2023/12/code-lien-he-Nguyen-thai-mmo-574x1024.png)
Code Nút Liên Hệ Website WordPress Phần 3
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 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 | <div id="tem-sup-quick"> <div class="tem-sup-btn">Trung tâm<br>Hỗ trợ</div> <i id="icon-arr" class="fas fa-hand-point-left"></i> <div class="tem-sup-option"> <a class="ticket-option"> <span>Yêu cầu mở website</span> </a> <a href="Link facebook" class="fb-option" target="_blank">Chat Facebook</a> <a href="tel:0980000000" class="call-option">Gọi ngay</a> </div> </div> <script> jQuery(document).ready(function(){ jQuery('.tem-sup-option').hide(); jQuery('.tem-sup-btn').click(function(){ jQuery('.tem-sup-option').toggle(); }); jQuery(".ticket-option").click(function(e){ e.stopPropagation(); }); jQuery(".tem-sup-btn").click(function(e){ e.stopPropagation(); }); jQuery(document).click(function(){ jQuery(".tem-sup-option").hide(); }); }); </script> <style> #tem-sup-quick{ display: flex; flex-direction: column; background-color: #fff; position: fixed; width: 66px; height: auto!important; left: 0; bottom: 20px; z-index: 998; border: solid 1px #e3e3e3; border-radius: 5px; border-top-right-radius: 0px; font-size: 12px; box-shadow: 2px 2px 2px #ccc; text-align: center; color: #333; } .tem-sup-btn{ padding: 10px 0; font-weight: bold; cursor: move; line-height: 1.3em; color: #333; } .tem-sup-option{ padding: 0; background:#fff; } .tem-sup-option a{ display: block; padding: 55px 0 7px 0; color: #333; font-size: 11px; line-height: 1; } .tem-sup-option a.fb-option{background: url(https://tuongads.com/wp-content/uploads/2019/12/c.png) no-repeat center 5px;} .tem-sup-option a.fb-option:hover{background: url(https://tuongads.com/wp-content/uploads/2019/12/c.png) no-repeat center 5px #ccc;} .tem-sup-option a.call-option{background: url(https://tuongads.com/wp-content/uploads/2019/12/b.png) no-repeat center 5px;} .tem-sup-option a.call-option:hover{background: url(https://tuongads.com/wp-content/uploads/2019/12/b.png) no-repeat center 5px #ccc;} .tem-sup-option a.ticket-option{background: url(https://tuongads.com/wp-content/uploads/2019/12/a.png) no-repeat center 5px;} .tem-sup-option a.ticket-option:hover{background: url(https://tuongads.com/wp-content/uploads/2019/12/a.png) no-repeat center 5px #ccc;} .ticket-option{ position: relative; display: block; cursor: pointer; } .ticket-form-hid{ position: absolute; max-width: 270px; width: 270px; height:auto; background: #fff; left: 0; margin-left: 80px; top: 0; box-shadow: 0 0 5px #ccc; } a.close-ticket{ width: 25px; height: 25px; padding: 0; z-index: 1; background: #fff; position: absolute; top: -10px; right: -10px; border: 1px solid #e5e5e5; border-radius: 50%; text-align: center; line-height: 25px; cursor: pointer; box-shadow: 0 0 5px #ccc; } #icon-arr{ width: 16px; cursor: pointer; height: 24px; line-height: 24px; background: #fff; color: #007bfc; border-top-right-radius: 5px; border-bottom-right-radius: 5px; position: absolute; z-index: 1; margin-left: 64px; margin-top: -1px; border-top: solid 1px #e3e3e3; border-right: solid 1px #e3e3e3; border-bottom: solid 1px #e3e3e3; box-shadow: 1px 1px 1px #ccc; } </style> |
Có Thể Bạn Quan Tâm:
- 1. https://nguyenthaimmo.com/hosting
- 2. https://nguyenthaimmo.com/vultr
- Hosting/vps việt nam
- 1. https://nguyenthaimmo.com/vietnix
- 2. https://nguyenthaimmo.com/inet
- 3. https://nguyenthaimmo.com/azdigi
- 4. https://nguyenthaimmo.com/hostingviet