Script AMP HTML CSS Anti Copas Sitemap

Script AMP HTML CSS Anti Copas Sitemap, Berikut ini berisikan kumpulan script yang mungkin berguna bagi kalian dalam membuat website atau blogger.

AMP Iframe Script

Kalian bisa pakai script di bawah ini

<script async custom-element="amp-iframe" src="https://cdn.ampproject.org/v0/amp-iframe-0.1.js"></script>

Kalian bisa gunakan kode berikut untuk memanggil amp-iframe kalian, kalian juga bisa sesuaikan ukurannya sesuai website kalian

<amp-iframe src="linkanda" scrolling="no" style="border:0px;" width="700" height="700" layout="responsive"></amp-iframe>

AMP Youtube Script

Jika kalian ingin mengembed video youtube valid amp bisa gunakan script ini :

<script async='async' custom-element='amp-youtube' src='https://cdn.ampproject.org/v0/amp-youtube-0.1.js'></script>

setelah kalian masukan scirpt nya kalian bisa gunakan kode ini untuk memanggilnya, ganti “idyoutubevideo” dengan id youtobe video kalian contoh “https://www.youtube.com/watch?v=7Mxg4VkkRRI” yang warna ungu itu ganti dengan ID Youtube kalian.

<amp-youtube width="480" height="270" layout="responsive" data-videoid="idyoutubevideo"></amp-youtube>

Script Anti Copy Paste

Berikut ini bisa kalian pake untuk anti copas pada seluruh blog kalian

<script type="text/javascript">
if (typeof document.onselectstart!="undefined") {
document.onselectstart=new Function ("return false");
}
else{
document.onmousedown=new Function ("return false");
document.onmouseup=new Function ("return true");
}
</script >

Scirpt Table Of Content (TOC) Valid AMP

Kalian juga bisa cek lebih detail tentang artikelnya ke sini : https://untilendd.com/table-of-content-toc-valid-amp/

<style>
    /* Table Of Content by https://untilendd.com/ */
    #toc_wrapper {
       background:#ddd;
       max-width:450px;
       position:relative;
       padding:10px;
       border-radius:4px;
       margin:20px 40px;
    }
    .tombol_toc {
       position: relative;
       font-weight: bold;
       outline: none;
    }
    .tombol_toc svg {
       float:right;
    }
    #daftarisi {
       background:#fff;
       padding:10px 10px 0;
       border-radius:4px;
       margin-top:10px;
       -webkit-box-shadow: 0 2px 15px rgba(0,0,0,.05);
       box-shadow:0 2px 15px rgba(0,0,0,.05);
    }
    #daftarisi a {
       text-decoration:none;
    }
    #daftarisi ul {
       padding:0 0 0 20px;
       margin:0
    }
    #daftarisi ul li.lvl1 {
       line-height:1.8em;
       padding:4px 0;
    }
    #daftarisi ul li.lvl1:nth-child(n+2) {
       border-top:1px dashed #ddd;
    }
    #daftarisi ul li.lvl1 a {
       font-weight:600;
    }
    #daftarisi ul li.lvl2 a {
       font-weight:400;
    }
    #daftarisi ul li a:hover {
       text-decoration:underline;
    }
    :target::before {
       content:"";
       display:block;
       height:40px;
       margin-top:-40px;
       visibility:hidden;
    }
</style>
<div id="toc_wrapper">
<div class="tombol_toc" on="tap:daftarisi.toggleVisibility" role='button' tabindex='0'>DAFTAR ISI <svg width="18" height="18" viewBox="0 0 24 24"><path fill="#000000" d="M12,18.17L8.83,15L7.42,16.41L12,21L16.59,16.41L15.17,15M12,5.83L15.17,9L16.58,7.59L12,3L7.41,7.59L8.83,9L12,5.83Z" /></svg></div>
    <div id="daftarisi">
    <ul>
      <li class="lvl1">
        <a href="#toc1" title="Contoh 1">Contoh 1</a>
           <ul>
             <li class="lvl2"><a href="#toc1_1" title="Contoh 2">Contoh 2</a></li>
             <li class="lvl2"><a href="#toc1_2" title="Contoh 3">Contoh 3</a></li>
           </ul>
      </li>
      <li class="lvl1"><a href="#toc_2" title="Contoh 4">Contoh 4</a></li>
      <li class="lvl1"><a href="#toc_3" title="Contoh 5">Contoh 5</a></li>
    </ul>
</div>
</div>

Script CSS Gambar Responsive di Blogger

Cara Gambar Responsive Di Blog kalian :

.separator a{margin-left:0px !important;margin-right:0px !important;}
.post img{max-width:100%;height:auto;}