cách tạo quảng cáo thị sai ở giữa bài viết blogger
Xin chào mọi người, nhân dịp này mình sẽ chia sẻ cách tạo quảng cáo thị sai ở giữa bài viết trên blogger.
Cách đây một thời gian, tôi đã cố gắng đặt quảng cáo thị sai trên blog này, đồng thời tôi đã tạo một hướng dẫn đề ph òng trường hợp ai đó cần, bạn có thể xem bản demo qua nút bên dưới.
Vì vậy, quảng cáo thị sai này chỉ xuất hiện trên màn hình di động chứ không phải trên máy tinh để bàn vì loại quảng cáo này ph ù hợp hơn với màn hình di động.
Home ện ở giữa bài mà đúng hơn là ở đầu bài.
Video ũng có thể đặt nó trong đoạn văn về số lượng quảng cáo sẽ được hiển thị , ở đây tôi sử dụng JavaScript thuần túy để hiển thị quảng cáo ở giữa bài mà không hề chạm vào jQuary nên tất nhiên sẽ không ảnh hưởng xấu đến việc tải blog.
Vậy nếu bạn muốn thử làm thì hãy xem cách làm dưới đây nhé.
Cách tạo quảng cáo thị sai ở giữa bài viết trên Blogger
nguyên thư kích thướcđáp ứng và write lại mã data-ad-client< ai= 8> vàdata-ad-slot của bạn .
sau đó vào blogger chọn temavà edit html, sao chép CSS bên dưới và đặt ở trên mã]]></b:skin>Mã hoặc ở trends </style>
/* iklan paralax by wendy code */
.wendyparalax{position:relative;display:block;overflow:visible;width:100%;height:0;margin:auto;text-align:center;z-index:1}
.wendyparalax > div{overflow:hidden;width:100%;height:100%;margin:0;position:absolute;top:0;left:0;clip:rect(auto auto auto auto)}
.wendyparalax > div > div{width:calc(100% - 40px);height:100%;position:fixed;top:0;left:0;right:0;margin:0 auto;-moz-transform:translateZ(0);-webkit-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}
.wendyparalax > div > div > div{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-align-content:center;align-content:center;-webkit-align-items:center;-ms-flex-align:center;width:100%;height:100%;position:absolute;left:0;right:0;top:37px;align-items:center;background:#fff}
.wendyparalax > div > div > div > *{margin:auto}
.wendyparalax > div > div > div > a{width:100%;height:100%}
.wendyparalax img,.wendyparalax iframe,.wendyparalax ins{height:100%;border:0}
.clear{clear:both;display:block}
.wendyparalax{width:100%;min-width:300px;min-height:600px;text-align:center}
.adParallax{width:100%;min-width:300px;min-height:600px;text-align:center;display:block; margin:10px 0px; padding:0px;}
và sao chép mã bên dưới và đặt nó bên dưới mã<data:post.body/>Thông thường có nhiều hơn 1 mã này tùy thuộc vào mẫu bạn sử dụng, vì vậy vui lòng thử từng mã một.
<b:if cond='data:blog.isMobileRequest and data:view.isPost'>
<div class='wendyparalax'>
<div>
<div>
<div>
<ins class='adsbygoogle adParallax' data-ad-client='ca-pub-8802465226xxxxxx' data-ad-slot='290125xxxx' style='display:block'/>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</div>
</div>
<span class='clear'/>
</div>
<script> //<![CDATA[
// munculkan iklan pada pragraf sekian by https://www.wendycode.com
function wendyparalax(Ad1) {let paralax = document.getElementsByClassName ('wendyparalax')[0]; if (paralax) {let Adsp = document.querySelectorAll ('.post-body p')[Ad1 - 1]; Adsp.parentNode .insertBefore (paralax, Adsp.nextSibling)}} wendyparalax(4);/*]]>*/</script></b:if>
vui long thay thế ca-pub-8802465226xxxxxx và data-ad-slot=' 290125xxxx' là của bạn, bạn cũng có thể đặt trong đoạn văn số lượng quảng cáo s ẽ được hiển thị, chú ý đến mãwendyparalax(4);số 4 có nghĩa là quảng cáo sẽ xuất hiện sau đoạn 4 vì vậy hãy thay đổi nó theo nhu cầu của bạn.
Lưu ý
điều quan trọng khi viết bài là sử dụng thẻ <p> khi tạo đoạn văn để rằng quảng cáo có thể xuất hiện.
nếu vậy thì đừng quên nhấp vào lưu và xem kết quả, thế là xong cách tạo quảng cáo thị sai ở giữa bài đăng trên blogger< a i=2> hy vọng nó hữu ích.