Menu liên hệ ẩn hiện ở dưới cùng màn hình mobile cho blogspot

5/10/2021
Đây là thanh menu liên hệ cố định hoặc ẩn hiện ở phía cuối màn hình mobile chủ yếu cung cấp cho khách truy cập web/blog các địa chỉ cần cho việc liên hệ hoặc trao đổi nhanh, bao gồm các nút như: chat facebook, gọi điện, chát Zalo hay nhắn tin....Và menu này chỉ xuất hiện trên Mobile.

Ở đây chia có 2 loại:

1. Menu cố định ở cuối màn hình mobile
2. Menu ẩn hiện khi cuộn trang.
Khi cuộn xuống menu tạm thời ẩn đi để cho đỡ mất diện tích màn hình, khi cuộn lên menu lại xuất hiện.

Sau đây là hướng dẫn chèn code HTML và CSS vào blogspot để có thanh menu nằm ngang dưới chân trang mobile gồm các nút gọi điện, nhắn tin SMS, nhắn tin Zalo và chat Facebook Messenger.

Bạn hoàn toàn có thể thay đổi icon svg và text khi có nhu cầu sử dụng vào mục đích khác.
Menu liên hệ ẩn hiện ở dưới cùng màn hình mobile cho blogspot
1. Menu cố định ở cuối màn hình mobile

Demo menu cố định.

DEMO

Bước 1:

Dán css vào phần css của blog
.bottom-menu {  
  max-width:450px;
  width:100%;
	position:fixed;
	bottom:0;
	background-color:#FFF;
	display:flex;
	align-items:center;
	justify-content:space-between;	
	padding-top:5px;
    padding-bottom:5px;
	}
.bottom-menu a {
	display:flex;
	flex-direction:column;
	align-items:center;
    flex:1;
	padding:5px;
	color:#666;
  font-weight:bold;
  font-size:12px;
  text-decoration:none;
  transition:all .3s;
}
.bottom-menu a svg{
  margin-bottom:3px;
}
.bottom-menu a.sat {  
  background-color:#ff3f56;
  color:#fff;
  border-radius:100%;
  width:50px;
  height:50px;
  display:flex;
  align-items:center;
  justify-content:center;
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  top:-10px;
  border:6px solid #fff;
}
.bottom-menu a.sat:hover {
  border-color:#ff3f56;
  color:#fff;
}
.bottom-menu a:hover {
  color:#ff3f56;
}
.bottom-menu a:last-child{
	margin-right:0;
	}
span.bosluk {
  flex:1;
}

Bước 2:

