Dalam Konsep
Konten Halaman:
Prolog:
Elemen posting pada umumnya ialah sebuah elemen <b:includable> dengan id='post' menyerupai ini:
<b:includable id='post' var='post'> ... </b:includable>Pada versi mobile, Anda akan melihatnya sebagai elemen ini:
<b:includable id='mobile-post' var='post'> ... </b:includable>Elemen tersebut berisi markup HTML yang mendukung penampilan posting:
<div class='post hentry'> <h2 class='post-title entry-title'> Judul Artikel... </h2> <div class='post-body entry-content' id='post-body-3907786755150251808'> Konten artikel... </div> <div class='post-footer'> Konten footer artikel... </div> </div>Detail:
Judul Posting
Berupa elemen heading. Biasanya mempunyai kelas post-title dan/atau entry-title:
<b:if cond='data:post.title'> <h3 class='post-title entry-title'> <b:if cond='data:post.link'> <a expr:href='data:post.link'><data:post.title/></a> <b:else/> <b:if cond='data:post.url'> <b:if cond='data:blog.url != data:post.url'> <a expr:href='data:post.url'><data:post.title/></a> <b:else/> <data:post.title/> </b:if> <b:else/> <data:post.title/> </b:if> </b:if> </h3> </b:if>| Data | Keterangan | Tampilan/Contoh Tampilan |
|---|---|---|
| data:post.link | Elemen ini akan menghasilkan tautan lampiran yang nilainya Anda atur melalui editor posting | http://www.custom_link_url.com |
| data:post.url | Elemen ini akan menghasilkan URL posting | |
| data:post.title | Elemen ini akan menghasilkan judul posting | Lorem Ipsum |
Tubuh/Konten Posting
Berupa elemen divisi dengan kelas post-body dan/atau entry-content:
<div class='post-body entry-content' expr:id='"post-body-" + data:post.id'> <data:post.body/> <div class='clear'/> <!-- clear for photos floats --> </div>| Data | Keterangan | Tampilan/Contoh Tampilan |
|---|---|---|
| data:post.id | Elemen ini akan menampilkan ID posting | 3907786755150251808 |
| data:post.body | Elemen ini akan menampilkan konten posting | Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed membisu nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam bersahabat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. |
| data:post.snippet | Elemen ini akan menghasilkan ringkasan posting dalam 100 kata + ... | Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed membisu nonummy nibh euismod tincidunt ut ... |
| data:post.thumbnailUrl | Elemen ini akan menghasilkan URL thumbnail pertama di dalam posting dalam resolusi s72-c | http://4.bp.blogspot.com/-EJgQTkZZJXY/UI1J-2tM21I/AAAAAAAAFF8/09hfALvXkVY/s72-c/1389621_gaillardia.jpg |
| data:post.firstImageUrl | Elemen ini akan menghasilkan URL thumbnail pertama di dalam posting dalam resolusi yang sesungguhnya | http://4.bp.blogspot.com/-EJgQTkZZJXY/UI1J-2tM21I/AAAAAAAAFF8/09hfALvXkVY/s1600/1389621_gaillardia.jpg |
| data:post.authorPhoto.url | Elemen ini akan menghasilkan URL gambar foto profil penulis | https://lh4.googleusercontent.com/-nxgZmVx9WAM/AAAAAAAAAAI/AAAAAAAAAAA/q7C64RWrrU0/s1600/photo.jpg |
| data:post.authorProfileUrl | Elemen ini akan menghasilkan URL profil penulis | http://www.blogger.com/profile/034065736413533XXXXX |
| data:post.authorAboutMe | Elemen ini akan menghasilkan deskripsi profil penulis | Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed membisu nonummy nibh euismod tincidunt. |
Footer/Catatan Kaki Posting
Berupa elemen divisi. Biasanya mempunyai kelas post-footer:
<div class='post-footer'> <div class='post-footer-line post-footer-line-1'> <span class='post-author vcard'> <b:if cond='data:top.showAuthor'> <data:top.authorLabel/> <span class='fn'> <data:post.author/> </span> </b:if> </span> <span class='post-timestamp'> <b:if cond='data:top.showTimestamp'> <data:top.timestampLabel/> <b:if cond='data:post.url'> <a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a> </b:if> </b:if> </span> <!-- quickedit pencil --><b:include data='post' name='postQuickEdit'/> <span class='post-comment-link'> <b:if cond='data:blog.pageType != "item"'> <b:if cond='data:blog.pageType != "static_page"'> <b:if cond='data:post.allowComments'> <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a> </b:if> </b:if> </b:if> </span> <!-- Feature added by BTemplates.com --> <b:if cond='data:post.sharePostUrl'> <div class='post-share-buttons'><b:include data='post' name='shareButtons'/> </div> </b:if> </div> <div class='post-footer-line post-footer-line-2'><span class='post-labels'> ... </span> <b:if cond='data:top.showMobileShare'> <div class='mobile-link-button goog-inline-block' id='mobile-share-button'> <a href='javascript:void(0);'><data:shareMsg/></a> </div> </b:if> <b:if cond='data:top.showDummy'> <div class='goog-inline-block dummy-container'> <data:post.dummyTag/> </div> </b:if> <b:if cond='data:top.showMobileShare'> <div class='mobile-link-button goog-inline-block' id='mobile-share-button'> <a href='javascript:void(0);'><data:shareMsg/></a> </div> </b:if> <b:if cond='data:top.showDummy'> <div class='goog-inline-block dummy-container'> <data:post.dummyTag/> </div> </b:if> </div> <div class='post-footer-line post-footer-line-3'><span class='post-location'> <b:if cond='data:top.showLocation'> <b:if cond='data:post.location'> <data:postLocationLabel/> <a expr:href='data:post.location.mapsUrl' target='_blank'><data:post.location.name/></a> </b:if> </b:if> </span> </div> </div>| Data | Keterangan | Tampilan/Contoh Tampilan |
|---|---|---|
| data:top.authorLabel | Label keterangan sebelum nama penulis | Diposting oleh: |
| data:post.author | Elemen ini akan menghasilkan nama penulis | Taufik Nurrohman |
| data:top.timestampLabel | Label keterangan sebelum waktu penerbitan | pada |
| data:post.timestampISO8601 | Elemen ini akan menampilkan waktu penerbitan dalam format timestamp ISO 8601 | 2012-10-28T22:42:00+07:00 |
| data:post.timestamp | Elemen ini akan menampilkan timestamp waktu penerbitan | 10:42 |
| data:post.addCommentUrl | Elemen ini akan menampilkan URL posting dengan perhiasan hash #comment-form | #comment-form |
| data:post.addCommentOnclick | ??? | ... |
| data:top.commentLabel | [?] | - |
| data:post.numComments | [?] | - |
| data:top.commentLabelPlural | [?] | - |
| data:shareMsg | ??? | ... |
| data:post.dummyTag | ??? | ... |
| data:top.showLocation | ??? | ... |
| data:post.location | ??? | ... |
| data:postLocationLabel | Elemen ini akan menampilkan label lokasi sebelum keterangan lokasi penerbitan posting | Lokasi: |
| data:post.location.mapsUrl | Elemen ini akan menghasilkan URL lokasi dalam peta Google (???) | ... |
| data:post.location.name | Elemen ini akan menampilkan lokasi penerbitan posting yang telah dituliskan dalam formulir lokasi | Banyumas, Indonesia |
Jump Link/Read More Link
Elemen ini akan muncul ketika Anda mengaktifkan jump link pada posting/memotong artikel dengan cara menyisipkan instruksi <!--more-->:
<b:if cond='data:post.hasJumpLink'> <div class='jump-link'> <a expr:href='data:post.url + "#more"' expr:title='data:post.title'> <data:post.jumpText/> </a> </div> </b:if>| Data | Keterangan | Tampilan/Contoh Tampilan |
|---|---|---|
| data:post.jumpText | Elemen ini akan menampilkan teks “Baca Selengkapnya” dari pengaturan posting | Read More » |