Thirteen Mag Blogger Template

Sebuah template "Thirteen Mag Blogger Template" telah saya buat dan sudah dianggap final untuk segera saya sebar agar bisa digunakan oleh komunitas blogger yang saya cintai. bidikCOM juga menggunakan template ini, hanya saja pada bagian footer saya rubah jadi tiga kolom.


" Thirteen Mag Blogger Template" ini terdiri dari :

• 13 kolom dengan perincian : 4 kolom atas dengan scroll, 3 kolom utama dan 6 kolom sebelum footer.
• Header dibagi dua kolom, jadi pengguna " Thirteen Mag Blogger Template" dapat menambahkan iklan dengan ukuran 486 X 100px.
• " Thirteen Mag Blogger Template" mempunyai navigasi menu yang mudah dioperasikan.
• " Thirteen Mag Blogger Template" diinstall pula Tabview yang terdiri dari 3 kolom.
• " Thirteen Mag Blogger Template" dengan readmore automatis.
• " Thirteen Mag Blogger Template" menerapkan sistem gulir pada bagian kotak atas dan Kotak Komentar

Cara install " Thirteen Mag Blogger Template" .

• Backup terlebih dahulu blog yang akan anda ganti dengan " Thirteen Mag Blogger Template" .
• Yakinkan secara manual dengan menyalin Widget yang ada pada blog anda dengan menggunakan notepad.
• Browse " Thirteen Mag Blogger Template" kemudian unggah " Thirteen Mag Blogger Template" .
• Setelah konfirmasi dan simpan " Thirteen Mag Blogger Template" .
• Selanjutnya terserah cara anda memperindah penampilan blog anda.

Cara dan larangan mengganti bagian-bagian tertentu.

1. Pengguna " Thirteen Mag Blogger Template" dimohon untuk tidak mengganti bagian credit - footer :

<div id='credit-footer'><!-- do not delete this section/jangan menghapus bagian ini -->
&lt;p&gt;
Copyright @ 2009 By : &lt;a href=&quot;http://www.nataludin.com&quot; target=&quot;_blank&quot;&gt;&lt;font color=&quot;yellow&quot;&gt;Ayomaos&lt;/font&gt;&lt;/a&gt; | Distribution by : &lt;a href=&quot;http://bcomstudio.blogspot.com&quot; target=&quot;_blank&quot;&gt;&lt;font color=&quot;yellow&quot;&gt;bCOMstudio&lt;/font&gt;&lt;/a&gt; | Powered By: &lt;a href=&quot;http://blogger.com&quot; target=&quot;_&quot; blank&gt;&lt;font color=&quot;yellow&quot;&gt;Blogger&lt;/font&gt;&lt;/a&gt; |
&lt;/p&gt;

&lt;p class=&quot;credit&quot;&gt;
&lt;a href=&quot;http://mozilla.com/firefox&quot; target=&quot;_&quot; title=&quot;Firefox&quot; blank&gt;&lt;img width=&quot;12&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5IEh1Fsrwq5fOCSY7zX2rSEiTqD5KrX7vBNZxtaT6zggILSHVW6M3EHi6l1_Sy7ISkLYFQCTTzWlqcimGNhP0bEf9LFEuucZyYx4JvRK2ENsHiqx1-YCFkKbdSCEv1DmCt-inwtmPG2ck/s1600-r/firefox-icon.gif&quot; height=&quot;12&quot;/&gt;&lt;/a&gt;

&lt;a href=&quot;
http://www.microsoft.com/windows/internet-explorer/default.aspx&quot; target=&quot;_&quot; title=&quot;Internet Explorer 8&quot; blank&gt;&lt;img width=&quot;13&quot; src=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhorrlncEXiC0w_XeL7dsEc9QX-z6ZmUrYGbc26a_qDHLQA0XTQDl3tmK5ta2MGVIz4_SjJFFKEo4D7ukNYJ7x4sOrdYpvHMOj1UWnQPmRowWDDkYgRQFCvJzmEQiTfjMnWty3tKFoLGifK/s1600-r/eweb-ie7.gif&quot; height=&quot;14&quot;/&gt;&lt;/a&gt;
&lt;/p&gt;
</div>

