Membuat template blog dengan template dari w3school bagian 2

Membuat template blog dengan template dari w3school bagian 2



Pada postingan saya sebelumnya cara Membuat template blog dengan template dari w3school bagian 1, kali ini saya akan membuat lanjutan dari postingan sebelumnya dengan judul Membuat template blog dengan template dari w3school bagian 2.


 kali ini kita akan menambahkan Snippet artikel

langsung saja pertama pada tab tema atur dulu pada bagian tampilan seluler pilih tidak, tampilkan tema dekstop sepetti gambar dibawah ini.

Membuat template blog dengan template dari w3school bagian 2

Selanjutnya save dan buka edit html cari kode tekan ctrl + f  buat cari cepat
<b:includable id='post' var='post'>

kurang lebih seperti ini
<b:includable id='post' var='post'>
  <div class='post hentry uncustomized-post-template' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>

hapus kode di bawah "<b:includable id='post' var='post'>" sampai di atas kode "<b:if cond='data:post.hasJumpLink'>"

lihat gambar di bawah

Membuat template blog dengan template dari w3school bagian 2


ganti dengan kode dibawah ini


  <!-- edit-->
         <b:if cond='data:blog.pageType != &quot;item&quot;'>
         <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
 <!-- Then use the post body as the schema.org description, for good G+/FB snippeting. -->
    <div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' expr:itemprop='(data:blog.metaDescription ? &quot;&quot; : &quot;description &quot;) + &quot;articleBody&quot;'>
     
    <b:if cond='data:post.firstImageUrl'>
      <meta expr:content='data:post.firstImageUrl' itemprop='image_url'/>
          <img expr:src='data:post.firstImageUrl' itemprop='image_url' style='width: 300px;height: 200px;float:left; margin:0 8px 4px 0;'/>
    </b:if>
    <meta expr:content='data:blog.blogId' itemprop='blogId'/>
    <meta expr:content='data:post.id' itemprop='postId'/>

    <a expr:name='data:post.id'/>
    <b:if cond='data:post.title'>
      <h3 class='post-title entry-title' itemprop='name'>
      <b:if cond='data:post.link or (data:post.url and data:blog.url != data:post.url)'>
        <a expr:href='data:post.link ? data:post.link : data:post.url'><data:post.title/></a>
      <b:else/>
        <data:post.title/>
      </b:if>
      </h3>
    </b:if>

      <b:if cond='data:post.snippet'><data:post.snippet/></b:if>
      <div style='clear: both;'/> <!-- clear for photos floats -->
    </div>
          
          </b:if>
    
      <b:else/>
<div class='post hentry uncustomized-post-template' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
  <meta expr:content='data:blog.blogId' itemprop='blogId'/>
    <meta expr:content='data:post.id' itemprop='postId'/>

    <a expr:name='data:post.id'/>
    <b:if cond='data:post.title'>
      <h3 class='post-title entry-title' itemprop='name'>
      <b:if cond='data:post.link or (data:post.url and data:blog.url != data:post.url)'>
        <a expr:href='data:post.link ? data:post.link : data:post.url'><data:post.title/></a>
      <b:else/>
        <data:post.title/>
      </b:if>
      </h3>
    </b:if>
 
  <data:post.body/>
      <div style='clear: both;'/> <!-- clear for photos floats -->
           </div>
 
<!---batas edit-->
 
save dan coba lihat hasilnya

kembali ke tata letak dan tambahkan header halaman dan sidebar


Membuat template blog dengan template dari w3school bagian 2

Selanjutnya silahkan edit susuai selera masing-masing
 sample tema blog dari w3school bisa di lihat  https://tema-w3schools.blogspot.com/

Download sample tema w3school buat blog di link di bawah ini

DOWNLOAD

 Terima kasih anda sudah membaca artikel dengan judul  Membuat template blog dengan template dari w3school bagian 2

Bagikan:

Related Posts