Cara Membuat Kotak Donasi Pada Blog

Pada kali ini saya akan berbagi tutorial Cara Membuat Box Donasi keren khusus Template Median UI, Box donasi tidak lah begitu penting namun bagi sebagian orang itu sangat penting sekali.

Kotak Donasi yang akan kita buat kali ini menggunakan situs https://trakteer.id/ yang kita gabungkan dengan kode html dan css bagaiman cara nya silahkan ikuti tutorial dibawah ini.

  1. Buka Blogger

  2. Silahkan Copy Dan Paste kode dibawah ini tepat diatas kode ]]></b:skin>

  3.  /* Widget Donasi */
    .Donasi{position:relative;background:var(--contentB);padding:20px;border-radius:8px;box-shadow:0 10px 25px -3px rgba(0,0,0,.1)}.DonasiTitle{color:#444;margin-bottom:15px}.Donasi .DonasiTitle svg{position:absolute;bottom:10px;right:10px;width:56px;height:56px;opacity:0.3;fill:currentColor}.Donasi .DonasiTitle p{margin:0}.DonasiLink{color:#444;margin-top:5px;font-weight:400;align-items:center;display:inline-flex;background:#ffe337;padding:6px 10px;width:auto;border-radius:4px}
    .drK .Donasi{background:#2d2d30;}
    .drK .DonasiTitle{color:#fefefe;}
    .drK .Donasi .DonasiTitle svg{fill:#f4f4f4;}
    .drK .DonasiLink{color:#444;} 
  4. Kemudian Copy Dan Paste Juga kode di bawah ini tepat dibawah kode <b:if cond='da a:view.isPos '>

  5. <div class='Donasi'>
    <div class='DonasiTitle'>
    <svg viewBox='0 0 24 24'><g transform='translate(2.000000, 3.000000)'><path d='M10.8,13.5H9.3a2,2,0,0,1-2-2.1.8.8,0,0,1,.7-.8.9.9,0,0,1,.8.8c0,.4.2.6.5.6h1.5a.5.5,0,0,0,.5-.4c0-.4-.1-.4-.3-.5l-2.4-.8A1.8,1.8,0,0,1,7.3,8.4,1.8,1.8,0,0,1,9.2,6.5h1.5a2,2,0,0,1,2,2.1.8.8,0,0,1-.7.8.9.9,0,0,1-.8-.8c0-.4-.2-.6-.5-.6H9.2a.4.4,0,0,0-.4.4c0,.4,0,.4.2.5l2.4.8a1.8,1.8,0,0,1,1.3,1.9A1.8,1.8,0,0,1,10.8,13.5Zm-.8.8a.7.7,0,0,1-.7-.7v-.7a.7.7,0,0,1,.7-.8.8.8,0,0,1,.8.8v.7A.8.8,0,0,1,10,14.3Zm0-6.4a.7.7,0,0,1-.7-.7V6.4a.7.7,0,0,1,.7-.7.8.8,0,0,1,.8.7v.8A.8.8,0,0,1,10,7.9Zm0,10.8A8.8,8.8,0,1,1,18.7,10,8.7,8.7,0,0,1,10,18.7ZM10,2.8A7.2,7.2,0,1,0,17.2,10,7.2,7.2,0,0,0,10,2.8Zm7,19.9a5.6,5.6,0,0,1-4.6-2.4.8.8,0,0,1,.1-1.1.9.9,0,0,1,1.1.2A4.3,4.3,0,0,0,17,21.2a4.2,4.2,0,0,0,2.5-7.6.7.7,0,0,1-.2-1.1.7.7,0,0,1,1-.1A5.7,5.7,0,0,1,17,22.7Z'/></g></svg>
    <p class='DonasiDec'>Merasa terbantu dengan artikel ini? Yuk bantu kami juga meringankan biaya perawatan blog.</p>
    </div>
    <a class='DonasiLink' href='https://trakteer.id/za-pedia-eh5vm/tip' rel='nofollow' target='_blank'>Donasi sekarang</a>
    </div>
  6. Silahkan Buka situs https://trakteer.id/ dan mendaftar disana kemudian ambil username page nya

  7. Silahkan rubah https://trakteer.id/za-pedia-eh5vm/tip Dengan Username milik kamu Kemudian Save dan lihat hasil nya

Demikian lah artikel kali ini semoga bermanfaat tentang Cara Membuat Box Donasi keren Median UI jika ada yang ingin ditanyakan silahkan berkomentar di bawah

Baca juga
Join the conversation

Post a Comment