2. Judul Blog yang ada di Header-Left.

Anda harus membuat gambar dengan ukuran 400 X 100 px ( gunakan Adobe Photoshop), kemudian diupload pada www.photobucket.com. Setelah mendapatkan kode gambar, kemudian kode gambar tersebut di ENCODE. Dibawah ini contoh menambahkan kode yang sudah diencode.

<div class='headerleft'>

&lt;a href=&quot;http://s288.photobucket.com/albums/ll179/ahnning/?action=view&amp;current=headertemplatebarucopy.jpg&quot; target=&quot;_blank&quot;&gt;&lt;img src=&quot;http://i288.photobucket.com/albums/ll179/ahnning/headertemplatebarucopy.jpg&quot; border=&quot;0&quot; alt=&quot;magazine blogger template&quot;&gt;&lt;/a&gt;

</div>

Menambahkan kode IKLAN dibagian Header-right dengan cara encode kode iklan anda, kemudian tambahkan kode tersebut pada bagian header-right.

Contoh :

<div class='headerright'>

...... tempat kode iklan yang telah diencode ......

</div>


3. Mengganti bagian navigasi. Coba perhatikan susunan kode dibawah ini, kemudian lakukan penggantian sesuai dengan petunjuk yang ada di masing-masing bagian dari kode terebut.

<!-- This is the start of the menu -->
<div id='mainMenu'>
<a>Products</a><!-- ganti sesuai kemauan anda -->
<a>Support</a><!-- ganti sesuai kemauan anda -->
<a>About us</a><!-- ganti sesuai kemauan anda -->
<a>Download</a><!-- ganti sesuai kemauan anda -->
</div>
<div id='submenu'>
<!-- The first sub menu -->
<div id='submenu_1'>
<a href='http://ahn-bidikcom.blogspot.com'>Product 1</a><!-- ganti sesuai kemauan anda -->
<a href='http://ahn-bidikcom.blogspot.com'>Product 2</a><!-- ganti sesuai kemauan anda -->
<a href='http://ahn-bidikcom.blogspot.com'>Product 3</a><!-- ganti sesuai kemauan anda -->
</div>
<!-- Second sub menu -->
<div id='submenu_2'>
<a href='http://ahn-bidikcom.blogspot.com'>Phone</a><!-- ganti sesuai kemauan anda -->
<a href='http://ahn-bidikcom.blogspot.com'>Email</a><!-- ganti sesuai kemauan anda -->
<a href='http://ahn-bidikcom.blogspot.com'>Knowledge base</a><!-- ganti sesuai kemauan anda -->

</div>
<!-- Third sub menu -->
<div id='submenu_3'>
<a href='http://ahn-bidikcom.blogspot.com'>History</a><!-- ganti sesuai kemauan anda -->
<a href='http://ahn-bidikcom.blogspot.com'>The team</a><!-- ganti sesuai kemauan anda -->
<a href='http://ahn-bidikcom.blogspot.com'>Contact us</a><!-- ganti sesuai kemauan anda -->
<a href='http://ahn-bidikcom.blogspot.com'>Visions</a><!-- ganti sesuai kemauan anda -->

</div>
<!-- Fourth sub menu -->
<div id='submenu_4'>
<a href='http://ahn-bidikcom.blogspot.com'>Patches</a><!-- ganti sesuai kemauan anda -->
<a href='http://ahn-bidikcom.blogspot.com'>Whitepapers</a><!-- ganti sesuai kemauan anda -->
<a href='http://ahn-bidikcom.blogspot.com'>Tab menu</a><!-- ganti sesuai kemauan anda -->
<a href='http://www.nataludin.com'>Color picker</a><!-- ganti sesuai kemauan anda -->
<a href='http://www.nataludin.com'>Window scripts</a><!-- ganti sesuai kemauan anda -->
<a href='http://www.nataludin.com'>Games</a><!-- ganti sesuai kemauan anda -->


