Chrome Options Blogger Template

Setelah kemarin "nambah postingan" kontes Top 1 Oli sintetik mobil-motor Indonesia, waktunya kembali ke blogger template. Chrome Options Blogger Template diinspirasi dari tampilan Option pada browser Google Chrome. Template ini simple, bersih dengan desain minimalist, SEO optimized, fast loading template dan juga bisa ditambahi banner ad leaderboard diatas postingan



Demo atau Download Chrome Option Blogger Template

Petra Blogger Template

Masih dengan postingan yang sama, free blogger template. Setelah Cupid Blogger template, kini giliran Petra Blogger template yang rilis dan masih sama juga, template ini saya adaptasi dari WordPress Theme karya Jinsona, Web2Feel

Desain template ini terkesan minimalist dan bersih dengan background garis vertikal. Fitur template ini seperti dropdown menu, tabview, 4 column footer, ads ready dll


Demo | Download

Cupid Blogger Template

Kembali ke blogger tem..plate.. Setelah kemarin rilis Mentor blogger template, sekarang giliran Cupid blogger template. Template adaptasi dari WordPress Theme karya designer Jinsona, Web2Feel dengan 2 kolom, 4 kolom footer, sidebar di kiri, dropdown menu, auto summary post dan juga mempunyai background yang bagus. Template ini cocok untuk semua kategori blog


Demo | Download

Jangan lupa untuk selalu mampir ke DheTemplate - Daily Updates Free Blogger Template

Mentor Blogger Template

Setelah kemarin rilis Prado blogger template, sekarang giliran Mentor Blogger Template. Template ini merupakan adaptasi dari WordPress Theme to Blogger karya Jinsona, Web2Feel. Fitur template ini seperti 2 kolom, 4 kolom footer, dropdown menu, tabview ready, SEO optimasi dan yang lain. Dengan design yang bersih dan elegant, template ini cocok untuk semua tipe blog

Berikut ini skrinshotnya



Demo | Download Mentor blogger template

Jangan lupa untuk menengok DheTemplate.com - Daily Update Free Blogger Template

Prado Blogger Template

Prado Blogger Template merupakan template adaptasi dari WordPress Theme buatan Jinsona, Web2Feel selain Horcrux Blogger Template. Template ini magazine style dengan featured Nivo Slider, 4 column footer, dropdown menu, tabview ready dan lainnya

Berikut ini skrinshot Prado Blogger Template



Sobat bisa liat demo live atau download Prado Blogger Template


Termakasih untuk sobat Teknokers atas koreksinya. Biasa pake 3 jadi kebablasan :D

Horcrux Blogger Template

Free Blogger Template Horcrux merupakan template blogger selanjutnya setelah Zero Gravity Blogger Template yang diadaptasi dari WordPress Theme karya Web 2 Feel. Design yang bersih dan elegant membuatku tergoda untuk menjadikannya ke Blogger. Template ini tediri dari 2 kolom dengan autoreadmore, tabview ready, social network ready, banner iklan tersedia dan juga custom kolom komentar

Berikut ini skrinshot Horcrux Blogger Template


Sobat bisa liat demo live atau donlot Horcrux blogger template


**Jangan lupa untuk updates blogger template terbaru di Daily Updates Free Blogger Template

Zero Gravity Blogger Template

Setelah kemarin rilis SimpleBlog blogger template (updates free blogger templates yang lain), giliran Zero Gravity blogger template. Template ini adalah magazine style blogger template dengan featured content, 3 kolom footer, tabview ready, css3 untuk box shadow dan rounded corner dan juga bekerja dengan baik di tampilan browser yang umum dipake termasuk Internet Explorer tapi karena IE belum support css3, tampilannya kurang sip (payahhh.. ^_^)



Sobat bisa liat demo atau download Zero Gravity Blogger Template


** Jika ada kesulitan untuk setting, bisa meninggalkan komen

Updates Free Blogger Templates yang Ketinggalan

Setelah beberapa lama blog ini sengaja aku telantarkan, beberapa template yang sudah rilis pun ikutan gak ke posting. Setelah rilis Sisi Gelap Blogger Template, ada beberapa template yang saya rilis sampe yang terakhir kemarin, SimpleBlog Blogger Template

