Cara Mudah Membuat Kotak Text Box Quote di Blogger

Cara Mudah Membuat Kotak Text Box Quote di Blogger

Hallo guys ?!!, seperti biasa OIFnews.com akan share Tips & Tutorial Blogger, pada artikel kali ini saya akan menulis artikel Cara Mudah Membuat Kotak Text Box Quote di Blogger. Langsung aja berikut cara-caranya :


Cara Mudah Membuat Kotak Text Box Quote di Blogger

  1. Silahkan kamu login ke blogger.com dengan menggunakan akun Gmail kamu.
  2. Masuk kemenu TEMA > klik Edit HTML
  3. Silahkan kamu cari kode berikut ini ]]></b:skin> dan pastekan kode dibawah ini tepat DIATAS kode tersebut.

    .boxcontainer {
      padding:20px 0px 0px 0px;
      border:2px solid #1588E3;
      vertical-align:middle;
      width:100%;
      position:relative;
      border-bottom-left-radius:15px;
      border-bottom-right-radius:15px;
      border-top-right-radius:15px;
      border-top-left-radius:15px;
      }
      
    .boxcontainer .boxes {
      padding:0px;
      width:100%;
      background:#1589E3;
      position:absolute;
      top:-15px;
      left:0px;
      border-radius:15px;
      padding-top:2px;
      padding-bottom:2px;
      }
      
    .boxcontainer .boxes .textboxes {
      background:transparent;
      padding:0px;
      color:#fff;
      text-align:center;
      font-weight:bold;
      }
      
    .quotebox {
      background:#ddd;
      margin:10px auto;
      margin-left:15px;
      margin-right:15px;
      border-radius:7px;
      }
      
    .quotebox p {
      padding:10px;
      color:#444;
      font-family:arial;
      }
      
    .authores {
      background:#1589E3;
      border-bottom-left-radius:10px;
      border-bottom-right-radius:10px;
      padding-bottom:1px;
      padding-top:11px;
      }
      
    .authores h2 {
      color:#fff;
      font-size: 14px;
      text-align:center;
      }
  4. Kalau sudah silahkan tinggal klik SIMPAN dan sekarang kita langsung masuk ke menu Postingan.
  5. Selanjutnya, kamu copy kode dibawah ini dan paste tepat di mode HTML  postingan [bukan compose].

    <div class='boxcontainer'>
        <div class='quotebox'>
         <p>Tulis Textnya Disini.</p>
        </div>
        <div class='boxes'>
         <div class='textboxes'>
          <p>Text Quote</p>
          </div>
         </div>
         <div class='authores'><h2>- OIFnews.com -</h2></div>
        </div>
  6. Kalau sudah silahkan klik PUBLIKASIKAN dan Selesai.
Nahh itu dia Tips & Tutorial Blogger kali ini pada artikel Cara Mudah Membuat Kotak Text Box Quote di Blogger. Bagiamana sangatlah mudahkan, semoga bermanfaat ya teman-teman dan jangan lupa lihat juga Tips & Tutorial Blogger yang lainnya DISINI