</div>
</div>
<br id='clearmenu'/>

4. Untuk perubahan pada tab view seperti saat anda menambahkan gadget pada sidebar.

Semoga "Thirteen Mag Blogger Template" ini bermanfaat khususnya bagi komunitas blogger.
Tinggalkan pesan bila anda membutuhkan bantuan, Insyallah saya bantu sampai saya ampun-ampun menyerah....

Demo dan Download bisa anda lihat di bCOMStudio.

Main Klik di B-u-x.net

Setelah job dari broker PTR kian hari kian sepi, terlebih setelah main petak umpet dengan ndoro Google tertangkap basah, kini T-mouse beralih fungsinya jadi Clicker di program Paid to Click yaitu B-u-x. net

B-u-x. net adalah Paid to Click yang diyakini oleh membernya bukan scam dan mungkin ini merupakan alternatif bagi mereka yang gemar berburu recehan. Pada B-u-x. net, setelah kita login kemudian klik SURF yang ada di toolbar B-u-x. net untuk menampilkan iklan.

Pada B-u-x. net terdapat iklan sebanyak 16 buah untuk member berstatus STANDART.
Sepertinya iklan yang ada tiap harinya tetap (muncul sekali dalam kurun waktu 24 jam), dengan perincian iklan di Kategori Arts & Entertainment (2 iklan), Business & Money (10 iklan), Computers & Internet (2 iklan), Health & Recreation (1 iklan) dan Charity & Nonprofit (1 iklan ). Sedangkan pada kotak paling bawah dengan border warna merah jangan diklik, karena jika anda mengkliknya maka earning anda akan direset dan payment ditolak. Perhatikan gambar iklan yang ada di B-u-x. net berikut ini :



Di B-u-x. net, selain situs ini loadingnya cepat sekali, prosesnya juga mudah. Anda cukup klik link dan melihat website selama 30 detik untuk mendapatkan uang sebesar $ 0.01. Anda dapat memperoleh penghasilan lebih dengan merujuk teman. Jika refferal anda melakukan kegiatan yang sama di B-u-x.net, maka anda juga akan mendapat $ 0.01 untuk setiap situs web yang diklik oleh refferal Anda. Permintaan pembayaran dapat dilakukan setiap hari dan diproses melalui PayPal atau AlertPay. Minimum pembayaran adalah $ 5,00 untuk pertama kali.

Langkah demi langkah cara klik iklan di B-u-x.net.

1. Klik SURF yang ada di toolbar B-u-x-. net untuk menampilkan iklan.
2. Klik Link Iklan yang ada, maka akan muncul jendela baru dengan perhitungan waktu mundur selama 30 detik.

3. Setelah perhitungan waktu selesai, akan muncul kode yang harus diklik pada deretan empat kode yang ada.


4. Setelah kode yang disebutkan kita klik, maka akan muncul tampilan berikut :



Sampai dengan saat ini Account Balance (cashout) saya di B-u-x.net sudah mencapai $4.99.
Jika anda ingin bergabung, silahkan klik iklan dibawah ini dan ini berarti anda menjadi refferal saya.

Update (2010) : Mohon maaf B-u-x,net adalah SCAM....SCAM...SCAM

Benah-benah blog

Sedikit-sedikit akhirnya template "Simple Magazine Style Blogger Theme" , yang semula saya beri nama Cerita Penaku, mendekati final.

"Simple Magazine Style Blogger Theme" aku uji cobakan pada bidikCOM yang sudah kembang kempis nafasnya, karena dikejar-kejar eyang google. Sepertinya blogku lebih berat lagi nich loadingnya jika dibanding dengan menggunakan template sebelumnya.

Aku sudah lupa, entah berapa kali bidikCOM berubah wajah dan tampilan. Maklum mumpung gratis dan tidak melanggar etos kerja, jadi ndak ada salahnya bila dijadikan sarana uji coba template "Simple Magazine Style Blogger Theme".