Berikut ini update free blogger template yang belum ke posting di blog ini. Di mulai dari yang terbaru ke lama

1. Pre Live Mag Blogger Template

Pre live Mag Blogger Template adalah template magazine style dengan featured content dan 3 column footer

2. Rarely Blogger Template

Rarely Blogger Template adalah template sederhana dan bersih

3. Poster Inc Blogger Template

Poster Inc Blogger Template cocok untuk sobat yang mencari template ntuk gallery atau foto blogs

4. whitePress Blogger Template (Full Version)

whitePress Blogger template adalah magazine style blogger template adaptasi dari WordPress Theme dengan featured content dan 3 kolom footer

5. whitePress Blogger Template (Simple Version)

whitePress Blogger Template (Simple Version) adalah layout lain dari whitePress Blogger Template full Version dengan tanpa featured content

6. Ireng Manis V2 Blogger Template

Ireng Manis V2 Blogger Template adalah next Ireng Manis dengan tambahan featured content dan juga kode yang lebih "bersih"

7. Sophist Blogger Template

Sophist Blogger template tampilannya bersih dan sederhana dengan 3 column footer

8. Ireng Seksi Blogger Template

Ireng Seksi Blogger Template (asline seksi gak yo?? :mikir) adalah template sederhana 3 kolom dengan 3 kolom footer

9. Ornament Putih Blogger Template

Ornament Putih Blogger Template merupakan template 3 kolom dengan 3 kolom footer dan mengunakan css3 untuk box shadow dan juga rounded corner-nya.

10. Kolom Post Blogger Template

Template ini sederhana dengan 3 kolom footer


** Template yang lain segera menyusul

SimpleBlog Blogger Template

Lama juga gak rilis template baru. Berikut ini template made in ireng_ajah ayng baru. SimpleBlog blogger template adalah simple dan minimalist desain template adaptasi dari WordPress Theme dari Slimmity Blog



Template ini cocok untuk sobat2 yang mencari tampilan template simple dan minimalist tapi terliat elegant

Sobat bisa liat demo live ato download simpleblog blogger template

Blogger Template Sisi Terang

Jika kemarin saya rilis Sisi Gelap Blogger Template. Sekarang giliran kembarannya, Sisi Terang Blogger Template. Template ini sebenarnya sama dengan Sisi Gelap Blogger Template cuma warnanya saja yang berbeda, hehehehe...

Berikut ini skrinshotnya



Sobat bisa lihat demo Sisi Terang Blogger Template atau download template ini.


Note: Blogger template made in ireng_ajah yang lain segera menyusul, qiqiqiqiiqi...

Free Blogger Template Sisi Gelap ; No Scroll Sidebar Template

Setelah kemarin rilis Free Blogger Template Press Magajah, giliran Blogger Template Sisi Gelap. Template ini dasarnya sama dengan template yang saya pake untuk Just a Blog ini tetapi saya modif sana-sini termasuk menggunakan CSS3 untuk menciptakan rounded dan box shadow. Bagian sidebar blogger template Sisi Gelap ini no scroll. Dan untuk memaksimalkan sidebar yang no scroll, saya menggunakan TabView dan juga 2 kolom pada bagian sidebar. Untuk tampilan terbaik template ini, minimal menggunakan resolution 1280×1024px. Bukankah sekarang jamannya widescreen ?? hehehehe..

Berikut ini skrinshot Blogger Template Sisi Gelap.



Sobat bisa liat demo Sisi Gelap blogger template atau download Sisi Gelap Blogger Template


Note : Rencananya mau buat kembaran template Sisi Gelap dengan warna yang lebih terang (namanya Sisi Terang dengan warna putih ??)

Free Blogger Template Press Magajah

