Cara Buat Status Rilis Project Seperti Tiramisubs

10.26.00
Pagi semuanya..

Ok update pagi enaknya buat Tutor dah...


Yosh langsung saja dah ke tutor

1. Login Blogger dulu
2. Masuk Template -> Edit HTML
3. Lalu cari kode </style>  atau </b:skin>  (untuk memudahkan pencarian tekan CTRL + F) terapkan kode CSS ini tepat diatas kode </style>  atau </b:skin> 

/* CSS Status Rilis Tiramisub by Nukodezign */
.statusrilis {font-size: 19px;text-align: center;background: #82aac3;margin-top: 10px;margin-bottom: 0;padding: 10px;color: white;}
.titleA{width: auto;margin-bottom: -32px;margin-left: 2px;margin-top: -20px}
.titleB{width: auto;margin-bottom: -23px;margin-left: 2px;margin-top: -20px}
p.title1{font-family: 'Fresca';font-size: 20px;line-height: 130%;margin-bottom: 36px}
p.title2{font-family: 'Fresca';font-size: 15px}
.arrow{position: relative;width: 100%;height: 2px;background: rgba(58, 166, 208, 0.2)}
.arrow-status{text-align: right;padding-right: .5em;padding-left: .5em;background-color: #82aac3;border-color: white;width: 0%;color: white;height: 100%;line-height: 1.2em;-webkit-animation: width .5s ease-in;font-family: 'Fresca';white-space: nowrap;font-size: 16px}
.arrow-pointer2{background-color: white;display: inline-block;width: 1em;height: 3em;position: relative;left: 100%;top: -1em;margin-left: -2em;margin-bottom: -2em;border-radius: 0 5px 5px 0}
span.persen{background: #82aac3;padding: 3px;border-radius: 5px;color: white}

Lalu save Template, dan buat Laman baru . Pastekan kode HTML ini bukan di Compose
<p class="statusrilis">Nama Blog</p>
<div id="statusrilis">
    <div id="status">
        <div class="titleA">
            <p class="title1">
                <span class="persen">100%</span> JUDUL ANIME DISINI
            </p>
        </div>
        <div class="titleB">
            <p class="title2">
    Encode: 100%, Retiming: 100%, Translate: 100%, Upload: 100%
  </p>
        </div>
        <div class="arrow">
            <div class="arrow-status" style="width: 100%;">
                <span class="arrow-pointer"></span>
            </div>
        </div>
    </div>
    <div id="status">
        <div class="titleA">
            <p class="title1">
                <span class="persen">50%</span> JUDUL ANIME DISINI
            </p>
        </div>
        <div class="titleB">
            <p class="title2">
    Encode: 50%, Retiming: 50%, Translate: 50%, Upload: 50%
  </p>
        </div>
        <div class="arrow">
            <div class="arrow-status" style="width: 50%;">
                <span class="arrow-pointer"></span>
            </div>
        </div>
    </div>
</div>
Terakhir Simpan dan Posting

Previous
Next Post »
Penulisan markup di komentar
  • Silakan tinggalkan komentar sesuai topik. Komentar yang menyertakan link aktif, iklan, atau sejenisnya akan dihapus.
  • Untuk menyisipkan kode gunakan <i rel="code"> kode yang akan disisipkan </i>
  • Untuk menyisipkan kode panjang gunakan <i rel="pre"> kode yang akan disisipkan </i>
  • Untuk menyisipkan quote gunakan <i rel="quote"> catatan anda </i>
  • Untuk menyisipkan gambar gunakan <i rel="image"> URL gambar </i>
  • Untuk menyisipkan video gunakan [iframe] URL embed video [/iframe]
  • Kemudian parse kode tersebut pada kotak di bawah ini

Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

Tidak ada komentar