Dengan mengubah-ubah wajah bidikCOM, diharapkan bisa memicu kembali semangat ngeblog.
Kapan-kapan "Simple Magazine Style Blogger Theme" akan masuk dalam daftar bCOMstudio, setelah masa uji coba template berakhir.

Blog ' Cerita Penaku"

Setelah kemarin saya mencoba memodifikasi minima dengan menambahkan efek spoiler, kali ini saya memodifikasi minima kembali dengan beberapa kolom.

Template ini saya buat bagi mereka yang suka akan blog bergaya majalah. Template untuk kalangan Blogger ini terdiri dari : Navigasi menu yang saya pelajari dari www.dynamicdrive.com, empat kolom dengan tinggi yang sama dibawah header, tiga kolom utama, dan enam kolom diatas footer.

Masih dengan konsep portal, pada sub halaman sidebar kiri akan menghilang. Menggunakan readmore secara auto, dan saya juga mencoba menerapkan scroll pada bagian kolom komentar.

Template masih 80 % dalam proses, jika anda berminat silahkan kunjungi demonya.
Berikut adalah tampilan halaman utama template tersebut ( belum ada judul )



Dibawah ini adalah tampilan sub halaman


Kira-kira menurut anda, template ini diberi nama apa, ya?
Silahkan berikan ide-ide anda demi suksesnya pembuatan template ini, dan tentunya semakin cepat selesai, maka akan semakin cepat didownload oleh rekan-rekan yang membutuhkan.

DEMO | berikan komentar pada demonya, ya..... please!!!!

How blog advertising works?

Blogging has become a favorite hobby for many people, including me. Why blogging is in tune at this time? Because through the blog, we can express our thoughts as well as share knowledge and experiences with others. We can share opinions and interact through comments. Provide a channel to connect to the outside world, so hopefully will have more friends locally and internationally.

With blogging, we also have the opportunity to make money online even in your home. This is one of the easiest and effective way. Only need simple steps, namely to write a review or opinion about things that you like, write your opinions about products and services from a particular web site and people may think that this story really encouraged and can drive traffic to the advertiser's website . This is, how to blog advertising works.

If you are the people who want to gain knowledge of all things, you will realize that you can contribute with your blog readers, bloggers or even advertisers. Passion is the key success factors your blog. By increasing the quality of your blog, and know how to attract people to visit your blog, including attracting advertisers that advertise on the blog that you have created.

Blog advertising has become an effective way to promote products and services. For advertisers, they prefer to find a site / blog that can promote their business effectively. With hope will get the best results with minimum cost. For bloggers, this is a very good step to help promote their website / product / service quality by writing a review. This is a fun way to get ready for good money if you are willing to spend some time for it ..

If you are a good author, Payingpost give you the opportunity to join in order to obtain additional income. You can submit your article to Payingpost. Registration is easy and free, of course, you just read and follow the instructions carefully. If you have submitted the URL of your blog, Payingpost will review your blog.

Once your blog is approved, the opportunity will come. Then you can start to write a review to advertiser web sites, products or services. In addition to taking the opportunities that are available, from Payingpost advertisers can communicate with the blogger and ask them to place banner ads on your blog and of course you get paid for it.

One more before I finish writing this, Payingpost also does not require that the blog / site that will be listed must have a high PageRank. That makes me very enthusiastic about joining in Payingpost.
So, why have to wait, you can pursue this dream become a beautiful blog that is unique.

Memadukan Spoiler di Blogger Template

Sudah lama saya tidak otak-atik template, akhirnya kali ini saya mencoba memodifikasi minima dengan hasilnya adalah Spoiler Minima Template.

Mengapa saya sebut Spoiler Minima Template, karena di dalam Spoiler Minima Template ini terpasang sistem spoiler yang aku terapkan pada kolom dibawah navigasi menu. Apa sih Spoiler itu ? Anda bisa mengetahuinya di bCOMStudio, termasuk mendowload template tersebut.