Dán code HTML bên dưới vào trước thẻ </body>
<b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>
<div class='bottom-menu'>
	<a class='home' href='#'>
    <svg class='svg' height='24' viewBox='0 0 24 24' width='24'><path d='M21 13v10h-6v-6h-6v6h-6v-10h-3l12-12 12 12h-3zm-1-5.907v-5.093h-3v2.093l3 3z' fill='#ff3f56'/></svg>
    Home
  </a>
	<a href='#'>
    <svg class='svg' clip-rule='evenodd' fill-rule='evenodd' height='24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M12 0c-6.626 0-12 5.372-12 12 0 6.627 5.374 12 12 12 6.627 0 12-5.373 12-12 0-6.628-5.373-12-12-12zm0 5.5c-3.866 0-7 2.902-7 6.481 0 2.04 1.018 3.86 2.609 5.048v2.471l2.383-1.308c.636.176 1.31.271 2.008.271 3.866 0 7-2.902 7-6.482 0-3.579-3.134-6.481-7-6.481zm.696 8.728l-1.783-1.901-3.478 1.901 3.826-4.061 1.826 1.901 3.435-1.901-3.826 4.061z' fill='#3B5998'/></svg>
    Messenger
  </a>
      <span class='bosluk'/>
  <a class='sat' href='#'>
      <svg class='svg' height='24' viewBox='0 0 24 24' width='24'><path d='M3.59 1.322l2.844-1.322 4.041 7.89-2.725 1.341c-.538 1.259 2.159 6.289 3.297 6.372.09-.058 2.671-1.328 2.671-1.328l4.11 7.932s-2.764 1.354-2.854 1.396c-7.861 3.591-19.101-18.258-11.384-22.281zm1.93 1.274l-1.023.504c-5.294 2.762 4.177 21.185 9.648 18.686l.971-.474-2.271-4.383-1.026.5c-3.163 1.547-8.262-8.219-5.055-9.938l1.007-.497-2.251-4.398zm7.832 7.649l2.917.87c.223-.747.16-1.579-.24-2.317-.399-.739-1.062-1.247-1.808-1.469l-.869 2.916zm1.804-6.059c1.551.462 2.926 1.516 3.756 3.051.831 1.536.96 3.263.498 4.813l-1.795-.535c.325-1.091.233-2.306-.352-3.387-.583-1.081-1.551-1.822-2.643-2.146l.536-1.796zm.95-3.186c2.365.705 4.463 2.312 5.729 4.656 1.269 2.343 1.466 4.978.761 7.344l-1.84-.548c.564-1.895.406-4.006-.608-5.882-1.016-1.877-2.696-3.165-4.591-3.729l.549-1.841z' fill='#fff'/></svg>
      Alo
  </a>
  <a href='#'>
      <svg class='wh-messenger-svg-zalo wh-svg-icon svg' height='24' viewBox='0 0 97.4 87.2' width='24' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'>
        <path d='M78.4,42c-1.4,0-2.4,0.6-3.2,1.7c-0.7,1-1,2.2-1,3.7c0,1.5,0.3,2.7,1,3.7c0.8,1.2,1.8,1.7,3.2,1.7 c1.4,0,2.5-0.6,3.2-1.7c0.7-1,1-2.2,1-3.7c0-1.4-0.3-2.6-1-3.6C80.8,42.6,79.7,42,78.4,42z' fill='#19BFE5'/>
        <path d='M48.8,0C21.9,0,0,19.5,0,43.6c0,11.9,5.4,22.7,14,30.6c2.2,2-5.4,10.5-9,11.3c10.4,2.9,20.7-3.4,23.2-2.4 c6.2,2.6,13.2,4,20.5,4c26.9,0,48.7-19.5,48.7-43.6C97.5,19.5,75.7,0,48.8,0z M27.8,58.2H14.6c-3.1,0-4.6-1.1-4.6-3.3 c0-1,0.6-2.4,1.8-4l11.8-15.6h-8.5c-3.1,0-4.7-1-4.7-3c0-2,1.6-3,4.7-3h11.2c3.8,0,5.7,1.1,5.7,3.2c0,1-0.6,2.3-1.9,4L18.5,52.2 h9.3c3.1,0,4.7,1,4.7,3C32.5,57.2,30.9,58.2,27.8,58.2z M54.9,53.8c0,3.1-1.1,4.7-3.2,4.7c-1.4,0-2.4-0.7-3.1-2.2 c-1.3,1.6-3.1,2.4-5.4,2.4c-2.9,0-5.3-1.2-7.2-3.5c-1.7-2.2-2.5-4.8-2.5-7.8c0-3,0.9-5.6,2.7-7.8c1.9-2.3,4.3-3.5,7.3-3.5 c2.2,0,3.9,0.8,5.1,2.3c0.7-1.4,1.8-2,3.1-2c2.1,0,3.2,1.5,3.2,4.6V53.8z M64.7,53.8c0,3.1-1.1,4.7-3.2,4.7c-2.1,0-3.2-1.6-3.2-4.7 V31.9c0-3.1,1.1-4.7,3.2-4.7c2.1,0,3.2,1.6,3.2,4.7V53.8z M78.4,58.9c-3.2,0-5.9-1.1-7.9-3.3c-2-2.2-3-4.9-3-8.1s1-6,3-8.1 c2-2.2,4.7-3.3,7.9-3.3c3.3,0,5.9,1.1,7.9,3.3c1.9,2.1,2.9,4.9,2.9,8.1s-1,6-2.9,8.1C84.2,57.8,81.6,58.9,78.4,58.9z' fill='#19BFE5'/>
        <path d='M44.4,42.2c-1.3,0-2.4,0.5-3.1,1.6c-0.7,1-1,2.1-1,3.5c0,1.4,0.3,2.6,1,3.6c0.8,1.1,1.8,1.7,3.2,1.7 c1.3,0,2.4-0.6,3.1-1.7c0.6-1,1-2.2,1-3.6c0-1.4-0.3-2.5-1-3.5C46.7,42.8,45.7,42.2,44.4,42.2z' fill='#19BFE5'/>
      </svg>
      Zalo
  </a>
   <a href='#'>
      <svg class='svg' height='24' viewBox='0 0 24 24' width='24'><path d='M12 3c5.514 0 10 3.592 10 8.007 0 4.917-5.144 7.961-9.91 7.961-1.937 0-3.384-.397-4.394-.644-1 .613-1.594 1.037-4.272 1.82.535-1.373.722-2.748.601-4.265-.837-1-2.025-2.4-2.025-4.872 0-4.415 4.486-8.007 10-8.007zm0-2c-6.338 0-12 4.226-12 10.007 0 2.05.739 4.063 2.047 5.625.055 1.83-1.023 4.456-1.993 6.368 2.602-.47 6.301-1.508 7.978-2.536 1.417.345 2.774.503 4.059.503 7.084 0 11.91-4.837 11.91-9.961-.001-5.811-5.702-10.006-12.001-10.006zm-4.449 10.151c.246.277.369.621.369 1.034 0 .529-.208.958-.624 1.289-.416.33-.996.495-1.74.495-.637 0-1.201-.123-1.69-.367l.274-1.083c.494.249.993.375 1.501.375.293 0 .521-.056.686-.167.315-.214.334-.646.023-.892-.149-.117-.404-.236-.769-.357-1.097-.366-1.645-.937-1.645-1.716 0-.503.202-.917.604-1.243.404-.325.943-.488 1.614-.488.586 0 1.096.099 1.535.298l-.299 1.049c-.401-.187-.82-.28-1.254-.28-.267 0-.476.052-.627.153-.299.204-.293.57-.035.787.126.107.428.246.91.416.532.187.92.42 1.167.697zm12.205-.021c-.249-.28-.645-.518-1.181-.706-.475-.168-.776-.307-.899-.41-.243-.205-.249-.545.032-.738.146-.099.352-.148.609-.148.464 0 .87.104 1.274.295l.316-1.111-.022-.012c-.441-.199-.962-.3-1.55-.3-.675 0-1.225.166-1.632.495-.41.33-.618.757-.618 1.267 0 .791.562 1.377 1.67 1.745.357.122.612.239.757.353.292.231.28.637-.022.841-.157.108-.381.162-.667.162-.549 0-1.042-.145-1.522-.39l-.29 1.147c.549.273 1.122.38 1.728.38.749 0 1.34-.168 1.759-.502.422-.334.636-.776.636-1.313 0-.418-.127-.772-.378-1.055zm-6.644-3.005l-1.228 3.967-1.014-3.967h-1.791l-.366 5.75h1.229l.204-4.642h.018s.702 2.878 1.178 4.547h1.031c.794-2.419 1.261-3.936 1.399-4.547h.026c0 .813.045 2.36.136 4.642h1.298l-.309-5.75h-1.811z' fill='#23A215'/></svg>
      Nhắn tin
  </a>