Free Blogger Template Press Magajah adalah blogger template magazine and news style. Template ini mempunyai 4 kolom pada halaman utama, 3 kolom pada halaman single post, 2 kolom footer & 2 kolom untuk sidebar kanan. Selain itu juga, Free Blogger Template Press Magajah ini juga terdapat widget untuk video, 2 menu navigasi, dan kelebihan yang lain. Template ini juga sudah lulus untuk browser yang sering dipakai seperti Firefox 3.6, Google Chrome, Safari, Opera dan termasuk Internet Explorer 7. Press Magajah Blogger Template cocok untuk blog portal berita.

Berikut ini screenshot Free Blogger Template Press Magajah


Sobat bisa melihat demo Press Magajah Blogger Template atau download Blogger Template Press Magajah

Note : Sebenarnya sebelum Press Magajah Blogger Template, sempet juga saya merilis Column Magazine White Blogger Template, kembarannya Column Magazine Dark Blogger Template tapi lupa saya postingan di sini, hehehehe..

Download Fre Blogger Template Column Magazine Dark

Setelah postingan kemarin cuma bisa kasih link demo saja, sekrang sobat bisa download template Column Magazine Dark. Template ini terdiri dari 3 kolom dibagian atas yang saya fungsikan sebagai feature post, main post, 2 kolom pada footer dan 1 sidebar dibagian kiri tetapi saat masuk ke single post, template ini akan terdiri dari 2 sidebar dibagian kiri.

Berikut ini skrinshot template Column Magazine Dark



Sobat bisa lihat demo atau download dan setting template Column Magazine Dark

Free Blogger Template Column Magazine Dark

Lama juga saya tidak membuat template baru made in ireng_ajah. Setelah bersemedi,hehehehehe.. akhirnya muncul juga template barunya. Template ini saya beri nama template Column Magazine Dark karena banyak kolom di template ini, haiah...

Berikut ini skrinshotnya

Klik gambar untuk memperbesar

Tapi saya minta maaf sebelumnya karena template ini belum bisa di download soalnya ada yang masih sedikit dibenahi tapi secara garis besar, akan tampak seperti pada demo live. Liat demo Blogger Template Column Magazine Dark.

Note :
- Untuk download template ini, silahkan klik disini
- Template ini rencananya akan ada versi dengan warna yang beda (tidak gelap melulu seperti orang yang buat, hehehehe...) Mungkin sobat ada masukan warna apa yang pantes. Terimakasih sebelumnya.

Download Blogger Template Layer Blue

Lama juga saya gak rilis template baru. Terakhir rilis adalah template Face Off Magajah. Sekarang giliran template Layer Blue yang siap didownload. Template ini simple dan bersih. Sangat cocok untuk mereka, para blogger yang suka tampilan simple dibalut (halah...) perpaduan warna biru dan putih yang menyejukkan mata, hehehehe...

Mungkin gak usah basa-basi, berikut ini adalah skrinshot template Layer Blue.



Sobaat bisa melihat demo template Layer Blue atau download template ini.


Note :
- Lama gak rilis template baru karena saya marah sama Blogger yang menyediakan fasilitas designer, wkakakakak...

Blogger Template Face Off Magajah

Blogger template Face Off Magajah merupakan template dengan tampilan ukuran yang berbeda pada Main Post dan Single Post seperti pada postingan sebelumnya. Saya menggunakan kode <b:if cond='...'></b:if> untuk template ini untuk mengakali tampilan widget2nya. Header pada template ini juga ada 2 yaitu Header untuk Main Post dan Header untuk Single Post. Tolong, perhatikan cara setting template ini.

Walopun template ini menggunakan banyak kode css untuk beberapa widget yang ada, template ini termasuk ringan. Dari uji loading blog demo Face Off Magajah template untuk tampilan main post pada seocentro.com, didapat hasilnya kurang lebih 42Kb-an. Hal ini

Berikut ini skrinshot template Face Off Magajah pada tampilan Main Post

Gambar 1.

Berikut ini skrinhot layout template Face Off dengan kode <b:if cond='...'></b:if>

Gambar 2.

Main Post dan Sidebar pada layout tidak muncul karena penggunaan kode <b:if cond='...'></b:if>

Lihat demo pada Main Post, Label Post dan Single Post | Download template Face Off Magajah


Setting Face Off Magajah template

1. Setting Menu pada Main Post dan Single Post

