Như các bạn cũng đã biết, Safelink của theme Plus UI tạo link trên đường dẫn bài viết của mình, khi truy cập sẽ dẫn đến trang chính của blog rồi xác nhận người dùng không phải là người máy. Thực hiện qua nhiều bước mục đích tăng lượt xem bài viết nhiều hơn và rất chuyên nghiệp, và chỉ dùng được đối với mẫu Plus UI.
Mình có xem bài viết của blog.doisong24.com có hướng dẫn cách thêm Safelink mẫu theme Plus UI sử dụng cho tất cả các mẫu theme khác trên blogger, nhưng còn thiếu trình tạo Safelink và mã dư thừa.
Vì vậy mình viết bài viết này để thêm chức năng cũng như loại bỏ một số mã dư thừa để tránh nặng theme như:
- Xóa phần Widget licensi key.
- Thêm trình tạo Safelink.
- Chỉnh sửa lại CSS cho phù hợp.
Hướng dẫn thực hiện Safelink của Plus UI
Bước 1: Trước hết Đăng nhập vào Trang tổng quan Blogger.
Bước 2: Trên bảng điều khiển Blogger, nhấp vào Chủ đề.
Bước 3: Nhấp vào biểu tượng mũi tên xuống bên cạnh nút 'TÙY CHỈNH'.
Bước 4: Nhấp vào Chỉnh sửa HTML, bạn sẽ được chuyển đến trang chỉnh sửa.
Bước 5: Bây giờ tìm kiếm mã ]]></b:skin> hoặc ]]>*/</style> và dán các mã CSS sau ngay trên vào nó.
/* Human Verification */
.hmv{position:relative;background:var(--synBg);border:var(--synBd-line) solid var(--synBd-color);border-radius:var(--synBd-radius);padding:20px 20px;margin-bottom:20px;text-align:center;overflow:hidden}
.hmv::before{content:'';position:absolute;z-index:0;top:0;right:0;bottom:0;left:0;opacity:.06}
.hmv::after{content:'';width:60px;height:60px;background:rgba(0,0,0,.15);display:block;border-radius:50px;position:absolute;top:-12px;left:-12px;opacity:.1}
.hmv >*{position:relative;z-index:1}
.hmv .hmvH{font-size:1.2rem;font-weight:700;margin-bottom:15px}
.hmv .hmvD{font-size:13px;opacity:.8;display:inline-flex;align-items:center}
.hmv .hmvD svg{width:13px;height:13px;margin-right:5px}
.hmv:not(.alt) .buttons,.hmv.alt .hmvH.bef,.hmv:not(.alt) .hmvH.aft,.hmv.alt .hmvD{display:none}
.is-dark .hmv::before{background:#252526;opacity:1}
.buttons{display:inline-flex;align-items:center;padding:12px 15px;outline:0;border:0;border-radius:50px;line-height:20px;color:#ffffff;background:var(--themeLink);font-size:14px;white-space:nowrap;overflow:hidden;max-width:320px}Bước 6: Tiếp tục tìm kiếm mã: </head> hoặc <!--</head>--></head>, và thêm mã bên dưới vào trên nó.
<!--[ Safelink Random GiaHuy.net ]-->
<b:if cond='data:view.isSingleItem'>
<style>/*<![CDATA[*/ /* Scroll to Continue */ .aSlT,.aSlB{display:none;align-items:center;justify-content:center;text-align:center}.aSlP{display:block;position:relative;height:40px;width:100%;display:none;align-items:center;justify-content:center;z-index:0;border-radius:10px;overflow:hidden}.aSlP::before{content:'';position:absolute;top:0;right:0;bottom:0;left:0;background:#482dff;opacity:.5}.aSlW{position:absolute;top:0;bottom:0;left:0;width:0;background:#482dff;opacity:.6;transition:width 1s ease}.aSlP > span{position:absolute;color:#fffdfc;font-size:15px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.aScr{display:none;position:relative;width:100%;border-radius:10px;padding:15px 20px;text-align:center;overflow:hidden}.aScr::after{content:'';width:60px;height:60px;background:rgba(0,0,0,.6);display:block;border-radius:50px;position:absolute;top:-12px;left:-12px;opacity:.1}.aScr::before{content:'';position:absolute;z-index:0;top:0;right:0;bottom:0;left:0;background:#482dff;opacity:.06}.aScr .hglt{cursor:pointer;color:var(--lightLink)}.aScr .aScrH{position:relative;z-index:1;font-size:1.2rem;font-weight:700;margin-bottom:5px}.aScr .aScrD{position:relative;z-index:1;font-size:13px;opacity:.8;display:inline-flex;align-items:center}.aScr .aScrD svg{width:13px;height:13px;margin-right:5px;stroke-width:1.5}.aSlT.vsbl,.aSlB.vsbl,.aSlT:not(.alt) .aSlP{display:flex}.aSlT.alt .aScr{display:block}.aSlT.nInt .aSlP > span{font-size:13px}.Rtl .aSlW{left:unset;right:0}.Rtl .aScr .aScrD svg{margin-right:0;margin-left:5px}.is-dark .aSlP::before{background:#252526;opacity:1}.is-dark .aSlW{background:#2d2d30;opacity:1}.is-dark .aScr{background:#252526}.is-dark .aScr::before{background:#2d2d30;opacity:1}.is-dark .aScr .hglt{color:#41B375}.icon{flex-shrink:0;display:inline-flex}.icon::before{content:'';width:18px;height:18px;background-size:18px;background-repeat:no-repeat;background-position:center}.icon::after{content:'';padding:0 2px 0 0}.icon.demo::before{background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fefefe' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5'><path d='M7.39999 6.32003L15.89 3.49003C19.7 2.22003 21.77 4.30003 20.51 8.11003L17.68 16.6C15.78 22.31 12.66 22.31 10.76 16.6L9.91999 14.08L7.39999 13.24C1.68999 11.34 1.68999 8.23003 7.39999 6.32003Z'/><path d='M10.11 13.6501L13.69 10.0601'/></svg>")} /*]]>*/</style>
</b:if>Bước 7: Tiếp tục thêm mã Script bên dưới vào trên thẻ: </head> hoặc <!--</head>--></head>.
<!--[ Safelink Random GiaHuy.net ]-->
<script>/*<![CDATA[*/ var Pu={kS:"MBDRTNFJCAPOSQEIGWLHVYZUKXmbdrtnfjcaposqeigwlhvyzukx3508749216+/=",en:function(e){var r,t,o,n,a,c,h="",i=0;for(e=Pu.u8_en(e);i<e.length;)o=(c=e.charCodeAt(i++))>>2,n=(3&c)<<4|(r=e.charCodeAt(i++))>>4,a=(15&r)<<2|(t=e.charCodeAt(i++))>>6,c=63&t,isNaN(r)?a=c=64:isNaN(t)&&(c=64),h=h+this.kS.charAt(o)+this.kS.charAt(n)+this.kS.charAt(a)+this.kS.charAt(c);return h},de:function(e){var r,t,o,n,a,c="",h=0;for(e=e.replace(/[^A-Za-z0-9+/=]/g,"");h<e.length;)r=this.kS.indexOf(e.charAt(h++))<<2|(o=this.kS.indexOf(e.charAt(h++)))>>4,t=(15&o)<<4|(n=this.kS.indexOf(e.charAt(h++)))>>2,o=(3&n)<<6|(a=this.kS.indexOf(e.charAt(h++))),c+=String.fromCharCode(r),64!=n&&(c+=String.fromCharCode(t)),64!=a&&(c+=String.fromCharCode(o));return Pu.u8_de(c)},u8_en:function(e){e=e.replace(/\r\n/g,"\n");for(var r="",t=0;t<e.length;t++){var o=e.charCodeAt(t);o<128?r+=String.fromCharCode(o):(127<o&&o<2048?r+=String.fromCharCode(o>>6|192):(r+=String.fromCharCode(o>>12|224),r+=String.fromCharCode(o>>6&63|128)),r+=String.fromCharCode(63&o|128))}return r},u8_de:function(e){for(var r="",t=0,o=c1=c2=0;t<e.length;)(o=e.charCodeAt(t))<128?(r+=String.fromCharCode(o),t++):191<o&&o<224?(r+=String.fromCharCode((31&o)<<6|63&(c2=e.charCodeAt(t+1))),t+=2):(r+=String.fromCharCode((15&o)<<12|(63&(c2=e.charCodeAt(t+1)))<<6|63&(c3=e.charCodeAt(t+2))),t+=3);return r},gC:function(e){return(e=document.cookie.match(RegExp("(?:^|; )"+e.replace(/([.$?*|{}()[]\/+^])/g,"$1")+"=([^;]*)")))?decodeURIComponent(e[1]):void 0},sC:function(e,r,t={}){(t={path:"/",...t}).expires instanceof Date&&(t.expires=t.expires.toUTCString());let o=unescape(encodeURIComponent(e))+"="+unescape(encodeURIComponent(r));for(var n in t){o+="; "+n;var a=t[n];!0!==a&&(o+="="+a)}document.cookie=o},dC:function(e){var r={};r["max-age"]=-1,Pu.sC(e,"",r)},sLS:function(e,r){localStorage.setItem(e,r)},gLS:function(e){return localStorage.getItem(e)},rLS:function(e){localStorage.removeItem(e)},sSS:function(e,r){sessionStorage.setItem(e,r)},gSS:function(e){return sessionStorage.getItem(e)},rSS:function(e){sessionStorage.removeItem(e)},rdm:function(e){return e[Math.floor(Math.random()*e.length)]},abv:function(e){var r=Math.sign(Number(e));return 1e9<=Math.abs(Number(e))?r*(Math.abs(Number(e))/1e9).toFixed(2)+"B":1e6<=Math.abs(Number(e))?r*(Math.abs(Number(e))/1e6).toFixed(2)+"M":1e3<=Math.abs(Number(e))?r*(Math.abs(Number(e))/1e3).toFixed(2)+"K":Math.abs(Number(e))},gAj:function(e){var r=new XMLHttpRequest;try{r=new XMLHttpRequest}catch(t){try{r=new ActiveXObject("Msxml2.XMLHTTP")}catch(o){try{r=new ActiveXObject("Microsoft.XMLHTTP")}catch(n){return console.warn("Something went wrong!"),!1}}}r.onreadystatechange=function(){var t;4==r.readyState&&(200==r.status?(t=r.responseText,e.success(t)):"function"==typeof e.error&&e.error(r))},r.open("GET",e.url,e.async),r.send()}};function getid(e){return document.getElementById(e)}function getclass(e){return document.getElementsByClassName(e)}function qSel(e){return document.querySelector(e)}function qSell(e){return document.querySelectorAll(e)}function addCt(e,r){return e.classList.add(r)}function remCt(e,r){return e.classList.remove(r)}function stS(e){window.scroll({top:getid(e).offsetTop-20,left:0,behavior:"smooth"})}function stC(e){var r={};r.behavior="smooth",r.block="center",getid(e).scrollIntoView(r)}function stE(e){var r={};r.behavior="smooth",r.block="end",getid(e).scrollIntoView(r)}function ldJs(e,r,t,o,n){let a=document.createElement("script");a.id=r,a.async=t,a.src=e,n&&(a.onload=n),qSel(o).appendChild(a)}function ldCss(e,r,t){let o=document.createElement("link");o.id=r,o.rel="stylesheet",o.type="text/css",o.href=e,t&&(o.onload=t),document.head.appendChild(o)}var b64={_keyStr:"MNBVCXZLKJHGFDSAPOIUYTREWQmnbvcxzlkjhgfdsapoiuytrewq0987654321+/=",enc:function(e){var r,t,o,n,a,c,h="",i=0;for(e=b64._utf8_enc(e);i<e.length;)o=(c=e.charCodeAt(i++))>>2,n=(3&c)<<4|(r=e.charCodeAt(i++))>>4,a=(15&r)<<2|(t=e.charCodeAt(i++))>>6,c=63&t,isNaN(r)?a=c=64:isNaN(t)&&(c=64),h=h+this._keyStr.charAt(o)+this._keyStr.charAt(n)+this._keyStr.charAt(a)+this._keyStr.charAt(c);return h},dec:function(e){var r,t,o,n,a,c="",h=0;for(e=e.replace(/[^A-Za-z0-9+/=]/g,"");h<e.length;)r=this._keyStr.indexOf(e.charAt(h++))<<2|(o=this._keyStr.indexOf(e.charAt(h++)))>>4,t=(15&o)<<4|(n=this._keyStr.indexOf(e.charAt(h++)))>>2,o=(3&n)<<6|(a=this._keyStr.indexOf(e.charAt(h++))),c+=String.fromCharCode(r),64!=n&&(c+=String.fromCharCode(t)),64!=a&&(c+=String.fromCharCode(o));return b64._utf8_dec(c)},_utf8_enc:function(e){e=e.replace(/\r\n/g,"\n");for(var r="",t=0;t<e.length;t++){var o=e.charCodeAt(t);o<128?r+=String.fromCharCode(o):(127<o&&o<2048?r+=String.fromCharCode(o>>6|192):(r+=String.fromCharCode(o>>12|224),r+=String.fromCharCode(o>>6&63|128)),r+=String.fromCharCode(63&o|128))}return r},_utf8_dec:function(e){for(var r="",t=0,o=c1=c2=0;t<e.length;)(o=e.charCodeAt(t))<128?(r+=String.fromCharCode(o),t++):191<o&&o<224?(r+=String.fromCharCode((31&o)<<6|63&(c2=e.charCodeAt(t+1))),t+=2):(r+=String.fromCharCode((15&o)<<12|(63&(c2=e.charCodeAt(t+1)))<<6|63&(c3=e.charCodeAt(t+2))),t+=3);return r}}; /*]]>*/</script>
<!--[ Safelink Random GiaHuy.net ]-->Bước 8: Tiếp tục hãy thêm HTML phía dưới vào trên thẻ: </body>. Nếu bạn không tìm thấy nó, nó có thể đã được phân tích cú pháp </body>.
<!--[ Safelink ]-->
<script><b:eval expr='"const blogUrl='" + data:blog.canonicalHomepageUrl + "';" + "const isPost='" + (data:view.isPost ? true : false) + "';"'/></script>
<script>/*<![CDATA[*/ /* Safelink Settings GiaHuy.Net */ var aSl={par:'url',hcd:5000,gcd:15000,nwt:!1,sby:'published',mxr:20,pwt:'Đang lấy liên kết của bạn...',}
!function(){var e,t,n,r,l=qSell(".safeL");function a(e){let t=window.location.hash;if(t&&t.includes("=")&&t.split(/=(.*)/s)[0]=="#?"+e&&""!=t.split(/=(.*)/s)[1])return window.location.hash.split(/=(.*)/s)[1]}function o(e){var t=window.location.search;let n=new URLSearchParams(t);return n.has(e)?n.get(e):void 0}0<l.length&&l.forEach(e=>{e.addEventListener("click",function(e){e.preventDefault();var t=e.target.getAttribute("href"),e=e.target.getAttribute("data-href");null!=(e=null!=t&&"/"!=t&&"#"!=t&&""!=t?t:null!=e&&"#"!=e&&""!=e?e:void 0)&&(e=b64.enc(e),e=blogUrl+"#?"+aSl.par+"="+e,1==aSl.nwt?window.open(e,"_blank"):window.location.href=e)})}),null==a(aSl.par)&&null==o(aSl.par)||(l=null!=a(aSl.par)?b64.dec(a(aSl.par)):b64.dec(o(aSl.par)),e=blogUrl.replace(/.*?:\/\//g,"//")+"feeds/posts/summary?alt=json&orderby="+aSl.sby+"&max-results="+aSl.mxr,Pu.sSS("SAFE_L",l),0<(l=window.location.toString()).indexOf("#")&&(l=l.substring(0,l.indexOf("#")),window.history.replaceState({},document.title,l)),Pu.gAj({url:e,async:!0,success:function(e){if((e=JSON.parse(e).feed).entry&&0!==e.entry.length){for(var t,n,r=(e=e.entry)[Math.floor(Math.random()*e.length)],l=0,a=r.link.length;l<a;l++)"alternate"==(n=r.link[l]).rel&&(t=n.href);remCt(getid("hmVrfy"),"hidden"),qSel("#hmVrfy .pstL").href=t,setTimeout(function(){addCt(getid("hmVrfy"),"alt")},aSl.hcd)}else toastNotif("No post was found")}})),null!=Pu.gSS("SAFE_L")&&"true"==isPost&&(e=Pu.gSS("SAFE_L"),n=t=Math.floor(aSl.gcd/1e3),qSel(".safeGoL").href=e,1==aSl.nwt&&qSel(".safeGoL").setAttribute("target","_blank"),addCt(getid("aSlCnt"),"vsbl"),r=setInterval(function(){var e=--n/t*100;qSel(".aSlW").style.width=100-e+"%",qSel(".aSlCd").innerHTML=Math.floor(n),n<=0&&(clearInterval(r),qSel(".aSlCd").innerHTML="0",setTimeout(()=>{qSel(".aSlC").innerHTML=aSl.pwt},1e3),setTimeout(()=>{addCt(qSel(".aSlB"),"vsbl"),addCt(getid("aSlCnt"),"alt")},4e3))},1e3),qSel(".safeGoL").addEventListener("click",function(){Pu.rSS("SAFE_L")}))}(),null!==qSel(".aScr")&&qSel(".aScr").addEventListener("click",()=>{setTimeout(()=>{qSel(".safeGoL").scrollIntoView({behaviour:"smooth",block:"center",inline:"center"})},200)}); /*]]>*/</script>Bước 9: Tiếp tục hãy thêm HTML bên dưới vào phía dưới thẻ: </header>.
<!--[ Safelink Random GiaHuy.net ]-->
<b:if cond='data:view.isHomepage'>
<!--[ Human verification ]-->
<div class='hmv hidden' id='hmVrfy'>
<div class='hmvH bef'>Xác minh bạn không phải là Robot</div>
<div class='hmvH aft'>Bạn có phải là robot không?</div>
<div class='hmvD'><svg viewBox='0 0 50 50' x='0px' y='0px'><path d='M25.251,6.461c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615V6.461z'><animateTransform attributeName='transform' attributeType='xml' dur='0.6s' from='0 25 25' repeatCount='indefinite' to='360 25 25' type='rotate'/></path></svg>
Đang tạo liên kết... Vui lòng đợi
</div>
<a class='buttons pstL' href='/'>Tôi không phải là robot</a>
</div>
</b:if>
<!--[ Safelink Random GiaHuy.net ]-->Bước 10: Tiếp tục tìm thẻ: <data:post.body/> thường có nhiều hơn 1 mã, tùy thuộc vào mẫu bạn đang sử dụng bạn phải thử từng mã 1. Đặt mã bên dưới lên trên.
<!-- Đặt mã này phía trên mã <data:post.body/> -->
<!--[ Safelink Random ]-->
<b:if cond='data:view.isPost'>
<!--[ Safelink Countdown Timer ]-->
<div class='aSlT' id='aSlCnt'>
<div class='aSlP'>
<div class='aSlW'/>
<span class='aSlC'>Vui lòng chờ <span class='aSlCd'>0</span> giây...</span>
</div>
<div class='aScr'>
<div class='aScrH'>Cuộn xuống và nhấp vào <span class='hglt'>Chuyển đến liên kết</span> cho điểm đến</div>
<div class='aScrD'><svg class='line' viewbox='0 0 24 24'><path d='M22 11.07V12a10 10 0 1 1-5.93-9.14'/><polyline points='23 3 12 14 9 11'/></svg>
Chúc mừng! Liên kết được tạo
</div>
</div>
</div>
</b:if>
<!--[ Safelink Random GiaHuy.net ]-->Bước 11: Thêm mã bên dưới vào dưới mã: <data:post.body/>.
<!-- Đặt mã này phía dưới mã <data:post.body/> -->
<!--[ Safelink Random ]-->
<b:if cond='data:view.isPost'>
<!--[ Safelink Destination Button ]-->
<div class='aSlB'>
<a class='buttons safeGoL' href='/' title='Chuyển đến liên kết'><i class='icon demo'/>Chuyển đến liên kết</a>
</div>
</b:if>
<!--[ Safelink Random GiaHuy.net ]-->Bước 12: Lưu các thay đổi bằng cách nhấp vào biểu tượng này .
Cách tạo bài đăng Auto Safelink
Thêm mã bên dưới vào bài đăng của bạn [HTMLmode].
<div style='text-align:center'><a class='button safeL' href='#' data-href='Your_url_here'><i class='icon demo'></i>View Demo</a></div>Tạo công cụ get link Safelink
Bước 1: Trên bảng điều khiển Blogger, nhấp vào Trang.
Bước 2: Nhấp vào biểu tượng dấu cộng + bên cạnh nút 'TRANG MỚI'.
Bước 3: Nhấp vào 'Chế độ xem HTML'.
Bước 4: Sau đó sao chép mã từ tập lệnh bên dưới và dán nó vào đó.
<!--[ Safelink Random GiaHuy.net ]-->
<script>
/*<![CDATA[*/
/* SafeLink settings */
var safeSet = {
safePar: "#?url",
succNtf: "<i class='check'></i>Link Protected, Click on Copy",
entrNtf: "<i class='warn'></i>Enter link to protect!",
cpydNtf: "<i class='clipboard'></i>Copied to clipboard!",
};
/* SafeLink scripts */(function(){for(var t=qSell('.widget input[type=text], .widget input[type=email], .widget textarea'),n=0;n<t.length;n++)t[n].addEventListener('input',function(){var t=this.value?'fl':'nfl';this.setAttribute('data-text',t)});var f=getid('safeIn'),a=getid('safeOut'),e=getid('safeGen'),u=getid('safeCpy'),i=getid('safeViw');f.addEventListener('blur',function(){var t=f.value;return(~t.indexOf('https://')||~t.indexOf('http://')||''==t||(t='https://'+t),(f.value=t),f)}),e.addEventListener('click',function(){var n,r;''!=f.value?((n=b64.enc(f.value)),(r=blogUrl+safeSet.safePar+'='+n),(a.value=r),a.setAttribute('data-text','fl'),(i.onclick=function(){window.open(r,'_blank')}),remCt(u,'hidden'),remCt(i,'hidden'),toastNotif(safeSet.succNtf)):toastNotif(safeSet.entrNtf)}),u.addEventListener('click',function(){a.value;var r=getSelection();r.removeAllRanges(),a.select(),document.execCommand('copy'),r.removeAllRanges(),toastNotif(safeSet.cpydNtf)})})();Bước 5: Đặt tiêu đề cho trang, sau đó Xuất trang bằng cách nhấp vào Xuất bản.
Trên đây là hướng dẫn tiện ích Safelink Plus UI cho tất cả mẫu Blogger.
Nếu có bất cứ thắc mắc nào hãy comment ngay phía dưới cho mình biết nhé.
Tham khảo: blog.doisong24.com
Đăng nhận xét