Membuat Table Responsive Blogger 2020

Membuat Table Responsive Blogger 2020

Membuat Table Responsive Blogger 2020 - Kesempatan kali ini saya akan berbagi Tutorial Membuat Table Rensponsive dan tampilan nya seperti di bawah ini untuk melihat nya untuk membuat table seperti dibawah ini silahkan ikuti langkah - langkah di bawah ini juga.

Features Availability
Full Responsive 100% True
SEO Friendly True
Struktur Valid 100% True
Fast Loading True
Support Designer Theme True
Custom Page Error 404 True
Ready Ads Optimaze True
Mega & Slider Menu Navigation True
Support Icon SVG True
Latest Lazy Load Images True
Slider Corousel True
Widget News Ticker True
Widget Social Media True
Related Posts True
Live View Posts True
Blogger Comments Latest Version True
Author Box Design True
Featured Video Youtube True

Cara Membuat Table Responsive Di Blogger

1. Login ke Blogger 
2. Pilih Tata Letak > Tema > Edit HTML
3. Kemudian silahkan cari kode ini]]</b:skin>
4. Salin kode di bawah ini kemudian taruh di atas kode di atas
/* Table Responsive ArsadPedia */
.post-body .tr-caption-container{width:auto;margin:0;border:0}
.post-body .tr-caption-container td{background-color:transparent !important;border:0 !important}
.post-body .tr-caption{display:block;font-size:12px;color:#223343}
.post-body table{width:100%;margin:20px 0px;border:1px solid rgba(0,0,0,.05);border-radius:10px;font-size:.9rem;overflow:hidden}
.post-body table th{background-color:#223343;color:#fff;padding:10px;border-right:1px solid rgba(255,255,255,.25);}
.post-body table th:last-child, .post-body table tr td:last-child{border-right:0 !important;}
.post-body table tr:nth-child(2n+1) td{border-right:1px solid rgba(0,0,0,.05)}
.post-body table td{padding:10px 15px;vertical-align:middle;}
.post-body table tr:nth-child(2n) td{background-color:rgba(0,0,0,.05);border-right:1px solid rgba(0,0,0,.06)}

5. Kemudian Simpan Tema.
Untuk Mengganti Warnanya Silahkan Cari Kode #223343 Dan Ganti Dengan Kode Warna Yang Kamu Suka

Cara Menggunakan Table Di Blogger

1. Buka Entri Baru > Buka Mode HTML bukan Compose 
2. Kemudian masukan kode dibawah ini
<table cellpadding="0" cellspacing="0" style="text-align: left;">
  <tbody>
<tr>
    <th>Features</th>
    <th>Availability</th>
   </tr>
<tr>
    <td>Full Responsive 100%</td>
    <td>True</td>
   </tr>
<tr>
    <td>SEO Friendly</td>
    <td>True</td>
   </tr>
<tr>
    <td>Struktur Valid 100%</td>
    <td>True</td>
   </tr>
<tr>
    <td>Fast Loading</td>
    <td>True</td>
   </tr>
<tr>
    <td>Support Designer Theme</td>
    <td>True</td>
   </tr>
<tr>
    <td>Custom Page Error 404</td>
    <td>True</td>
   </tr>
<tr>
    <td>Ready Ads Optimaze</td>
    <td>True</td>
   </tr>
<tr>
    <td>Mega &amp; Slider Menu Navigation</td>
    <td>True</td>
   </tr>
<tr>
    <td>Support Icon SVG</td>
    <td>True</td>
   </tr>
<tr>
    <td>Latest Lazy Load Images</td>
    <td>True</td>
   </tr>
<tr>
    <td>Slider Corousel</td>
    <td>True</td>
   </tr>
<tr>
    <td>Widget News Ticker</td>
    <td>True</td>
   </tr>
<tr>
    <td>Widget Social Media</td>
    <td>True</td>
   </tr>
<tr>
    <td>Related Posts</td>
    <td>True</td>
   </tr>
<tr>
    <td>Live View Posts</td>
    <td>True</td>
   </tr>
<tr>
    <td>Blogger Comments Latest Version</td>
    <td>True</td>
   </tr>
<tr>
    <td>Author Box Design</td>
    <td>True</td>
   </tr>
<tr>
    <td>Featured Video Youtube</td>
    <td>True</td>
   </tr>
</tbody>
 </table>

3. Silahkan rubah sesuai kebutuhan kamu
4. Kemudian Simpan.

Penutup

Nah demikian lah artikel kali ini semoga bermanfaat bagi kamu jika ada pertanyaan silahkan tinggalkan komentar atau hubingi saya via Contacts Trimakasih See You
Muhamad Arsyad Admin Ganteng Tapi Jomlo :v
Share
Tampilkan Komentar
Sembunyikan Komentar

2 Responses to "Membuat Table Responsive Blogger 2020"

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel