Dokumentasi Template AniFilm

1. Post Info

Buat Post Baru Dengan HTML Berikut. bagian yang di tandai dapat kalian ganti. Dan untuk generator otomatis nya harus menunggu dulu.

<div class="boxSinopsis">
  <div class="boxHeader">
    <h1 class="title">Cowboy Bebop</h1>
    <h2 class="subTitle">カウボーイビバップ</h2>
    <div class="images">
      <figure>
        <img src="https://cdn.myanimelist.net/images/anime/4/19644.jpg" alt="Cowboy Bebop">
      </figure>
    </div>
    <p class="description">In the year 2071, humanity has colonized several of the planets and moons of the solar system leaving the now uninhabitable surface of planet Earth behind. The Inter Solar System Police attempts to keep peace in the galaxy, aided in part by outlaw bounty hunters, referred to as "Cowboys." The ragtag team aboard the spaceship Bebop are two such individuals. Mellow and carefree Spike Spiegel is balanced by his boisterous, pragmatic partner Jet Black as the pair makes a living chasing bounties and collecting rewards. Thrown off course by the addition of new members that they meet in their travels—Ein, a genetically engineered, highly intelligent Welsh Corgi; femme fatale Faye Valentine, an enigmatic trickster with memory loss; and the strange computer whiz kid Edward Wong—the crew embarks on thrilling adventures that unravel each member's dark and mysterious past little by little. Well-balanced with high density action and light-hearted comedy, Cowboy Bebop is a space Western classic and an homage to the smooth and improvised music it is named after. [Written by MAL Rewrite]</p>
  </div>
  <div class="boxFooter">
    <div class="rating" itemscope="itemscope" itemprop="aggregateRating" itemtype="//schema.org/AggregateRating">
      <meta itemprop="worstRating" content="1">
      <meta itemprop="bestRating" content="10">
      <div class="rt">
        <div class="tenStar">
          <span style="width:87%"></span>
        </div>
        <p>(Score: <strong itemprop="ratingValue">8.77</strong>, Users: <strong itemprop="ratingCount">687227</strong>)</p>
      </div>
    </div>
    <div class="info">
      <span class="musim">Spring 1998</span>
      <span class="type">TV</span>
      <span class="studios">Sunrise</span>
    </div>
  </div>
  <div class="boxBackground">
    <img src="https://cdn.myanimelist.net/images/anime/4/19644.jpg" alt="Cowboy Bebop">
  </div>
</div>
<div class="boxInfo">
  <div class="navInfo">
    <span class="btnBoxInfo" data-id="navInfox">Information</span>
    <span class="btnBoxInfo" data-id="navTrailerx">Trailer</span>
    <span class="btnBoxInfo" data-id="navDownloadx">Downloads</span>
    <span class="btnBoxInfo" data-id="navStreamingx">Streaming</span>
  </div>
  <div class="infoItem" id="navInfox">
    <div class="infoxLeft">
      <ul>
        <li><strong>Episode: </strong>26</li>
        <li><strong>Genre: </strong>Action, Adventure, Space</li>
        <li><strong>Source: </strong>Original</li>
      </ul>
    </div>
    <div class="infoxRight">
      <ul>
        <li><strong>Aired: </strong>Apr 3, 1998 to Apr 24, 1999</li>
        <li><strong>Duration: </strong>24 min per ep</li>
        <li><strong>Rating: </strong>R - 17+ (violence & profanity)</li>
      </ul>
    </div>
  </div>
  <div class="infoItem" id="navTrailerx">
    <div class="Trailerx">
      <div class="pembed">
        <iframe data-src="https://www.youtube.com/embed/qig4KOK2R2g?enablejsapi=1&wmode=opaque&autoplay=1" frameborder="0" marginwidth="0" marginheight="0" scrolling="NO" width="100%" height="100%" allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true"></iframe>
      </div>
    </div>
  </div>
  <div class="infoItem" id="navDownloadx">

    <!-- Tempel Disini Menu Download -->

  </div>
  <div class="infoItem" id="navStreamingx">

    <!-- Tempel Disini Menu Streaming -->

  </div>
  <div class="infoBackground"></div>
</div>

1.1. Streaming Code

Ini tempat nya bisa di post Eps atau Di gabung dengan HTML Post Info.