</div>
</b:if>

2. Menu ẩn hiện khi cuộn trang.

Demo menu ẩn hiện.

DEMO

Bước 1

Dán css vào phần css của blog
.bottom-menu {  
  max-width:450px;
  width:100%;
	position:fixed;
	bottom:0;
	background-color:#FFF;
	display:flex;
	align-items:center;
	justify-content:space-between;	
	padding-top:5px;
  padding-bottom:5px;
    -webkit-transition-duration:.5s;transition-duration:.5s;
    -webkit-transition-timing-function:cubic-bezier(.215,.61,.355,1);
    transition-timing-function:cubic-bezier(0.25, 0.1, 0.25, 1.0);
    -webkit-transition-property:-webkit-transform;
    transition-property:transform;
	}
.bottom-menu a {
	display:flex;
	flex-direction:column;
	align-items:center;
    flex:1;
	padding:5px;
	color:#666;
  font-weight:bold;
  font-size:12px;
  text-decoration:none;
  transition:all .3s;
}
.bottom-menu a svg{
  margin-bottom:3px;
}
.bottom-menu a.sat {  
  background-color:#ff3f56;
  color:#fff;
  border-radius:100%;
  width:50px;
  height:50px;
  display:flex;
  align-items:center;
  justify-content:center;
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  top:-10px;
  border:6px solid #fff;
}
.bottom-menu a.sat:hover {
  border-color:#ff3f56;
  color:#fff;
}
.bottom-menu a:hover {
  color:#ff3f56;
}
.bottom-menu a:last-child{
	margin-right:0;
	}