Masuk ke Layout > klik Edit HMTL.

Untuk menu Main Post, cari kode ini

<div id='navhome'>

Untuk menu Single Post, cari kode ini

<div id='navigation'>

Ganti YOUR-LINK-ABOUT-HERE, LINK-RSSFEED-HERE, dan Edit Me.


2. Setting Acordion Menu (Menu Blog widget seperti pada demo)

Menu Accordion pada template Face Off Magajah ini saya khususkan fungsinya sebagai link untuk Recent Post, Recent Post per kategori/label maupun untuk Recent Comment walopun bisa untuk widget yang lain.

Untuk setting accordion menu, kopi dan paste kode berikut ini

<div class="arrowlistmenu">
<h3 class="menuheader expandable">Recent Posts</h3>
<ul class="categoryitems">
<--- Kode javascript ato postingan --->
</ul>

<h3 class="menuheader expandable">Category 1</h3>
<ul class="categoryitems">
<--- Kode javascript ato postingan --->
</ul>

</div>

* Kode diatas hanya untuk 2 Submenu.
* Warna merah adalah judul Submenu


Untuk setting Recent Post per kategori/label, kopi dan paste kode berikut ini.

<script src="http://sites.google.com/site/vectorireng/javascript/codejavascript.js"></script>
<script>var numposts = 8; var showpostdate = false; var showpostsummary = false; var numchars = 100; </script>
<script src="http://freetemplate-ajah.blogspot.com/feeds/posts/default/-/Free%20Blogger%20Templates?orderby=published&alt=json-in-script&callback=rp">
</script>

Ganti yang berwarna merah dengan alamat blog sobat.
Untuk warna biru adalah nama label post. Penulisan nama label post harus sesuai besar kecil hurufnya.

/-/Free%20Blogger%20Templates? adalah contoh untuk label post Free Blogger Templates pada blog saya (3 kata)
Jika nama label post terdiri dari 2 kata, misal ireng ajah maka penulisannya menjadi

/-/ireng%20ajah?

Untuk label post 1 kata, misalnya ireng, maka penulisannya

/-/ireng?


3. Setting Feature Content

Copy dan paste kode berikut