<div class="gomuStrem">
  <div class="gPembed">
    <div class="resGomu" id="resGomu">
      <iframe loading="lazy" src="" frameborder="0" marginwidth="0" marginheight="0" scrolling="NO" width="100%" height="100%" allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true" name="search_iframe"></iframe>
      <div class="gomuPly">
        <div id="gomuPly"></div>
      </div>
    </div>
  </div>
  <div class="gData">
    <div class="gSel">
      <select id="gomuSelect" class="gomuSelect" onchange="aniStrem(this)" name="gomuSelect">
        <option disabled="" selected="">Select Video Server</option>
        <option id="gomuDefault" value="https://www.youtube.com/embed/hiHwoITyuPg">Youtube</option>
        <option value="https://www.youtube.com/embed/NFiyx61NVOM">Nama Server2</option>
      </select>
    </div>
    <div class="gDow">
      <div class="gCinema gLight" id="gCinema"><span>Turn off Light</span></div>
      <div class="gDL" id="gDL"><span><a href="#urldownload">Download</a></span></div>
    </div>
  </div>
</div>
<div id="gomuShadow"></div>

1.2. Download Code

Sama seperti bagian streaming

<div class="mctnx">
  <div class="soraddl dlone">
    <div class="sorattl collapsible">
      <h3>Episode 1</h3>
    </div>
    <div class="content">
      <div class="soraurl">
        <div class="res">360p</div>
        <div class="slink">
          <a href="#google" rel="nofollow noopener noreferrer">Google Drive</a>
          <a href="#acefile.co" rel="nofollow noopener noreferrer">AceFile</a>
          <a href="#kbagi.com" rel="nofollow noopener noreferrer">KumpulBagi</a>
        </div>
      </div>
      <div class="soraurl">
        <div class="res">480p</div>
        <div class="slink">
          <a href="#google" rel="nofollow noopener noreferrer">Google Drive</a>
          <a href="#acefile.co" rel="nofollow noopener noreferrer">AceFile</a>
          <a href="#kbagi.com" rel="nofollow noopener noreferrer">KumpulBagi</a>
        </div>
      </div>
      <div class="soraurl">
        <div class="res">720p</div>
        <div class="slink">
          <a href="#google" rel="nofollow noopener noreferrer">Google Drive</a>
          <a href="#acefile.co" rel="nofollow noopener noreferrer">AceFile</a>
          <a href="#kbagi.com" rel="nofollow noopener noreferrer">KumpulBagi</a>
        </div>
      </div>
    </div>
  </div>
</div>

1.3. Episode List

Taruh Di bagian Menu Streaming

<div class="epListV2" id="epListV2">
  <script>
    epListV2.run('NamaLabel')
  </script>
</div>

1.4. Pemberian Label

Yang Paling Penting ada 3 sisa nya terserah mau apa aja.

  • Label Episode misal: .Eps 01, .Eps 02 (Pastikan label nya ada di urutan Pertama)
  • Label Rating misal: 7.87, 9.01 (Pastikan label nya ada di urutan kedua)
  • Label Kategori pilih salah satu: Anime, Donghua, Live Action, W-Series, Movie, K-Drama, Series

Sisa nya terserah mau apa aja ok.

2. Post Episode

Terserah mau di isi bagaimana klo yang ada di demo hanya Code Streaming dan Download saja.

2.1. Pemberian Label

Maksimal di beri 4 Label.

  • * Label Episode (sama seperti post info)
  • Label Judul: ini untuk next prev nya terserah tulisan nya seperti apa.
  • Label Hot: tulis aja Hot
  • Label Quality pilih salah satu: TV, BD, Uncensored, Bluray, HD

3. Slider

Tinggal pasang script dan HTML berikut di dalam widget nya.

<div class="aF_Loading"></div>
<div class='sliderV2' id='sliderV2'>
  <script>
    sliderV2.run('Nama Label', jumlahPost);
  </script>
</div>

4. Custom Post

Ada Dua Type pakai Scroll atau Default, Tinggal pasang script dan HTML berikut di dalam widget nya.

4.1. Scroll

Untuk menggunakan fungsi ini jumlah post harus lebih dari 7.