span.bosluk {
  flex:1;
}
.bottommenu-hidden{-webkit-transform:translateY(100%);
   -ms-transform:translateY(100%);
   transform:translateY(100%)}

Bước 2

Dán code HTML vào trước thẻ </body>
<b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>
<div class='bottom-menu'>
	<a class='home' href='#'>
    <svg class='svg' height='24' viewBox='0 0 24 24' width='24'><path d='M21 13v10h-6v-6h-6v6h-6v-10h-3l12-12 12 12h-3zm-1-5.907v-5.093h-3v2.093l3 3z' fill='#ff3f56'/></svg>
    Home
  </a>
	<a href='#'>
    <svg class='svg' clip-rule='evenodd' fill-rule='evenodd' height='24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M12 0c-6.626 0-12 5.372-12 12 0 6.627 5.374 12 12 12 6.627 0 12-5.373 12-12 0-6.628-5.373-12-12-12zm0 5.5c-3.866 0-7 2.902-7 6.481 0 2.04 1.018 3.86 2.609 5.048v2.471l2.383-1.308c.636.176 1.31.271 2.008.271 3.866 0 7-2.902 7-6.482 0-3.579-3.134-6.481-7-6.481zm.696 8.728l-1.783-1.901-3.478 1.901 3.826-4.061 1.826 1.901 3.435-1.901-3.826 4.061z' fill='#3B5998'/></svg>
    Messenger
  </a>
      <span class='bosluk'/>
  <a class='sat' href='#'>
      <svg class='svg' height='24' viewBox='0 0 24 24' width='24'><path d='M3.59 1.322l2.844-1.322 4.041 7.89-2.725 1.341c-.538 1.259 2.159 6.289 3.297 6.372.09-.058 2.671-1.328 2.671-1.328l4.11 7.932s-2.764 1.354-2.854 1.396c-7.861 3.591-19.101-18.258-11.384-22.281zm1.93 1.274l-1.023.504c-5.294 2.762 4.177 21.185 9.648 18.686l.971-.474-2.271-4.383-1.026.5c-3.163 1.547-8.262-8.219-5.055-9.938l1.007-.497-2.251-4.398zm7.832 7.649l2.917.87c.223-.747.16-1.579-.24-2.317-.399-.739-1.062-1.247-1.808-1.469l-.869 2.916zm1.804-6.059c1.551.462 2.926 1.516 3.756 3.051.831 1.536.96 3.263.498 4.813l-1.795-.535c.325-1.091.233-2.306-.352-3.387-.583-1.081-1.551-1.822-2.643-2.146l.536-1.796zm.95-3.186c2.365.705 4.463 2.312 5.729 4.656 1.269 2.343 1.466 4.978.761 7.344l-1.84-.548c.564-1.895.406-4.006-.608-5.882-1.016-1.877-2.696-3.165-4.591-3.729l.549-1.841z' fill='#fff'/></svg>
      Alo
  </a>
  <a href='#'>
      <svg class='wh-messenger-svg-zalo wh-svg-icon svg' height='24' viewBox='0 0 97.4 87.2' width='24' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'>
        <path d='M78.4,42c-1.4,0-2.4,0.6-3.2,1.7c-0.7,1-1,2.2-1,3.7c0,1.5,0.3,2.7,1,3.7c0.8,1.2,1.8,1.7,3.2,1.7 c1.4,0,2.5-0.6,3.2-1.7c0.7-1,1-2.2,1-3.7c0-1.4-0.3-2.6-1-3.6C80.8,42.6,79.7,42,78.4,42z' fill='#19BFE5'/>
        <path d='M48.8,0C21.9,0,0,19.5,0,43.6c0,11.9,5.4,22.7,14,30.6c2.2,2-5.4,10.5-9,11.3c10.4,2.9,20.7-3.4,23.2-2.4 c6.2,2.6,13.2,4,20.5,4c26.9,0,48.7-19.5,48.7-43.6C97.5,19.5,75.7,0,48.8,0z M27.8,58.2H14.6c-3.1,0-4.6-1.1-4.6-3.3 c0-1,0.6-2.4,1.8-4l11.8-15.6h-8.5c-3.1,0-4.7-1-4.7-3c0-2,1.6-3,4.7-3h11.2c3.8,0,5.7,1.1,5.7,3.2c0,1-0.6,2.3-1.9,4L18.5,52.2 h9.3c3.1,0,4.7,1,4.7,3C32.5,57.2,30.9,58.2,27.8,58.2z M54.9,53.8c0,3.1-1.1,4.7-3.2,4.7c-1.4,0-2.4-0.7-3.1-2.2 c-1.3,1.6-3.1,2.4-5.4,2.4c-2.9,0-5.3-1.2-7.2-3.5c-1.7-2.2-2.5-4.8-2.5-7.8c0-3,0.9-5.6,2.7-7.8c1.9-2.3,4.3-3.5,7.3-3.5 c2.2,0,3.9,0.8,5.1,2.3c0.7-1.4,1.8-2,3.1-2c2.1,0,3.2,1.5,3.2,4.6V53.8z M64.7,53.8c0,3.1-1.1,4.7-3.2,4.7c-2.1,0-3.2-1.6-3.2-4.7 V31.9c0-3.1,1.1-4.7,3.2-4.7c2.1,0,3.2,1.6,3.2,4.7V53.8z M78.4,58.9c-3.2,0-5.9-1.1-7.9-3.3c-2-2.2-3-4.9-3-8.1s1-6,3-8.1 c2-2.2,4.7-3.3,7.9-3.3c3.3,0,5.9,1.1,7.9,3.3c1.9,2.1,2.9,4.9,2.9,8.1s-1,6-2.9,8.1C84.2,57.8,81.6,58.9,78.4,58.9z' fill='#19BFE5'/>
        <path d='M44.4,42.2c-1.3,0-2.4,0.5-3.1,1.6c-0.7,1-1,2.1-1,3.5c0,1.4,0.3,2.6,1,3.6c0.8,1.1,1.8,1.7,3.2,1.7 c1.3,0,2.4-0.6,3.1-1.7c0.6-1,1-2.2,1-3.6c0-1.4-0.3-2.5-1-3.5C46.7,42.8,45.7,42.2,44.4,42.2z' fill='#19BFE5'/>
      </svg>
      Zalo
  </a>
   <a href='#'>
      <svg class='svg' height='24' viewBox='0 0 24 24' width='24'><path d='M12 3c5.514 0 10 3.592 10 8.007 0 4.917-5.144 7.961-9.91 7.961-1.937 0-3.384-.397-4.394-.644-1 .613-1.594 1.037-4.272 1.82.535-1.373.722-2.748.601-4.265-.837-1-2.025-2.4-2.025-4.872 0-4.415 4.486-8.007 10-8.007zm0-2c-6.338 0-12 4.226-12 10.007 0 2.05.739 4.063 2.047 5.625.055 1.83-1.023 4.456-1.993 6.368 2.602-.47 6.301-1.508 7.978-2.536 1.417.345 2.774.503 4.059.503 7.084 0 11.91-4.837 11.91-9.961-.001-5.811-5.702-10.006-12.001-10.006zm-4.449 10.151c.246.277.369.621.369 1.034 0 .529-.208.958-.624 1.289-.416.33-.996.495-1.74.495-.637 0-1.201-.123-1.69-.367l.274-1.083c.494.249.993.375 1.501.375.293 0 .521-.056.686-.167.315-.214.334-.646.023-.892-.149-.117-.404-.236-.769-.357-1.097-.366-1.645-.937-1.645-1.716 0-.503.202-.917.604-1.243.404-.325.943-.488 1.614-.488.586 0 1.096.099 1.535.298l-.299 1.049c-.401-.187-.82-.28-1.254-.28-.267 0-.476.052-.627.153-.299.204-.293.57-.035.787.126.107.428.246.91.416.532.187.92.42 1.167.697zm12.205-.021c-.249-.28-.645-.518-1.181-.706-.475-.168-.776-.307-.899-.41-.243-.205-.249-.545.032-.738.146-.099.352-.148.609-.148.464 0 .87.104 1.274.295l.316-1.111-.022-.012c-.441-.199-.962-.3-1.55-.3-.675 0-1.225.166-1.632.495-.41.33-.618.757-.618 1.267 0 .791.562 1.377 1.67 1.745.357.122.612.239.757.353.292.231.28.637-.022.841-.157.108-.381.162-.667.162-.549 0-1.042-.145-1.522-.39l-.29 1.147c.549.273 1.122.38 1.728.38.749 0 1.34-.168 1.759-.502.422-.334.636-.776.636-1.313 0-.418-.127-.772-.378-1.055zm-6.644-3.005l-1.228 3.967-1.014-3.967h-1.791l-.366 5.75h1.229l.204-4.642h.018s.702 2.878 1.178 4.547h1.031c.794-2.419 1.261-3.936 1.399-4.547h.026c0 .813.045 2.36.136 4.642h1.298l-.309-5.75h-1.811z' fill='#23A215'/></svg>
      Nhắn tin
  </a>
