Rabu, 30 Oktober 2013

Membuat bingkai posting dan widget

Latihan berikutnya yang aku ingin lakukan adalah membuat bingkai pada postingan dan widget sehingga blok kelihatan lebih menarik, inilah langkah-langkah yang aku lakukan.
1. Membuat bingkai posting
    - Masuk ke akun Blogger
    - Klik menu template dan tekan tombol edit HTML
     - Cari kode berikut :
      .post {
       untuk mempercepat pencarian kugunakan Ctrl+F
    - setelah ketemu menuliskan kode berikut dibawahnya :

        margin-top: 0px;
        margin-bottom: 1px;
        margin-left-value: 0px;
        margin-right-value: 0px;
        padding: 3px 3px;
        color: #274e13 !important;
        border: 1px solid #666666;
        border-radius: 4px;
        box-shadow: 1px 1px 6px 1px #3d85c6;

     - bila ingin berupa  garis saja maka tidak perlu memasukkan 
      "color, border dan box shadow" .
    - simpan template
2. Membuat bingkai untuk widget
    - Masuk ke akun Blogger
    - Klik halaman template dan tekan tombol edit template
     - Cari kode berikut :
         ]]></b:skin> dan kemudian sisipkan kode berikut ini tepat di atasnya
       untuk mempercepat pencarian kugunakan Ctrl+F

       .main-inner .sidebar .widget h2 {
           margin-top: 0px;
           margin-bottom: 1px;
           margin-left-value: 0px;
           margin-right-value: 0px;
           padding: 3px 3px;
           color: #274e13 !important;
           text-align: center;
           border: 1px solid #666666;
           border-radius: 4px;
           box-shadow: 1px 1px 6px 1px #3d85c6;
           background: #bbbbbb;
           }
           .main-inner .sidebar .widget-content {
           margin: 0px;
           padding: 2px 2px;
           text-align: justify;
           text-decoration: none;
           border: 1px solid #674ea7;
           border-radius: 4px;
           box-shadow: 1px 1px 6px 1px #3d85c6;
           background: #ffffff;
           }
          .main-inner .widget #ArchiveList {
            margin: 0px;
            }
           .main-inner .widget ul,
           .main-inner .widget li,
           .main-inner .widget ul li,
           .main-inner .widget #ArchiveList ul.flat li {
            margin: 0px;
            padding: 2px;
            list-style: none;
             }
       - simpan template.

Dan selesailah sudah aku bikin bingkai posting dan widget seperti yang nampak pada blog ini. Alhamdulillah.
Title: Membuat bingkai posting dan widget; Written by MI Islamiyah Sroyo; Rating: 5 dari 5

Tidak ada komentar:

Posting Komentar