<div class="multiplePost custom" id="outputDiv">
  <script>
    afCustomPost.run('outputDiv', 'namaLabel', jumlahPost, 'scroll');
  </script>
</div>
<button onclick="sB(this)" class="scrollButton left">
  <svg viewbox="0 0 24 24">
    <path fill="currentColor" d="M22,12A10,10 0 0,1 12,22A10,10 0 0,1 2,12A10,10 0 0,1 12,2A10,10 0 0,1 22,12M20,12A8,8 0 0,0 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20A8,8 0 0,0 20,12M15.4,16.6L10.8,12L15.4,7.4L14,6L8,12L14,18L15.4,16.6Z" />
  </svg>
</button>
<button onclick="sN(this)" class="scrollButton right">
  <svg viewbox="0 0 24 24">
    <path fill="currentColor" d="M22,12A10,10 0 0,1 12,22A10,10 0 0,1 2,12A10,10 0 0,1 12,2A10,10 0 0,1 22,12M20,12A8,8 0 0,0 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20A8,8 0 0,0 20,12M8.6,16.6L13.2,12L8.6,7.4L10,6L16,12L10,18L8.6,16.6Z" />
  </svg>
</button>

4.2. Default

<div class="multiplePost custom" id="outputDiv">
  <script>
    afCustomPost.run('outputDiv', 'namaLabel', jumlahPost, 'default');
  </script>
</div>

5. Widget Dukungan

Tinggal masukkan html berikut ke dalam Widget

