Tutorial ini akan mencakup
langkah-langkah yang diperlukan untuk membuat template blogger sendiri.
Banyak orang telah menggunakan blogger untuk menjalankan blog dan
bertanya-tanya bagaimana mereka dapat membuat tema mereka sendiri untuk
digunakan. Ada sedikit kesulitan untuk menemukan panduan tentang cara
untuk melakukan ini, jadi melalui tutor ini diharapkan agar dapat
membantu sobat sekalian untuk membuat template sendiri.
Untuk membuat template blogger, Anda akan memerlukan editor grafis (seperti Photoshop, GIMP, atau bahkan akan melakukan Paint) untuk membuat gambar untuk latar belakang, header, sidebars, dll. Kita akan melakukan itu nanti. Anda juga akan memerlukan sebuah ide atau visi tentang apa yang ingin Anda ciptakan. Tanpa itu, Anda hanya membuang-buang waktu Anda dan listrik. Terakhir, Anda akan perlu tahu tentang CSS (Cascading.Style.Sheets) dan cara mengoperasikannya. Jika Anda tidak tahu bagaimana melakukan hal itu, Anda tidak dapat menerapkan efek menarik untuk template Anda yang baru dirancang (Seperti: peletakan gambar atau teks, membuat pengulangan pada gambar latar, bergerak di sekitar gambar dan teks serta masih banyak lagi yang lainnya). Sebuah panduan yang besar tentang bagaimana untuk memulai akan kita mulai di sini.
Setelah Anda sudah mendapat semua yang Anda butuhkan, Anda harus memulai CSS Framework dengan meletakkan properti seperti
body[background-color: # 000000; margin: 0 auto; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 14px;}
# Title [font-size: 32px; color: # 000.011;}
Selanjutnya kita akan mengambil sebuah dasar dari tag yang diambil dari tema Blogger yang sederhana yang tersedia di sini: (File PDF) XML Tag Blogger Daftar CSS. Cara yang lebih mudah untuk melakukan hal ini adalah dengan menemukan tema yang Anda sukai dan copas CSSnya, edit lalu kita simpan. Satu-satunya masalah yang akan kita temukan adalah apabila melakukan hal ini, adalah bahwa rancangan setiap tema pasti berbeda sehingga tag akan berubah.
Setelah Anda mengkonfigurasi CSS stylesheet, anda harus potong itu bersama-sama dalam HTML.
<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</ B: section>
</ Div>
Jangan lupa untuk referensi blogger template yang sudah dibuat yang diperlukan untuk widget Anda harus memasukkannya ke dalam titik-titik tertentu. Tanpa melakukan hal ini, Anda tidak bisa menyelesaikan membuat template Anda sendiri.
Nah, Sekarang sampai pada bagian intinya yang bisa memakan waktu berjam-jam untuk menyelesaikan, atau menyalin dari situs lain dan mengedit. Blogger dikonfigurasi menggunakan widget.
<div class='post-footer'>
<p class='post-footer-line post-footer-line-1'> <span class='post-author'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/> <data:post.author/>
</ 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' title='permanent expr:href='data:post.url' link'> <data:post.timestamp/> </ a>
</ B: if>
</ B: if>
</ Span> <span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>
<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>
</ Span> <span class='post-icons'>
<- Link posting email -!>
<b:if cond='data:post.emailPostUrl'>
<span class='item-action'>
<a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
<span class='email-post-icon'> </ span>
</ A>
</ Span>
</ B: if>
<- QuickEdit pencil ->
<b:include data='post' name='postQuickEdit'/>
</ Span> </ p>
<p class='post-footer-line post-footer-line-2'> <span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'> <data:label.name/> </ a> <b:if != cond='data:label.isLast "true"'> , </ b: if>
</ B: loop>
</ B: if>
</ Span> </ p>
Pada dasarnya dalam menciptakan template anda harus sering trial and error. Anda harus lebih sering mengedit dan memotong kode-kode sedikit demi sedikit .. jangan takut untuk salah, Anda pasti akhirnya akan berhasil membuat template. Saya harap tutorial ini bisa memberikan pencerahan untuk sobat semua dalam membuat template.
Untuk membuat template blogger, Anda akan memerlukan editor grafis (seperti Photoshop, GIMP, atau bahkan akan melakukan Paint) untuk membuat gambar untuk latar belakang, header, sidebars, dll. Kita akan melakukan itu nanti. Anda juga akan memerlukan sebuah ide atau visi tentang apa yang ingin Anda ciptakan. Tanpa itu, Anda hanya membuang-buang waktu Anda dan listrik. Terakhir, Anda akan perlu tahu tentang CSS (Cascading.Style.Sheets) dan cara mengoperasikannya. Jika Anda tidak tahu bagaimana melakukan hal itu, Anda tidak dapat menerapkan efek menarik untuk template Anda yang baru dirancang (Seperti: peletakan gambar atau teks, membuat pengulangan pada gambar latar, bergerak di sekitar gambar dan teks serta masih banyak lagi yang lainnya). Sebuah panduan yang besar tentang bagaimana untuk memulai akan kita mulai di sini.
Setelah Anda sudah mendapat semua yang Anda butuhkan, Anda harus memulai CSS Framework dengan meletakkan properti seperti
body[background-color: # 000000; margin: 0 auto; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 14px;}
# Title [font-size: 32px; color: # 000.011;}
Selanjutnya kita akan mengambil sebuah dasar dari tag yang diambil dari tema Blogger yang sederhana yang tersedia di sini: (File PDF) XML Tag Blogger Daftar CSS. Cara yang lebih mudah untuk melakukan hal ini adalah dengan menemukan tema yang Anda sukai dan copas CSSnya, edit lalu kita simpan. Satu-satunya masalah yang akan kita temukan adalah apabila melakukan hal ini, adalah bahwa rancangan setiap tema pasti berbeda sehingga tag akan berubah.
Setelah Anda mengkonfigurasi CSS stylesheet, anda harus potong itu bersama-sama dalam HTML.
<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</ B: section>
</ Div>
Jangan lupa untuk referensi blogger template yang sudah dibuat yang diperlukan untuk widget Anda harus memasukkannya ke dalam titik-titik tertentu. Tanpa melakukan hal ini, Anda tidak bisa menyelesaikan membuat template Anda sendiri.
Nah, Sekarang sampai pada bagian intinya yang bisa memakan waktu berjam-jam untuk menyelesaikan, atau menyalin dari situs lain dan mengedit. Blogger dikonfigurasi menggunakan widget.
<div class='post-footer'>
<p class='post-footer-line post-footer-line-1'> <span class='post-author'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/> <data:post.author/>
</ 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' title='permanent expr:href='data:post.url' link'> <data:post.timestamp/> </ a>
</ B: if>
</ B: if>
</ Span> <span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>
<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>
</ Span> <span class='post-icons'>
<- Link posting email -!>
<b:if cond='data:post.emailPostUrl'>
<span class='item-action'>
<a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
<span class='email-post-icon'> </ span>
</ A>
</ Span>
</ B: if>
<- QuickEdit pencil ->
<b:include data='post' name='postQuickEdit'/>
</ Span> </ p>
<p class='post-footer-line post-footer-line-2'> <span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'> <data:label.name/> </ a> <b:if != cond='data:label.isLast "true"'> , </ b: if>
</ B: loop>
</ B: if>
</ Span> </ p>
Pada dasarnya dalam menciptakan template anda harus sering trial and error. Anda harus lebih sering mengedit dan memotong kode-kode sedikit demi sedikit .. jangan takut untuk salah, Anda pasti akhirnya akan berhasil membuat template. Saya harap tutorial ini bisa memberikan pencerahan untuk sobat semua dalam membuat template.
0 komentar:
Posting Komentar