Chia sẻ code tạo trang đối tác trong Blogger
Mở đầu
Bạn có thể xem demo dưới đây để tham khảo nha
Hướng dẫn
Bước 1: Đăng nhập vào Blogger
Bước 2: Ấn vào Trang ➤ vào tạo trang mới
Bước 3: Các bạn hãy copy đoạn code dưới đây, rồi dán toàn bộ vào phần html
<ol id="stm-widget">
<li class="partner-sites-contact"><h3 class="partner-sites-name">Xuan Trung Blog</h3>
<div class="partner-sites-description">
<center>Thủ Thuật Hay - Công Nghệ Mới - Tool Ưu Việt</center>
<a class="partner-sites-links" href="https://www.xuantrungblog.xyz/" rel="dofollow">Xuan Trung Blog</a></div>
</li>
<li class="partner-sites-contact"><h3 class="partner-sites-name">Code Pro</h3>
<div class="partner-sites-description">
<center>Chia sẻ kiến thức - Tư duy, sáng tạo!</center>
<a class="partner-sites-links" href="https://www.code.pro.vn/" rel="dofollow">Code Pro</a></div>
</li>
<li class="partner-sites-contact"><h3 class="partner-sites-name">HoangLam Blog</h3>
<div class="partner-sites-description">
<center>Blog Description Here</center>
<a class="partner-sites-links" href="https://www.hoanglam.xyz/" rel="dofollow">HoangLam Blog</a></div>
</li>
<li class="partner-sites-contact"><h3 class="partner-sites-name">Your Site Name</h3>
<div class="partner-sites-description">
<center>Blog Description Here</center>
<a class="partner-sites-links" href="#" rel="dofollow">Your Site URL</a></div>
</li>
<li class="partner-sites-contact"><h3 class="partner-sites-name">Your Site Name</h3>
<div class="partner-sites-description">
<center>Blog Description Here</center>
<a class="partner-sites-links" href="#" rel="dofollow">Your Site URL</a></div>
</li>
<li class="partner-sites-contact"><h3 class="partner-sites-name">Your Site Name</h3>
<div class="partner-sites-description">
<center>Blog Description Here</center>
<a class="partner-sites-links" href="#" rel="dofollow">Your Site URL</a></div>
</li>
<li class="partner-sites-contact"><h3 class="partner-sites-name">Your Site Name</h3>
<div class="partner-sites-description">
<center>Blog Description Here</center>
<a class="partner-sites-links" href="#" rel="dofollow">Your Site URL</a></div>
</li>
</ol>
<style type="text/css">
/* New Premium Partner Sites Widget By Www.SmartTechMukesh.Online */
#stm-widget{margin:0;list-style:none;counter-reset:num;display:block;overflow:hidden}
#stm-widget .partner-sites-contact{background:#FFF;width:calc(100% - 35px);border:3px solid #03a9f4;border-radius:10px;margin-bottom:35px;padding:5px 10px;position:relative;float:left;list-style:none;margin:0 0 15px;counter-increment:num}
#stm-widget .partner-sites-contact:before{content:counter(num)!important;font-size:25px;line-height:26px;text-align:center;background:#03a9f4;color:white;border-radius:0 10px 0 10px;font-weight:bold;font-style:italic;display:block;position:absolute;top:-1px;width:30px;height:30px;right:-1px}
#stm-widget .partner-sites-contact:nth-child(even){background:#FFF;width:calc(100% - 35px);border:3px solid #03a9f4;border-radius:10px;margin-bottom:35px;padding:5px 10px;position:relative;float:right;list-style:none;margin:0 0 15px;counter-increment:num}
#stm-widget .partner-sites-contact:nth-child(even):before{border-radius:10px 0 10px 0;top:-1px;left:-1px}
#stm-widget .partner-sites-contact .partner-sites-name{text-align:center}
#stm-widget .partner-sites-contact .partner-sites-description{font-size:16px;margin: 0px 0px 20px 0;}
#stm-widget .partner-sites-contact .partner-sites-links{position:absolute;right:-1px;bottom:0;background:#03a9f4;color:#FFF;padding:0 10px;border-radius:5px 0 0 0;font-size:14px}
#stm-widget .partner-sites-contact:nth-child(even) .partner-sites-links{left:-1px;right:unset;border-radius:0 5px 0 0}
/* Dark Mode Css . Change This Class Name According To You Your Template. */
.darkMode #stm-widget .partner-sites-contact{background:#18191a}
</style>
Các bạn thay lại các đối tác theo ý mình muốn nha!
Lời kết
Okay, hi vọng là bài viết này sẽ hữu ích với bạn, chúc các bạn thành công và đừng quên chia sẻ bài viết này đến nơi rộng rãi nha.
2 comments
image quote pre code