<style type="text/css">
div.TabTampil div.TTs{height: 24px; overflow: hidden; }
div.TabTampil div.TTs a:hover, div.TabTampil div.TTs a.Active{ background: #fff; }
div.TabTampil div.Halamans{ clear: both; overflow: hidden; background: #fff;}
div.TabTampil div.Halamans div.Halaman{ height: 100%;
padding: 0px; overflow: hidden; color: #000;}
div.TabTampil div.Halamans div.Halaman div.Alas{ padding: 5px; }
div.TabTampil div.TTs a{float: left;display: block; width: 30px; text-align: center; height: 20px; padding: 3px; margin-right:1px; vertical-align: middle; text-decoration: none; font:bold 12px Arial; color: #ff0000}
</style>

<form action="tabtampil.html" method="get">
<div id="TabTampil" class="TabTampil"><div style="width: 250px;" class="TTs"> <a>1</a><a>2</a><a>3</a></div>
<div style="width: 250px; height: 200px;" class="Halamans">

<div class="Halaman">
<div class="Alas">
<a href="LINK-ULR-HERE" title="Title" target="_blank"/><img src="LINK-URL-IMAGE" alt="Alt Image" title="Title Image" width="240" height="180" /></a>
</div></div>


<div class="Halaman">
<div class="Alas">
<---- Konten Feature Post --->
</div></div>

<div class="Halaman">
<div class="Alas">
<a href="LINK-ULR-HERE" title="Title" target="_blank"/><img src="LINK-URL-IMAGE" alt="Alt Image" title="Title Image" width="240" height="180" /></a>
</div></div>


</div></div></form><script style="text/javascript"
src="http://sites.google.com/site/vectorireng/javascript/codejavascript.js"></script><script
type="text/javascript">tabtampil_inisial('TabTampil');</script>

* Warna merah adalah jumlah (judul) feature content. Kode diatas adalah contoh untuk 3 feature content


4. Add widget baru untuk Sidebar.

Seperti yang sudah saya tulis diatas, template ini menggunakan kode <b:if cond='...'></b:if> untuk mengelompokkan widget2nya sehingga ada beberapa widget blog yang tersembunyi pada main post dan begitu pula sebaliknya pada single post.

Secara garis besar, kode HTML (Layout > Edit HMTL) widget pada Sidebar seperti berikut :

<b:if cond='data:blog.url != data:blog.homepageUrl'>
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML3' locked='false' title='Widget 1' type='HTML'/>
<b:widget id='HTML2' locked='false' title='Widget 2' type='HTML'/>
</b:section>
</div>
</b:if>

Warna merah itu adalah kode untuk menghilangkan widget sidebar pada tampilan main post (liat ke-2 gambar diatas).

"Lha terus gimana kalo mau add widget baru pada sidebar??"

Untuk add widget baru pada sidebar, ada beberapa cara.

a. Copy n paste kode yang sudah ada pada sidebar
Cara ini hanya untuk widget HMTL/Javascript. Caranya, sobat cukup copy n paste kode berikut HMTL/Javascript berikut

<b:widget id='HTML2' locked='false' title='Widget 2' type='HTML'/>

Letakkan pada seperti pada susunan diatas. Ganti HTML2 misal menjadi HTML10 (ato terserah. jangan sama dengan HMTL yang lain) dan ganti juga Title/Judulnya dari Widget 2 misalnya menjadi Link Sobat. Jika sudah, save lalu sobat masuk ke single post. Nanti widget pada sidebar dengan judul Link Sobat akan muncul. Klik Edit (tanda obeng) dan masukkan kode/postingan ke widget tersebut.

b. Bisa juga lewat widget lain yang mucul pada tampilan Main Post.
Lihat gambar 2. Caranya, masuk ke Layout < for="expandWidgets">Expand Widget Templates) dan cari widget baru tersebut, kemudian cut dan paste pada sidebar. Save

c. Menambahkan widget langsung pada Sidebar
Cara yang ke 3 ini akan menampilkan Sidebar pada Layout (gambar 2). Beberapa bagian yang menjadi 1 kelompok dengan Sidebar dimana diawali

<b:if cond='data:blog.url != data:blog.homepageUrl'> dan diakhiri kode </b:if>

adalah Main-Wrapper, Search-box, dan Sidebar-Wrapper itu sendiri. Untuk bisa menambahkan widget langsung pada Sidebar, maka setiap bagian tersebut kecuali Sidebar-Wrapper harus diawali dengan kode

<b:if cond='data:blog.url != data:blog.homepageUrl'> dan diakhiri </b:if>

Save.

Jika sudah, masuk ke Layout > Page Element (widget Sidebar akan tampak). Kemudian, klik Add gadget dan pilih widget yang akan ditambahkan.

Jika sudah, klik Edit Html dan klik Expand Widget Templates.
Kemudian cari widget yang baru saja ditambahkan tersebut. Saya misalkan sobat menambahkan widget HTML/Javascript dan diberi judul Link Sobat.

Kode widget Link Sobat akan tampak seperti berikut

<b:widget id='HTML30' locked='false' title='Link Sobat' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:includable>
</b:widget>

* Perhatikan yang saya kasih warna merah

Ubah kode tersebut menjadi seperti ini

<b:widget id='HTML30' locked='false' title='Link Sobat' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url != data:blog.homepageUrl'>
<h2 class='title'><data:title/></h2>

<div class='widget-content'>
<data:content/>
</div>
</b:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>

* Perhatikan yang saya kasih warna merah.

Save

Berhubung file download template ini sudah ada bawaan widget HTML/Javascript, maka sobat juga harus melakukan hal yang sama seperti diatas untuk widget2 yang sudah ada.

Cara tersebut untuk widget HTML/Javascript. Jika sobat menambahkan widget lain, misalnya profil, akan menjadi sulit karena saya tidak tau, (belum tau) dimana kode

<b:if cond='data:blog.url != data:blog.homepageUrl'> dan </b:if> harus ditambahkan/diedit.

Disinilah repotnya jika menggunakan cara ke 3. Kalo sobat menggunakan cara ke 1 ato cara ke 2, semua widget pada Sidebar bisa diakali dengan mudah.


(Huhh... cape euy.. ngetiknya...)

Begitulah cara setting template ini. Jika sobat merasa bingung dengan penjelasan diatas (saya juga bingung sendiri..) sobat bisa meninggalkan komentar.

Blogger Template : Simple Magajah Template

Browsing2 dan melihat template blog yang seperti v-card, membuat saya pengen membuatnya dan, lahirnya blogger template Simple Magajah template Face Off Magajah ini, halah... Simple Magajah Face Off Magajah template ini saya khususkan hanya berupa link postingan pada tampilan utama (home). Pengaturan tampilan widget blog seperti header blog, sidebar blog dan footer blog menggunakan kode menghilangkan dan memunculkan widget blog alias menggunakan kode

<b:if cond='...'>

</b:if>

(untuk fungsi dari masing2 kode tersebut, InsyaAllah dipostingan berikutnya)

Berikut ini skrinshot dari template Simple Magajah Face Off Magajah.


Skrinshot tersebut adalah tampilan halaman HOME. Untuk tampilan tiap postingan, berbeda lagi. Untuk lebih jelasnya, berikut ini contoh untuk tampilan HOME dan untuk tampilan postingan.

Dan berikut ini tampilan layout blogger template Simple Magajah Face Off Magajah secara keseluruhan tanpa kode

<b:if cond='...'>

</b:if>

Klik gambar untuk memperbesar

Update :
- Nama templatenya saya ganti menjadi Template Face Off Magajah, hehehehe..

- Untuk download template ini, klik disini

Download Blogger Template Portal Magajah

Setelah template Ireng Manis dan template Layar Putih, sekarang giliran template Portal Magajah. Template Portal Magajah ini bergaya magazine dengan tambahan slideshow yang saya comot dari Webdesignbooth tetapi sudah saya edit2 sedikit.

Berikut ini skrinshot template Portal Magajah

Demo | Download | Setting

Free Blogger Template made in ireng_ajah

Lumayan lama juga gak update blog ini. Berikut ini blogger template made in ireng_ajah, halah terbaru setelah Ruang Biru template. Dan gak tanggung2, langsung 2 template, hehehehe..

1. Blogger template Layar Putih


Template ini saya tambahkan feature image slider dari Tutvalley yang saya edit2 ukurannya tapi gak tau kenapa, tampilan image slidernya gak sempurna jika dibuka di IE (yang lain sempurna) padahal saya cuma edit ukuran gambarnya saja. Gak apa2 juga, lha sekarang ini orang2 sudah mulai meninggalkan IE, hehehehehe.. Itu jika saya lihat dari trafik yang masuk dari Google Analitik.

Sobat bisa lihat demo blogger template Layar Putih atau download dan setting template ini.


2. Blogger template Ireng Manis

Template ini awalnya adalah template premium tapi sekrang sudah bisa di download.


Sobat bisa liat demo template Ireng Manis atau download dan setting template ini.


Setelah kedua blogger template diatas, berikutnya adalah giliran blogger template Portal Magajah. Template ini bergaya magazine dengan tambahan feature konten image slider dan 4 kolom pada tampilan utama. Sobat bisa lihat demo template Portal Magajah. Untuk link downloadnya, belum saya sediakan.

Template Baru : Ruang Biru Template

Postingan kemarin, saya sempet mati ide dan bingung dengan desain template dalam hal warna dan background. Kebingungan tersebut terjawab sudah, hehehehe.. karena template baru sudah saya rilis, yaitu Ruang Biru template.

Desain template ini inspirasi dari theme detik.com (walopun gak persis amat, hehehe..) dimana ada 3 kolom pada halaman utama tetapi pada sidebar, saya bagi menjadi 3 kolom yaitu kolom atas, kolom kiri dan kolom kanan.

Berikut ini skrinsot dari template Ruang Biru


Sobat bisa liat demo blogger template Ruang Biru atau donwload Ruang Biru template.