<div class="dukungan">
  <a href="#" class="item paypal">
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
      <path fill="none" d="M0 0h24v24H0z"></path>
      <path d="M8.495 20.667h1.551l.538-3.376a2.805 2.805 0 0 1 2.77-2.366h.5c2.677 0 4.06-.983 4.55-3.503.208-1.066.117-1.73-.171-2.102-1.207 3.054-3.79 4.16-6.962 4.16h-.884c-.384 0-.794.209-.852.58l-1.04 6.607zm-4.944-.294a.551.551 0 0 1-.544-.637L5.68 2.776A.92.92 0 0 1 6.59 2h6.424c2.212 0 3.942.467 4.899 1.558.87.99 1.123 2.084.871 3.692.36.191.668.425.916.706.818.933.978 2.26.668 3.85-.74 3.805-3.276 5.12-6.514 5.12h-.5a.805.805 0 0 0-.794.679l-.702 4.383a.804.804 0 0 1-.794.679H6.72a.483.483 0 0 1-.477-.558l.274-1.736H3.55zm6.836-8.894h.884c3.19 0 4.895-1.212 5.483-4.229.02-.101.037-.203.053-.309.166-1.06.05-1.553-.398-2.063-.465-.53-1.603-.878-3.396-.878h-5.5L5.246 18.373h1.561l.73-4.628.007.001a2.915 2.915 0 0 1 2.843-2.267z"></path>
    </svg>
    <span>Paypal</span>
  </a>
  <a href="#" class="item patreon">
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
      <path fill="none" d="M0 0h24v24H0z"></path>
      <path d="M15 17a7.5 7.5 0 1 1 0-15 7.5 7.5 0 0 1 0 15zm0-2a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zM2 2h5v20H2V2zm2 2v16h1V4H4z"></path>
    </svg>
    <span>Patreon</span>
  </a>
  <a href="#" class="item kofi">
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
      <path fill="none" d="M0 0h24v24H0z"></path>
      <path d="M5 3h15a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2h-2v3a4 4 0 0 1-4 4H8a4 4 0 0 1-4-4V4a1 1 0 0 1 1-1zm13 2v3h2V5h-2zM2 19h18v2H2v-2z"></path>
    </svg>
    <span>Ko-Fi</span>
  </a>
  <a href="#" class="item discord">
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
      <path fill="none" d="M0 0h24v24H0z"></path>
      <path d="M13.914 14.58a8.998 8.998 0 0 1-.484.104 7.06 7.06 0 0 1-2.664-.01c-.154-.03-.372-.083-.653-.158l-.921 1.197c-2.273-.073-3.137-1.596-3.137-1.596 0-3.381 1.481-6.122 1.481-6.122 1.481-1.133 2.89-1.102 2.89-1.102l.403.525a1.12 1.12 0 0 1 .112-.01 8.527 8.527 0 0 1 2.314.01l.442-.525s1.41-.031 2.89 1.103c0 0 1.482 2.74 1.482 6.121 0 0-.875 1.522-3.148 1.596l-1.007-1.134zM10.076 11C9.475 11 9 11.45 9 12s.485 1 1.076 1c.6 0 1.075-.45 1.075-1 .01-.55-.474-1-1.075-1zm3.848 0c-.6 0-1.075.45-1.075 1s.485 1 1.075 1c.601 0 1.076-.45 1.076-1s-.475-1-1.076-1zM21 23l-4.99-5H19V4H5v14h11.003l.57 2H5a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v19z"></path>
    </svg>
    <span>Discord</span>
  </a>
  <a href="#" class="item facebook">
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
      <path fill="none" d="M0 0h24v24H0z"></path>
      <path d="M14 19h5V5H5v14h7v-5h-2v-2h2v-1.654c0-1.337.14-1.822.4-2.311A2.726 2.726 0 0 1 13.536 6.9c.382-.205.857-.328 1.687-.381.329-.021.755.005 1.278.08v1.9H16c-.917 0-1.296.043-1.522.164a.727.727 0 0 0-.314.314c-.12.226-.164.45-.164 1.368V12h2.5l-.5 2h-2v5zM4 3h16a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1z"></path>
    </svg>
    <span>Facebook</span>
  </a>
  <a href="#" class="item trakteer">
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
      <path fill="none" d="M0 0h24v24H0z"></path>
      <path d="M5 9a1 1 0 0 1 1 1 6.97 6.97 0 0 1 4.33 1.5h2.17c1.332 0 2.53.579 3.353 1.499L19 13a5 5 0 0 1 4.516 2.851C21.151 18.972 17.322 21 13 21c-2.79 0-5.15-.603-7.06-1.658A.998.998 0 0 1 5 20H2a1 1 0 0 1-1-1v-9a1 1 0 0 1 1-1h3zm1.001 3L6 17.021l.045.033C7.84 18.314 10.178 19 13 19c3.004 0 5.799-1.156 7.835-3.13l.133-.133-.12-.1a2.994 2.994 0 0 0-1.643-.63L19 15l-2.112-.001c.073.322.112.657.112 1.001v1H8v-2l6.79-.001-.034-.078a2.501 2.501 0 0 0-2.092-1.416L12.5 13.5H9.57A4.985 4.985 0 0 0 6.002 12zM4 11H3v7h1v-7zm9.646-7.425L14 3.93l.354-.354a2.5 2.5 0 1 1 3.535 3.536L14 11l-3.89-3.89a2.5 2.5 0 1 1 3.536-3.535zm-2.12 1.415a.5.5 0 0 0-.06.637l.058.069L14 8.17l2.476-2.474a.5.5 0 0 0 .058-.638l-.058-.07a.5.5 0 0 0-.638-.057l-.07.058-1.769 1.768-1.767-1.77-.068-.056a.5.5 0 0 0-.638.058z"></path>
    </svg>
    <span>Trakteer</span>
  </a>
</div>

6 komentar

Blogger Disqus
  1. bang all episode gak balik ke post series itu kenapa? di demo kalau klik all episode balik ke series bisa tuh

    BalasHapus
  2. sama postingan terbaru di halaman utama bisa gak cuma nampilin post episode aja, trs post anime juga dihalaman utama gak work kenapa? labelnya udah genti padahal pake Anime

    BalasHapus
    Balasan
    1. OutputDiv nya perhatikan setiap widget harus berbeda tulisan

      Hapus
  3. Balasan
    1. fungsi nya ky ginihttps://www.w3schools.com/code/tryit.asp?filename=GUJC8VX1UQKS

      Hapus
  • Centang kotak Beri tahu saya untuk mendapatkan notifikasi via email jika ada yang membalas komentar.
  • Jika ingin menulis kode maka harus di-parse terlebih dulu (terutama Javascript dan HTML)
  • Gunakan <i> untuk menuliskan kode. Contoh:
    <i>#comments</i>
  • Gunakan <em> untuk menuliskan kode yang lebih panjang atau URL. Contoh:
    <em>#comments {margin:0; padding:10px 15px}</em>