</div>
</b:if>

Bước 3

Dán tiếp javascript bên dưới vào ngay sau code bước 2 ở trên
<script>
//<![CDATA[
 ;( function ( document, window, index )
 {
  'use strict';
  var elSelector  = '.bottom-menu',
   elClassHidden = 'bottommenu-hidden',
   throttleTimeout = 500,
   element   = document.querySelector( elSelector );
  if( !element ) return true;
  var dHeight   = 0,
   wHeight   = 0,
   wScrollCurrent = 0,
   wScrollBefore = 0,
   wScrollDiff  = 0,
   hasElementClass  = function( element, className ){ return element.classList ? element.classList.contains( className ) : new RegExp( '(^| )' + className + '( |$)', 'gi' ).test( element.className ); },
   addElementClass  = function( element, className ){ element.classList ? element.classList.add( className ) : element.className += ' ' + className; },
   removeElementClass = function( element, className ){ element.classList ? element.classList.remove( className ) : element.className = element.className.replace( new RegExp( '(^|\\b)' + className.split( ' ' ).join( '|' ) + '(\\b|$)', 'gi' ), ' ' ); },
   throttle = function( delay, fn )
   {
    var last, deferTimer;
    return function()
    {
     var context = this, args = arguments, now = +new Date;
     if( last && now < last + delay )
     {
      clearTimeout( deferTimer );
      deferTimer = setTimeout( function(){ last = now; fn.apply( context, args ); }, delay );
     }
     else
     {
      last = now;
      fn.apply( context, args );
     }
    };
   };
  window.addEventListener( 'scroll', throttle( throttleTimeout, function()
  {
   dHeight   = document.body.offsetHeight;
   wHeight   = window.innerHeight;
   wScrollCurrent = window.pageYOffset;
   wScrollDiff  = wScrollBefore - wScrollCurrent;
   if( wScrollCurrent <= 0 ) // scrolled to the very top; element sticks to the top
    removeElementClass( element, elClassHidden );
   else if( wScrollDiff > 0 && hasElementClass( element, elClassHidden ) ) // scrolled up; element slides in
    removeElementClass( element, elClassHidden );
   else if( wScrollDiff < 0 ) // scrolled down
   {
    if( wScrollCurrent + wHeight >= dHeight && hasElementClass( element, elClassHidden ) ) // scrolled to the very bottom; element slides in
     removeElementClass( element, elClassHidden );
    else // scrolled down; element slides out
     addElementClass( element, elClassHidden );
   }
   wScrollBefore = wScrollCurrent;
  }));
 }( document, window, 0 ));
//]]>
</script>

Trong đó:

Các đường link thì bạn tìm hiểu tự lấy và thay vào.

Nút Messenger có thể là Fanpage hoặc facebook cá nhân
Ví dụ link facebook cá nhân có dạng: https://www.facebook.com/profile.php?id=xxxxxxxxxxxx
"xxxxxxxxxxxxx" là ID fb cá nhân của bạn.
Hoặc chat facebook có dạng: https://m.me/xxxxxxx
Link zalo: https://m.me/yyyy (yyyy là số điện thoại của bạn)
Nhắn tin: sms:xxxx
Gọi điện: tel:xxxx
Cái này bạn tự tìm hiểu và điền vào hộ mình.


Một số menu chính của blogspot có sử dụng javascript và jquery hỗ trợ có thể bị lỗi không xổ được khi cài đặt menu này cũng như vài tiện ích có thể bị ảnh hưởng nên bạn cần cân nhắc trước khi dùng.