Spoiler Minima Template ini sederhana, karena hanya terdiri dari dua kolom. Meskipun sederhana, tapi tidak boleh dipandang sebelah mata... apalagi dipandang dengan mata bathin.

Bagaimana saya menerapkan Spoiler ini pada Spoiler Minima Template, berikut penjelasannya :
(sebaiknya coba pada template baru dengan template minima dan ukuran width: 750px )
Langkah awal saya menambahkan dua buah kolom dibawah navigasi menu/ header atau di atas Content Wrapper.

Saya menambahkan kode berikut :

/* -- kotak dhukur -- */

#kotak {
width:750px;
clear:both;
margin:0 auto;
float:left;
padding: 10px 0;
color:#ffffff;
background:#434741;
border-top:#ffffff;
border-bottom:#ffffff;
}

#kotak a:link {
color:#006699;
text-decoration:none;
}

#kotak a:hover {
color:#c06000;
text-decoration:underline;
}

#kotak a:visited {
color:#808080;
text-decoration:none;
}

#kotak h2 {
color:#000000;
padding:10px 0 2px 0;
margin:0 0 10px 0;
border-bottom:1px dotted #333;
font-size:11px;
font-weight:bold;
line-height:1.4em;
text-transform:uppercase;
}

#kotak ul {
padding:0;
margin:0;
color:#333;
}

#kotak ul li {
list-style-type:none;
border-bottom:1px dotted #333;
background: url(&amp;quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNcus6vrktn3YwPsfUG5f60CXMavSqZT9E2ireJaVS21bBVBzyv6NRQX0J-Ny2s-pZOFfp-KtZ9yWTrWUOcKchEh0VEcakHns9xhTU0E5He2XjbDW_3w_e4hdI8w2BGn0B_3xJq3D28ME/s144/Arrobblue.png&amp;quot;) no-repeat 0px .17em; padding-left:17px;
margin-top:2px;
}

#kotak1 {
width:300px;
float:left;
padding-left:10px;
}

#kotak2 {
width:390px;
float:left;
padding:0 10px 0 10px;
border-left: 2px solid #ffffff;
}

Kemudian saya menambahkan kode berikut, di atas kode : <div id='main-wrapper'>

<div id='kotak'>
<b:section class='kotak' id='kotak1' preferred='yes'/>
<b:section class='kotak' id='kotak2' preferred='yes'/>
</div>

Kemudian saya menerapkan kode spoiler pada kode di atas, seperti ini :

