Hướng dẫn làm popup nhanh chóng không cần cài thêm plugin

Hôm nay topweb.store sẽ hướng dẫ các bạn làm popup nhanh chóng không cần cài thêm plugin.

Để làm được điều này, các bạn chỉ cần copy đoạn code sau vào <head> trong file header.php của theme.

<script >

var link_image = ‘URL hinh_anh_popup’;
var link = ‘URL duong_dan_dich_cua_popup’;
var icon_close = ‘data: image / png;
base64, iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAMAAABHPGVmAAAABGdBTUEAALGPC / xhBQAAAAFzUkdCAK7OHOkAAABjUExURQAAAHoqKJETEsAWFYwNDZQICYMlI0dFQdkREXcuK9QSEoMcG5gbGoYSEpYYGNcSEZkaGYsREcgVFagWFZgICNITEskSEtsREHIuLMEZGMAaGYYSEr0bGscZGM8VFH8SEqQWFrMI1wgAAAAadFJOUwBFwNP + /iYE/Q85l3jxWLE33aii6n1a4W / rvkm7xQAABJlJREFUaN61mueaqyAQhlFRwJpo1EQs5 / 6 v8qBrpShY5nn2z + 4 mb4YpfDMGgDOG0N + P1GL3DW6wPYZnQ / pG4BZDRPZLAL4upDQEN0Gkv + vdoNQGjxnDBrS3DwHoMQZ5DwzoPcZgSQUHhvt6hjG8aTAwOtd7LBiA2H9 + fJ45q6FeLHdAdJ9n / BgYgS5jr1EcvMxeGMi4uPQY3luXwewVpkmWJWkW + iZEC44M95BBcqfCTd3gqm7a5pcWRJMx9KqBcVgfOa6rtTVV7eQ6 / gQzwz9geGW7ZQycps78I8ZYHbSD8dGpYgmjGs7NifdSYmxWPeOouXutlDFyfl8kx7C + Ho0MesgAiZIxcNoyljNeCyM7Yvi7jMEcX8KI6cw4vqSKQwbLtUzoF + HMoO / jdI + bQ0gfmz6hkZSh09w9XGlYXZW + 3 A / X0qnZpKn0LJs9iVcMPWXiNa0epMXjh46jhRFo9lGvbOpK78zS3plwYcA30e7XOW71MM3vNeqeP4bRjU5CR4tTV9jpVgH5Gl4 / Lz1O868zDQiXAt8Et / oQeFaOEivFu2mwQLrogjTZ56wgxTWdQ6xExZkhXQYuGwpLKWeCdJ97lOIrw0xXKCDsvr1Jj7LyaTl3Zoh9oyL1U1XgP68b1a7vKOoksm6kgMJZQrOCdLC4DdHLcEfaVigNzql0uRZt5JDOzW7zxWoVkL9xGpmey6H64yHQbLhSMYizvgF4CEsykzFR9Z / ZRvGLEAqvp3K8nSokEEqvthhOltWtE4kU95ovpOS6SklQ5lKBc2kNwSs / HA4rrXG + WsmWC77kXA9unT9JbAlnBk + 3 S2GsaOMp1UOXg8BTrR8Bwo2rVZ0uJTVtUxaMd4YBEuH69dZ / jq / 7 gkDOM + p8u4IkmcvXvinDFxiYrB0hq5WH / szFmdPwI2ohrG034xBr / bZhtYS8YG1K6Tt4n1UCQDOKhfkBDKuWDsGKEhlpcIdP31Ytr5eJnmmYUD / qIRZU3U7jQMEc / ygKdRniSDzVoep0Z2eiT6wJESfi + mBjtDSA6K3TLAkoBKldJxqrr9kXT4MBSrEOfY2EnI4sso + 29 ayQxXVLm2rdom84UcARg / yEiGBLr6UGWuXSN6SvkFpYewSNx8DAYF97SRxp9C9X773IZKXHsjqsHRMtatNpFNuhlOKkWBhpkTGXlX2f3UW5uOsoTZ4foXlzmCk2pGQ9isz5m5uKKmuQTPCryi1fnKqx2a2K0PR4C8okX59bgZi / pmua / o3R0MpkYVHkr7ls6z + trcpjxGv4Puy / MyqXvSZjvrii3mdxT8WQ5Gen2f5aFicklqk / sf + eFLmDLx2bKRFPt6pz / VfVL6EsjyW98QsuWEo7 / kkwApm4Hby2p7Eht6hkx + WcuHYPpBXtXpxIERhVfnHmJDZ1uKFHzK3rz3IdbtSz2ttya + VL4HEC + Grf0lhCCMdV + eCGVeP2Hby6uXDvai5tED / 4 pHcw + H6 / HUVP9639xVAorgbut216tSF4xDbn9SPPQIrmxr6lHn9Wl3sBHrJVPZbPfVunmGKPX + A5G0agWj2232Ne8qt / yZ3fpfkPLjkNSsPf3E8AAAAASUVORK5CYII = ’;

function closePopupBeta() {
document.getElementById(“popup_banner_beta”).remove(), setCookie(“showPopupBannerBeta”, 1, 1)
}

function setCookie(e, n, o) {
var t = ””;
if (o) {
var i = new Date;
i.setTime(i.getTime() + 24 * 60 * 60 * 1000), t = ”;
expires = ”+i.toUTCString()
}
document.cookie = e + ” = ”+(n || ””) + t + ”;
path = /”}function getCookie(e){for(var n=e+”=”,o=document.cookie.split(“;”),t=0;t<o.length;t++){for(var i=o[t];” “==i.charAt(0);)i=i.substring(1,i.length);if(0==i.indexOf(n))return i.substring(n.length,i.length)}return null}1!=getCookie(“showPopupBannerBeta”)&&(document.addEventListener(“DOMContentLoaded”, function(event) { var e='<div id=”popup_banner_beta”><div onclick=”closePopupBeta()” class=”mask_popup_banner_beta”></div > < div class = ”content_popup_banner_beta” > < img src = ”‘+icon_close + '” class=”close_icon” onclick=”closePopupBeta()” alt=”Close Image”><a target=”_blank” href=”‘+link+'” > < img src = ”‘+link_image + '” alt=”Image Popup Banner”/></a></div></div>’;setTimeout(function(){document.body.innerHTML+=e},10000)}));

</script>

<style>
#popup_banner_beta
{
height: 100vh;
left: 0;
position: fixed;
top: 0;
width: 100%;
z-index: 99999;
}
.mask_popup_banner_beta
{
background: rgba(0,0,0,.38);
cursor: pointer;
height: 100vh;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: 9;
}
.content_popup_banner_beta
{
left: 50%;
moz-transform: translate(-50%,-50%);
o-transform: translate(-50%,-50%);
position: absolute;
top: 50%;
transform: translate(-50%,-50%);
webkit-transform: translate(-50%,-50%);
z-index: 10;
}
.close_icon
{
cursor: pointer;
position: absolute;
right: -60px;
top: -70px;
width: 70px;
}
@media only screen and (max-width:480px)
{
.content_popup_banner_beta
{
width: 300px;
}
.content_popup_banner_beta a img:nth-of-type(1)
{
width: 100%;
}
.close_icon
{
right: -20px;
top: -60px;
width: 50px;
}
}

Như vậy là ok rồi đó.

Chúc các bạn thành công!

 

 

 

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *