Thursday, June 27, 2019

CARA MEMBUAT IKLAN PARALLAX DIAM KETIKA POSTINGAN DI SCROLL

sepatu orthopadi orthoshoping.com sepatu untuk koreksi kaki pengkor/ bengkok pada balita kelainan kaki pada balita arrow
Ads orthoshop info
sepatu orthopadi orthoshoping.com sepatu untuk koreksi kaki pengkor/ bengkok pada balita kelainan kaki pada balita arrow
Ads orthoshop info
Memasang iklan efek diam walaupun postingan di scroll ke Atas. Iklan ini biasanya di sebut iklan parallax. Untuk penempatan iklan parallax biasanya di bagian atas samping postingan blog. Nah kali ini blog ini akan memberikan informasi pembelajaran tentang Coding yaitu pemasangan iklan parallax di blogspot atau blogger.

Untuk ukuran iklan yang biasanya di pakai yaitu ukuran 300×600. Bagi kalian yang ingin memasang nya simak di bawah ini mengenai tutorial memasang script iklan parallax di postingan blog.


Langkah langkah:


1). Masuk ke akun blogger


2). Masuk Tema/ Template- Edit HTML


3). Ketikan CTRL+F dan cari kode <head>.


Copy dan pastekan kode di bawah ini tepat di bawah Kode <head>.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
/*<![CDATA[*/

overflow: visible;
.paralax_div {
position: relative;
width: 300px;

display: inline-block;

height: 250px;
margin-right: 20px;
.paralax_div > div {
float: left;
z-index: 9999;
}

overflow: hidden;
position: absolute;
width: 100%;
height: 100%;
margin: 0;
.paralax_div > div > div {
top: 0;
left: 0;
clip: rect(auto auto auto auto);
}
top: 0;
width: 100%;
height: 100%;
position: fixed;
-webkit-transform: translateZ(0);
margin: 0 auto;
-moz-transform: translateZ(0);
transform: translateZ(0);
-ms-transform: translateZ(0);
-o-transform: translateZ(0);
position: absolute;
}
.paralax_div > div > div > div {
width: 100%;
top: 0;
height: 100vh;
left: 50%;
-ms-transform: translateX(-50%);
border: none;
-moz-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
display: -ms-flexbox;
-o-transform: translateX(-50%);
transform: translateX(-50%);
display: flex;
display: -webkit-flex;
align-items: center;
-webkit-align-content: center;
align-content: center;
-ms-flex-align: center;
-webkit-align-items: center;
background: #ddd;
}
}
.paralax_div > div > div > div > * {
margin: 0;

margin-top: 0;

}
.paralax_div > div > div > div > a {
width: 100%;
height: 100vh;
.paralax_div {
.paralax_div img,.paralax_div iframe,.paralax_div ins {
height: 600px;
width: 300px;
}
.clear {
@media screen and (max-width:640px) {
clear: both;
display: block
}
width: 100%;
-ms-transform: translateX(-50%);
height: 250px;
margin: 0 auto;
float: none;
.paralax_div > div > div > div {
}
left: 50%;
-moz-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
width:auto;
-o-transform: translateX(-50%);
transform: translateX(-50%);
width: 100%;
}
.paralax_div > div > div {
}
left:0;
text-align: center;
max-width:100%;
.paralax_div img {
margin: 0 auto;
</b:if> 
height:auto;
}
}
@media screen and (max-width:320px) {
.paralax_div iframe,.parallax_banner ins {
height:600px;
margin: 0 auto;
width:100%;
}
}

/*]]>*/

</style>

4). Selanjutnya tekan CTRL+F Cari kode <div class='post-body entry-content'.
Copy kode di bawah dan pastekan tepat di atas kode tersebut.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class="paralax_div">
<div>
<div>
<div>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7URZW3LlLB1Oh-7i8zf5un_W6tooB_lxL3h3NnQ43pCFp1Bur0KX7K6nnESdX6pg_HdiAqGX0ZTe-40JkS0onSsy2xmcuqTPeQTAF3p9d7UBHoDdjBHYUIEDAajFBj73TnUq2dbb5Kehk/s300/18835763_10208567628658748_4561466345738187918_n.jpg" alt="banner" width="300" height="600" />
</div>
</div>
</div>
<span class="clear"/>
</div>
</b:if>


5). Ganti kode

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7URZW3LlLB1Oh-7i8zf5un_W6tooB_lxL3h3NnQ43pCFp1Bur0KX7K6nnESdX6pg_HdiAqGX0ZTe-40JkS0onSsy2xmcuqTPeQTAF3p9d7UBHoDdjBHYUIEDAajFBj73TnUq2dbb5Kehk/s300/18835763_10208567628658748_4561466345738187918_n.jpg" alt="banner" width="300" height="600" / 

Dengan script iklan milik kalian

Save dan lihat hasilnya.

Demikian tutorial mengenai cara pemasangan iklan parallax di postingan. Baca juga artikel Cara memasang iklan melayang di bagian bawah blog.

Artikel Terkait:

iklan parallax background cara buat iklan parallax cara membuat iklan adsense parallax membuat iklan parallax di wordpress cara buat iklan parallax cara membuat iklan adsense parallax parallax adsense membuat iklan parallax di wordpress iklan parallax background 


sepatu orthopadi orthoshoping.com sepatu untuk koreksi kaki pengkor/ bengkok pada balita kelainan kaki pada balita arrow
Ads orthoshop info
Posted by at
Labels: ,

No comments:

Post a Comment

Note: Only a member of this blog may post a comment.

Subscribe to: Post Comments (Atom)