<div id='kotak'>
&lt;div&gt;&lt;div style=&quot;margin: 5px;&quot;&gt;
&lt;div class=&quot;bigfont&quot; style=&quot;margin-bottom: 2px;&quot;&gt;&lt;input value=&quot;Show&quot; style=&quot;margin: 0px; padding: 0px; width: 60px; &quot; onclick=&quot;if (this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display != &#39;&#39;) { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;&#39;; this.innerText = &#39;&#39;; this.value = &#39;Hide&#39;; } else { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;none&#39;; this.innerText = &#39;&#39;; this.value = &#39;Show&#39;; }&quot; type=&quot;button&quot;&gt;
&lt;/div&gt;
&lt;div class=&quot;alt2&quot; style=&quot;border: 0px inset ; margin: 0px; padding: 6px;&quot;&gt;
&lt;div style=&quot;display: none;&quot;&gt;

<b:section class='kotak' id='kotak1' preferred='yes'/>
<b:section class='kotak' id='kotak2' preferred='yes'/>

&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;
</div>


Kata Show maupun Hide bisa dirubah sesuai keinginan.
Bila anda ingin mendowload daripada template ini, silahkan kunjungi bCOMStudio.

Pada demo template, anda juga bisa mencoba alunan musik berikut link downloadnya pada sidebar.

(Pesan Singkat : Pada template bCOMStudio telah saya terapkan kombinasi link iklan, jadi sebelum anda masuk ke URL sebenarnya, anda terlebih dahulu disodori halaman iklan. he..he..he.... saran saya diklik iklanya, biar bidikCOM dapat dollar....... wik, bCom ... malu-maluin....... )

DEMO

jQuery Scroll to Top Control

Hari ini, Jum'at 05 Juni 2009 secara serentak saya posting artikel tentang jQuery Scroll to Top Control di beberapa blog saya, termasuk menginstallnya. Setelah saya mempelajari dari situs www.dynamicdrive.com lalu menerapkan ke blog saya, pada awalnya gagal. Namun setelah saya cermati dari beberapa kode script yang ada kemudian menghilangkan sederetan kodenya, lalu memasang URL dari Image di dalam srolltopcontrol.js filenya kemudian mengupload file jsnya ke www.geocities.com dan yang terakhir masuk pada edit html blogger dan akhirnya......

Anda bisa mendemokannya sendiri di halaman blog IRENG ini yang bernasip malang karena digebug-ki oleh EG ( untung LW masih peduli sama blog ini sehingga masih dapat job..he..he.. , tapi untuk BV, nampaknya... ngeres kali), coba perhatikan saat anda scroll halaman setelah mencapai separuh dari halaman ini maka akan muncul ICON ANAK PANAH ATAS. Nah, silahkan diklik.. maka halaman akan menggulir ke atas secara automatis.... berjalan seperti ARGO ANGGREK jurusan Sidoarjo- BATAM- KALIMANTAN...... (Apa ada, ya..... jurusan kesana).

Dengan memasang kode script jQuery Scroll to Top Control khusus pada blog ini, terpaksa saya harus merubah susunan html dari CREDIT fixed yang ada di bottom bidikCOM ini. Dari padding yang semula 15 px, terpaksa saya geser jadi 60 px sekedar untuk memberikan kelonggaran bagi icon jQuery Scroll to Top Control untuk mampir dan nongol batang hidungnya agar bisa unjuk gigi yang kemudian akan diklik oleh pengunjung setia bidikCOM.

Oke, ndak usah lama-lama kita bahas secara singkat. Bila ingin melihat gambaran yang lebih lengkap anda bisa ABSEN HADIR di AYOMAOS.

Silahkan login di blogger, tanpa contreng kotak Expand Widget Template ( karena bidikCOM memang tidak punya hak pilih), lalu cari kode : <head>.

Langkah selanjutnya dalam menambahkan script dari jQuery Scroll to Top Control adalah tambahkan kode dibawah ini persis dibawah kode <head> dan sebelum kode META.

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'></script>

<script type='text/javascript' src='http://www.geocities.com/nataludin5/scrolltopcontrol-1.js'>

/***********************************************
* Scroll To Top Control script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Project Page at http://www.dynamicdrive.com for full source code
***********************************************/

</script>

Oh,ya... mengapa harus dipasang persis dibawah kode <head> dan sebelum kode meta ( Verifikasi, keyword dll )? Hali ini agar jQuery Scroll to Top Control berfungsi dengan normal, dan ICONnya bisa ngintip kegiatan t-mouse para pengunjung kali..he..he..

Ini lho gambaran tempat jQuery Scroll to Top Control dipasang.



( sorry... gambarnya aku kasih tulisan bidikCOM yang gede, soalnya beberapa artikel saya di COPAS oleh salah satu blogger yang sempat nyasar di bidikCOM sampai akar-akarnya tanpa sungkan-sungkan dan tidak ada embel-embel url sumbernya..heik.. rasain luh... ojo nesu!!! )

Oke silahkan dicoba, anda juga bisa belajar di http://www.dynamicdrive.com/dynamicindex3/scrolltop.htm, kalau anda ingin memodifikasi dari script jQuery Scroll to Top Control pada srolltopcontrol.js filenya. Daku sudah mumet, jadi gantian anda yang memodifikasi. Yang penting saya sudah ngasih tutorial yang terbaik buat sobat setia bidikCOM untuk mempercantik blognya..... gratis... cukup do'in panjang umur sehat wal'afiat ..amien.