Komputer DotCom: Blogging

Showing posts with label Blogging. Show all posts

Friday, 16 May 2014

Cara Menghubungkan Blog dengan Facebook dan Twitter

Blogging Admin 21:26

Salam Komputer's - Bagi kamu yang mempunyai facebook dan twitter pasti akan segera share posting kamu di sana. Tapi cara ini mungkin akan sangat merepotkan bagi sebagian orang. Pertama orang harus login ke facebook atau twitter itu sendiri. Lalu copy paste url blog. Belum lagi jika kita ingin menggunakan fasilitas url shortener supaya tweet tidak terlalu banyak karakter. Nah dengan cara ini kamu tidak perlu mengalami itu semua. Memang dulu saya menggunakan cara di atas he..he..he.. Tapi sekarang sudah tidak lagi semenjak saya menggunakan twitterfeed. Lalu bagaimana caranya. Langsung saja kita ke TKP :

1. Ke twitterfeed.com

2. Klik register now. Lalu isi form yang ada

3. Isi form dengan Nama Feed dan Blog/Feed Url

4. Lanjut ke step 2

5. Pilih social media yang ingin kamu hubungkan dengan blog kamu

6. Jika sudah dihubungkan klik all done

Nah sekarang kamu tidak perlu repot lagi untuk masuk ke facebook atau twitter untuk mengupdate post baru. Semoga bermanfaat. Jangan lupa tinggalkan komentar kamu.

Wednesday, 27 February 2013

Cara Membuat Tombol Share Keren di Blog

Blogging Admin 23:50

Siang mas Bro n mbak Bray...! Sudah lama gak bagi2 tpi kali ini aku akan membagikan sebuah tips blogging yang gak kalah kerennya nih, yaitu cara mambuat tombol share blog kita ke jejaring sosial seperti twitter, facebook, yahoo dan lain-lain, nah sebelum membuatnya, kita sedikit bahas dulu yuk, apa sih manfaat dari tombol share yang ada di blog kita?

Tombol share yang sering kita jumpai di blog-blog lain, atau blog saya ini berfungsi untuk membagikan link blog yang kita baca, ke situs jejaring sosial. Misalnya begini, ada seseorang yang sangat tertarik dengan salah satu artikel di blog saya, nah si orang itu ingin membagikannya ke teman-temannya, nah untuk mempermudah orang itu, kita gunakan tombol share ini, selain bermanfaat bagi orang itu, secara tidak langsung blog kita ikut terpromosi oleh orang itu sob.

Sebetulnya ada beberapa macam tombol share, namun menurut saya inilah yang paling keren dan paling enteng, mengapa saya bilang paling enteng? karena gadget ini memang tidak berat, hehehe... langsung saja yuk kita buat.

1. Login blog sobat.

2. Pilih Tata letak, Tambah Gadget.

3. Kemudian pilih HTML/JavaScript.

4. Lalu masukan kode dibawah ini.

</script>

5.Yang terakhir, simpan dan lihat hasilnya.

Ouke semoga bermanfaat untuk sobat semua, dan terimakasih...

Tuesday, 15 January 2013

Cara Membuat Search Engine di Blog

Blogging Admin 22:48

Search Engine atau Mesin Pencari, pastinya sobat sudah tidak asing lagi karena setiap kita browsing akan selalu berhubungan dengan Search Engine baik itu Search Engine Google, Yahoo, Bing dan lain-lain. Nah sekarang bagaimana jika Search Engine tersebut kita pasang di Blog ? Yup tentu bisa, Search Engine sangat disarankan untuk dipasang di blog.

Dengan Membuat Search Engine Di Blog, kamu sudah melakukan salah Satu Optimasi Seo On Page. Kenapa demikian ? Ya.. dengan kamu memasang Search Engine Di Blog kamu, pengunjung akan lebih mudah menemukan artikel yang dicari dengan demikian akan meningkatkan jumlah Page View blog kamu.

Cara Membuat Search Engine Di Blog :

1. Login ke Dashbord blog kamu
2. Jika sudah, kamu pilih Tata Letak
3. Jika sudah Klik Add a Gadget atau Tambah Gadget
4. Pilih Widget HTML/JavaScript
5. Copas Kode berikut ini, dan masukan kedalam kolom Widget HTML/JavaScript

<form name="jksearch" action="http://www.google.com/search" method="get" onsubmit="jksitesearch(this)" target="_blank">

<input id="hiddenquery" type="hidden" name="q" />

<div style="font: normal 11px Arial;color:#666;padding:2px 0;">

<input name="se" type="radio" checked /> Google

<input name="se" type="radio" /> Yahoo

<input name="se" type="radio" /> Msn

</div>

<script type="text/javascript">

// All-in-one Internal Site Search script- By JavaScriptKit.com (http://www.javascriptkit.com)

// For this and over 400+ free scripts, visit JavaScript Kit- http://www.javascriptkit.com/

// This notice must stay intact for use

//Enter domain of site to search.

var domainroot="http://ariezjuelekz.blogspot.com/"

var searchaction=[ //form action for the 3 search engines

"http://www.google.com/search",

"http://search.yahoo.com/search",

"http://search.msn.com/results.aspx"

]

var queryfieldname=["q","p","q"] //name of hidden query form for the 3 search engines

function switchaction(cur, index){

cur.form.action=searchaction[index]

document.getElementById("hiddenquery").name=queryfieldname[index]

}

function jksitesearch(curobj){

for (i=0; i< document.jksearch.se.length; i++){ //loop through radio to see which is checked

if (document.jksearch.se[i].checked==true)

switchaction(document.jksearch.se[i], i)

}

document.getElementById("hiddenquery").value="site:"+domainroot+" "+curobj.qfront.value

}

</script>

</form>

5. Ganti kode yang berwarna Merah dengan Url Blog kamu
6. Sekarang Klik Simpan
7. Selesai dan Lihat Hasilnya

Semoga tutorial ini bermanfaan bagi anda sekalian, mohon maaf jika ada kesalahan dalam penulisan.

Saturday, 12 January 2013

Cara Menampilkan Postingan Blog Ke Facebook Secara Otomatis

Blogging Admin 00:16

Bagaimana sih cara share atau menampilkan postingan blog ke Facebook? - Dengan tutorial ini yang jelas akan meningkatkan jumlah page view blog anda, karena secara otomatis postingan anda nantinya akan tampil di public Facebook dan temen-temen anda yang ada di jejaring sosial facebook dan akan melihat postingan blog anda, jadi mereka akan tahu kalau anda mempunyai blog dengan konten yang berkualitas dan layak untuk dibaca. Nah cara yang akan diterapkan di pembahasan ini yaitu dengan menggunakan aplikasi RSS Graffiti Facebook (FB) untuk share artikel blog. Sedangkan di Facebook sendiri fasilitas RSS Graffiti ini menjadi jembatan untuk memudahkan postingan-postingan blog melintas didalamnya, sehingga public bisa mengetahuinya.

Cara Submit RSS Feed Blog ke Facebook (FB) Melalui RSS Graffiti
1.Silahkan menuju ke aplikasi RSS Graffiti di http://apps.facebook.com/rssgraffiti/
2. Berikutnya klik "Add New Publishing Plan"
3. Isi nama judulnya, contoh "Blog Komputer DotCom". Lalu klik lagi "Create Publishing Plan"

4. Lalu klik "Add New" pada bagian Source
5. Silahkan isi dengan alamat feed blog anda misalnya http://ariezjuelekz.blogspot.com/feeds/posts/default. Lalu klik "Add Source"

6. Selanjutnya pada bagian "Target", klik "Add New"
7. Lalu pilih halaman fan pages dan pada "Post Style" biarkan Standard, lalu klik "Save Changes"

8. Langkah terakhir yaitu menghubungkan SOURCE ke TARGET dengan klik tombol OFF menjadi ON, maka warna akan berubah menjadi hijau. Dengan begitu postingan blog otomatis bisa ditampilkan ke Facebook.

Cukup paham bukan? Kalau begitu saya akhiri pembahasan tentang cara mensubmit artikel/postingan blog secara otomatis ke Facebook. selamat mencoba dan happy blogging.

Wednesday, 12 December 2012

Cara Mebuat Read More (TerBaru)

Blogging Admin 18:29

Jumpa lagi kawan dengan Ariez yang Nggak Pernah Cuakep....kwkwkwk :-p
Kali ini saya mencoba ber eksperimen dengan HTML yaitu membuat READ MORE TerBaru. Untuk versi Auto Read More terbaru kali ini sepertinya lebih canggih lagi, karena fungsi pemenggalan kalimat langsung bekerja secara otomatis tanpa harus menambahkan kode diatas.

Trus..hebatnya lagi, fungsi Read More ini mampu menampilkan image pertama dalam postingan dan mem-fload image tersebut di awal paragraf awal, meskipun gambar yang kita letakan berada di tengah atau akhir postingan. Mungki lebih nyaman saya sebut saja dengan fasilitas image thumbnail.

Tidak hanya itu saja, kita dapat juga pengatur jumlah karakter yang ditampilkan. Disini ada 2 pilihan untuk jumlah karakter. Yang pertama, jumlah karakter yang ditampilkan jika ada image yang diikutsertakan dalam postingan dan yang kedua jumlah karakter tanpa image. Masih bingung maksudnya? sama..yang jelasin juga puyeng wkwkwkw Ya sudah, biar sama2 gak pusing langsung ke tutorialnya saja ok.

Penting! Yang sudah memasang Read More versi lama sebaiknya di kodenya kembalikan dulu ke seperti semula, caranya hapus kode yang berwarna merah dibawah ini (Setiap template mungkin berbeda, jadi tinggal disesuaikan saja)

<div class='post-header-line-1'/>
<div class='post-body'>
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>
<a expr:href='data:post.url'>Readmore</a>
</b:if>
<div style='clear: both;'/>

OK, kalo sudah tinggal lanjutkan dengan tutorial dibawah.

Pertama, silahkan tuju langsung ke halaman EDIT HTML, Cari kode </head> kemudian letakan script dibawah ini di atas kode </head> Kalo sudah, jangan lupa di simpan terlebih dahulu.

Langsung copy paste aja kode dibawah ini:

<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</script>

<script type='text/javascript'>
//<![CDATA[
/******************************************
Auto-readmore link script, version 2.0 (for blogspot)

(C)2008 by Anhvo

visit http://en.vietwebguide.com to get more cool hacks
********************************************/
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}

function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}

var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>

Masih pada halaman EDIT HTML, Beri tanda centang pada "Expand widget template" lalu temukan kode seperti dibawah

<data:post.body/>

Kalo sudah, ganti kode <data:post.body/> dengan semua kode dibawah ini

<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><a expr:href='data:post.url'>READ MORE - <data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

silahkan disimpan dan lihat hasilnya :)

Keterangan:

var thumbnail_mode = "float"; (kita dapat memutuskan apakah letak thumbnail berada di (float) kiri atau jika tidak silahkan ganti dengan (no-float)
summary_noimg = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting tanpa gambar / thumbnail)
summary_img = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting dengan gambar / thumbnail)
img_thumb_height = 120; (Thumbnail 'tinggi dalam piksel)
img_thumb_width = 120; (Thumbnail 'lebar dalam piksel)

Selamat mencoba dan semoga berhasil eksperimennya...happy tutorial with Komputer DotCom :-)

Wednesday, 11 July 2012

Cara Membuat Blog Gratis

Blogging Admin 09:40

Artikel kali ini saya khususkan bagi sobat yang benar benar awam mengenai cara membuat blog gratis, jadi bagi sobat yang sudah memahami dan menguasai ilmu cara membuat blog abaikan saja artikel ini.

Sebenarnya ada banyak layanan yang menyediakan blog gratis, beberapa diantaranya :
- blogger.com
- wordpress.com
- blogdetik.com
- blog-roll.info
- wordblog.pl
- dll

Namun kali ini saya akan menerangkan bagaimana Cara membuat blog gratis secara cepat dan mudah. yaitu kita memakai layanan Blogspot di blogger.com

Langkah awal untuk membuat sebuah blog gratis adalah :

1. Anda diwajibkan memiliki sebuah alamat email, saran saya pakailah layanan gmail dari google. untuk membuat email dari layanan google tersebut anda bisa langsung menuju ke Gmail

2. Langkah selanjutnya bila anda telah memiliki sebuah email silahkan kunjungi Blogger.com untuk membuat sebuah blog gratisan dengan contoh url seperti ini http://NAMABLOG.blogspot.com, seperti gambar dibawah ini.

3. Klik Daftar pada blogger.com, isilah data data tersebut dengan lengkap. pada kolom pertama masukkan email yang sudah anda buat tadi pada tahap awal. setelah semua data di isi centang tanda Saya menerima Persyaratan dan Layanan. lalu klik Lanjutkan.

4. Anda baru saja membuat akun di blogger.com, selanjutnya silahkan klik Tombol Buat blog, lalu isi Judul Blog, alamat blog, sesuai dengan keinginan anda, setelah semuanya benar lalu klik lanjutkan. silahkan pilih template standar yang sudah disediakan. dalam beberapa saat blog anda pun sudah jadi dengan judul dan url yang anda tentukan tadi.

5. Tahap selanjutnya anda tinggal mengklik entri baru untuk membuat sebuah artikel, nah mudah bukan cara membuat blog gratisan. oiya untuk pemula silahkan copy paste artikel milik temannya.
Salam Blogger...

Monday, 9 July 2012

Cara Merubah Warna Background/Latar Posting

Blogging Admin 21:35

Bagi Anda yang ingin merubah penampilan blog supaya menghasilkan blog yang enak dilihat namun tidak membuat silau mata, ada baiknya mencoba tips yang akan saya sampaikan dibawah ini. Walaupun banyak sekali yang membahas tentang bagaimana cara merubah background blog namun sekali lagi saya ingatkan bahwa postingan ini sudah saya praktekan sehingga berbagai kesalahan sudah bisa diminimalisir hehehehe... Yuk kita mulai merubah background Postingan Blogspot

1. Merubah Background Header Blog
Letaknya adalah paling atas, biasanya digunakan untuk meletakan judul blog, baik itu berupa tulisan atau sebuah banner. Cara merubahnya adalah :
Masuk Dashboard-->Tata Letak-->Edit html, jangan lupa centang dulu Expand Widget Templates kemudian cari tulisan #header-wrapper menggunakan CTRL+F ,saya contohkan hasilnya akan seperti ini.

#header-wrapper {
background: #f4f4f4
dan seterusnya........

Jika Anda ingin merubah warna dengan kode #000000 maka hasilnya akan seperti ini :

#header-wrapper {
background: #000000
dan seterusnya........

Bila tidak menemukan tulisan background: #f4f4f4 Anda bisa menambahkannya sendiri tulisan tersebut tepat dibawah #header-wrapper { Apabila sudah sesuai silahkan simpan atau pratinjau terlebih dahulu.

2. Merubah Warna Background Body
Terletak paling dasar atau dibalik halaman posting. Cara merubahnya :

Masuk Dashboard-->Tata Letak-->Edit html, Centang Expand Widget Templates kemudian cari tulisan body { menggunakan CTRL+F ,saya contohkan hasilnya akan seperti ini.

body {
background: #000000
dan seterusnya........

Silahkan Anda sesuaikan dengan kode warna yang diinginkan apabila selesai klik simpan.

3. Merubah Warna Background Halaman Postingan / Main body
Terletak paling tengah dan dijadikan sebagai tempat posting. Cara merubahnya adalah :

Masuk Dashboard-->Tata Letak-->Edit html, entang Expand Widget Templates cari tulisan #main-wrapper { menggunakan CTRL+F ,saya contohkan hasilnya akan seperti ini.

#main-wrapper {
background: #000000
dan seterusnya........

Silahkan Anda sesuaikan dengan kode warna yang diinginkan, apabila selesai klik simpan.

4. Merubah Warna Background Sidebar
Terletak disebelah halaman posting/main body, cara merubahnya adalah :

Masuk Dashboard-->Tata Letak-->Edit html, centang Expand Widget Templates kemudian cari tulisan&n #sidebar-wrapper { menggunakan CTRL+F ,saya contohkan hasilnya akan seperti ini.

#sidebar-wrapper {
background: #000000
dan seterusnya....

Silahkan Anda sesuaikan dengan kode warna yang diinginkan, apabila selesai klik simpan.

5. Merubah Warna Background Footer
Terletak berada paling bawah halaman blog,cara merubahnya adalah :
Masuk Dashboard-->Tata Letak-->Edit html, centang widget Templates kemudian cari tulisan #footer { menggunakan CTRL+F ,saya contohkan hasilnya akan seperti ini.

#footer {
background: #000000
dan seterusnya...

Silahkan Anda sesuaikan dengan kode warna yang diinginkan, apabila selesai klik simpan.
Sekian dulu dari saya, selamat mencoba dan berhasil....

Saturday, 7 July 2012

Cara Meningkatkan Traffic

Blogging Admin 05:33

View more documents from oonaries

Friday, 6 July 2012

Memasang Like Facebook Sebelum Masuk Blog

Blogging Admin 21:30

Seperti dengan judulnya , Memasang Like Facebook Page Sebelum Masuk Ke blog . Tampilan Like Facebook Page akan muncul sebelum masuk ke blog . Widget ini disediakan oleh kakinetwork.com . Kalau sobat mau memasang nya ikuti Tutorial berikut ini :

1. Sing in akun blogger
2. Klik Rancangan => Edit HTML => Expand Template Widget
3. Cari kode <body expr:class='"loading" + data:blog.mobileClass'> atau <body> dengan menggunakan Ctrl +F
4. Setelah ketemu masukkan kode dibawah ini tepat dibawah kode No. 3

<script type='text/javascript'>KNFBFansPRO="Komputer DotCom"</script>
<link href='http://kakinetwork.com/sources/fbfans-pro/kakiblogger.css' rel='stylesheet' type='text/css'/>
<script src='http://yourjavascript.com/0143115100/jquery.js' type='text/javascript'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1' type='text/javascript'/>
<script src='http://yourjavascript.com/5400531110/likeboxfbfan-pro.js' type='text/javascript'/>
<script language='javascript'>
$(document).ready(function() {
$('body').KNFBFansPRO( {
url: "https://www.facebook.com/KomputerDotCom",

tunggu: 15,
wait: 1440,
tutup: false
} );
});
</script>
<div id='fbtpdiv'/>

Keteranagn :
=> Kode Warna BIRU yaitu Nama Facebook Page
=> Kode Warna MERAH yaitu Url Facebook Page

5. Simpan
Semoga berhasil...

Thursday, 5 July 2012

Cara Memasang Iklan Sejajar atau Berdampingan

Blogging Admin 09:13

Bagaimana sih cara memasang Iklan Sejajar atau Berdampingan? Saya tertarik sekali kepingin memasang iklan berdampingan.

Untuk cara Pasang Iklan Sejajar Atau Bersebelahan kamu bisa ikuti langkah-langkah yang sudah saya tulis di postingan ini.

Pertama-tama dapatkan dulu script iklannya, terserah kamu mau pakai iklan ppc lokal atau adsense sekalipun. Untuk menempatkan kedua iklan tersebut secara bersebelahan atau sejajar, maka kita menggunakan script Table. Kalo mau menempatkan iklan dengan Gadget copy aja script berikut di lokasi iklan yang anda inginkan,

<TABLE BORDER="0" BORDERCOLOR="#336699" CELLPADDING="0" CELLSPACING="0" WIDTH="100%">
<TR>
<TD>

kode iklan 1

<TD>
<TD>

kode iklan 2

</TD>
</TR>
</TABLE>

Langkah selanjutnya, ganti tulisan berwarna ungu dengan script untuk iklan bagian kiri dan ganti tulisan berwarna biru untuk script iklan bagian kanan, save lalu lihat hasilnya.

Untuk menempatkan Iklan Dibawah Posting caranya, cari kode <data:post.body/> kemudian letakkan kode scriptnya tepat dibawah <data:post.body/>
Tapi sebelum dipasang kode iklannya silahkan di Parse terlebih dahulu, Untuk memparse kode klik Disini
Oke, silahkan dipraktekkan untuk cara Pasang Iklan Sejajar Atau Bersebelahan. Semoga berhasil...

Friday, 29 June 2012

Parse HTML

Blogging Admin 13:01

Start Convert Now!

(Silahkan masukkan kode HTML kamu didalam kotak di bawah ini)

Cara Memasang Kotak Komentar FB

Blogging Admin 07:38

Membuat kotak komentar facebook di blog ternyata gampang-gampang susah. Saya sendiri sudah mencoba beberapa tutorial, namun beberapa kali saya mengalami kegagalan. Tapi bagi sobat semua yang ingin memasang kotak komentar facebook diblog tidak usah khawatir karena saya sendiri telah menemukan trik yang sederhana dan itu telah saya praktek pada blog ini. Gak percaya?? Lihat saja postingan ini.

Baiklah agar tidak berlarut-larut dan langsung ke pokok pembahasannya, ikuti saja langkah dibawah ini.

Log in ke account blogger
Pilih desain selanjutnya pilih edit html dan klik lanjutkan
Jangan lupa centang Expand Template Widget
Sekarang cari kode <b:includable id='status-message'> dan diatas kode tersebut sobat akan menemukan kode ini </b:includable>
Copy kode dibawah ini

<b:if cond='data:blog.pageType == "item"'> <div id='fb-root'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<fb:comments expr:href='data:post.url' num_posts='5' width='500'/>
</b:if>

Letakkan kode tersebut diatas kode </b:includable> Perhatikan kode yang berwarna biru (500), itu ukuran lebar kotak comment fb anda. gantikan kode tersebut menurut templates blogger anda.
Dan yang terakhir jangan lupa disimpan

Selamat mencoba dan sukses buat kamu...

Tuesday, 26 June 2012

Cara Membuat Link Cloud Tanpa Edit HTML

Blogging Admin 23:28

Dalam artikel kali ini, saya akan menjelaskan bagaimana cara membuat daftar link cloud dengan animasi flash pada blog anda dengan mudah. kode ini dibuat oleh Roy Tanck yang semulanya digunakan untuk plugin Wordpress kemudian di konversi untuk bisa digunakan di Blogger. Hasilnya Arahkan kursor anda pada objek untuk melihat animasinya. Menurut anda bagaimana, bagus kan?

Bila dilihat dari segi tampilan widget ini tampak seperti label cloud animasi flash yang kini banyak digunakan tapi yang membedakan widget ini, yaitu secara manual anda bisa memasukkan URL link apa saja yang anda kehendaki seperti membuat label, menampilkan judul artikel, daftar link blog anda dll. Bagaimana anda tertarik?

Widget ini dapat di tempatkan pada sidebar blog anda, berikut caranya :

Login ke blog anda
Pada halaman dasbor pilih rancangan/layout
Buat Gadget baru, pilih HTML/JavaScript
Masukkan kodeini

<embed allowscriptaccess="always" bgcolor="#ffffff" flashvars="hicolor= 0xF3A217&tcolor=0x000000&mode=tags&distr=true&tspeed=100&tagcloud=<tags>

    <a href='URL Link Anda' style='24'>Judul Link Anda</a>
    <a href='URL Link Anda' style='24'>Judul Link Anda</a>
    <a href='URL Link Anda' style='24'>Judul Link Anda</a>
    <a href='URL Link Anda' style='24'>Judul Link Anda</a>
    <a href='URL Link Anda' style='24'>Judul Link Anda</a>
    <a href='URL Link Anda' style='24'>Judul Link Anda</a>

    </tags>" height="220" id="tagcloud" name="tagcloud" quality="high" src="http://www.roytanck.com/wp-content/plugins/wp-cumulus/tagcloud.swf" type="application/x-shockwave-flash" width="350"></embed>

Keterangan :

bgcolor=#ffffff (warna latar)
hicolor=0xF3A217 (warna hover)
tcolor=0x000000 (warna huruf)
tspeed =100 (kecepatan animasi)
width="350" (lebar)
height="150" (tinggi)
style=24 (besar huruf)

Untuk memasukkan kode ke dalam postingan maka kode harus di Parse terlebih dahulu kemudian paste kodenya di dalam entri pada mode HTML.
Mudah Bukan...

Friday, 22 June 2012

Cara Memasang Form Langganan Artikel di Blog

Blogging Admin 08:43

cara memasang form langganan artikel atau bisa juga kita sebut subcribe to artikel, kali ini ,inilah yang dibahas berry blog, ini berguna untuk para pengunjung yang ingin berlangganan artikel pada blog kita, jadi mereka update dengan artikel blog kita . ini cara membuat form berlangganan artikel melalui email di blog :

Kunjungi feedburner

Click Create an account jika belum memiliki google account, apabila sudah memiliki google account, ketik alamat email pada kotak Email : dan Password pada kotak Password kemudian klik sign ini untuk masuk ke feedburner.

Bagi yang belum memiliki google account silahkan buat terlebih dahulu sebuah akun baru anda di google dengan cara klik pada Create an Account dan ikuti langkah selanjutnya seperti membuat sebuah email baru.

Berikutnya mari kita lanjutkan cara mendaftar dan membuat langganan artikel di Blog kita, dengan asumsi bahwa anda sudah memiiliki akun google.

Ketik alamat url blog sobat seperti pada My Feeds neen to socialize.

Ketik alamat url blog sobat di kotak yg sudah tersedia.

Kemudian klik Next sehingga muncul jendela Identify Feed Source.

Biarkan saja secara default.

Klik Next hingga muncul window Welcome! Lets us burn a feed for you Ubahlah feed title misalnya kolom blog gratis ( ganti sesuai dengan selera ).

Klik Next untuk masuk ke window Congrats! your feedburner feed is now live. Want to dress it up litle ? klik Skip Directly to feed management.

Perhatian! apabila sobat hendak melengkapi settingan feed sobat sebaiknya klik Next, tapi karea artikel ini menjelaskan cara membuat Langganan artikel di blog maka saya sengaja melewati langkah setting feeds yang lainnya.

Pada window feed anda klik menu Publicize, Email Subscriptions.

Kemudian klik Activate.

Pada jendela Subscriptions management contreng atau centang pada tulisan Send me an email whenever people unsubscribe ( will be sent to your "from" address ). Ini dengan maksud agar kita bisa mengetahui apabila seseorang hendak membatalkan berlangganan menerima email dari setiap artikel yang kita posting di blog.

Klik Save dan copy kode dalam kotak Subscribe Link Code dan pastekan di website atau blog sobat blogger.

Setiap pengunjung blog yang ingin memperoleh artikel secara gratis dari pemilik blog dapat memasukkan alamat emalnya di kotak kosong kemudian klik Langganan, Dan setiap kali kita sebagai pemilik blog melakukan posting artikel maka artikel tersebut juga akan dikirim ke orang - orang yang sudah mendaftarkan emailnya melalui form tersebut. inilah cara mudah membuat kotak form langganan artikel pada blog, semoga bermanfaat .

Monday, 18 June 2012

Cara Membuat Tab View Menu

Blogging Admin 10:01

Untuk menghemat tempat, tab view menu sangat efisien. Ukuran yang relatif kecil tapi bisa memuat banyak space.

Membuat menu dengan tab view memerlukan kode HTML yang lumayan panjang dan agak ribet, jadi sebaiknya simak baik – baik tutorial ini dan yang paling penting jangan lupa untuk backup template sobat terlebih dahulu.

Jika setelah jadi nanti lebar atau tinggi menu tidak sesuai, silahkan sobat sesuaikan sendiri dengan isi dari menu yang sobat gunakan. Karena jika tidak mengerti akan jadi berantakan atau terlihat jelek. Oke sob, sudah mengerti toh…mantaabbbbb kita langsung ke TKP.

Silahkan login ke blogger dengan ID sobat tentunya.
Tuju Tata Letak.
Klik Edit HTML.
Jangan lupa backup template sobat terlebih dahulu dengan mengklik Download Template Lengkap.
Kemudian letakkan kode javascript berikut sebelum kode </head>

<script type='text/javascript'>
//<![CDATA[
function tabview_aux(TabViewId, id)
{
var TabView = document.getElementById(TabViewId);
// ----- Tabs -----
var Tabs = TabView.firstChild;
while (Tabs.className != "Tabs" ) Tabs = Tabs.nextSibling;
var Tab = Tabs.firstChild;
var i   = 0;
do
{
    if (Tab.tagName == "A")
    {
      i++;
      Tab.href      = "javascript:tabview_switch('"+TabViewId+"', "+i+");";
      Tab.className = (i == id) ? "Active" : "";
      Tab.blur();
    }
}
while (Tab = Tab.nextSibling);
// ----- Pages -----
var Pages = TabView.firstChild;
while (Pages.className != 'Pages') Pages = Pages.nextSibling;
var Page = Pages.firstChild;
var i    = 0;
do
{
    if (Page.className == 'Page')
    {
      i++;
      if (Pages.offsetHeight) Page.style.height = (Pages.offsetHeight-2)+"px";
      Page.style.overflow = "auto";
      Page.style.display = (i == id) ? 'block' : 'none';
    }
}
while (Page = Page.nextSibling);
}
// ----- Functions -------------------------------------------------------------
function tabview_switch(TabViewId, id) { tabview_aux(TabViewId, id); }
function tabview_initialize(TabViewId) { tabview_aux(TabViewId, 1); }
//]]>
</script>
Setelah itu letakkan kode berikut di atas kode ]]></b:skin>

div.TabView div.Tabs
{
height: 30px;
overflow: hidden;
}
div.TabView div.Tabs a
{
float: left;
display: block;
width: 98px; /* Lebar Menu Utama Atas */
text-align: center;
height: 30px; /* Tinggi Menu Utama Atas */
padding-top: 3px;
vertical-align: middle;
border: 1px solid #BDBDBD; /* Warna border Menu Atas */
border-bottom-width: 0;
text-decoration: none;
font-family: "Verdana", Serif; /* Font Menu Utama Atas */
font-weight: bold;
color: #000; /* Warna Font Menu Utama Atas */
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
}
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active
{
background-color: #E6E6E6; /* Warna background Menu Utama Atas */
}
div.TabView div.Pages
{
clear: both;
border: 1px solid #BDBDBD; /* Warna border Kotak Utama */
overflow: hidden;
background-color: #E6E6E6; /* Warna background Kotak Utama */
}
div.TabView div.Pages div.Page
{
height: 100%;
padding: 0px;
overflow: hidden;
}
div.TabView div.Pages div.Page div.Pad
{
padding: 3px 5px;
}
Kemudian Simpan Template.
Langkah selanjutnya, silahkan sobat klik Tata Letak.
Klik Elemen Halaman dan tambahkan Gadget.
Pilih yang HTML / Javascript, dan tambahkan kode berikut kedalamnya.

<form action="tabview.html" method="get">
<div class="TabView" id="TabView">
<div class="Tabs" style="width: 300px;">
<a>Tab 1</a>
<a>Tab 2</a>
<a>Tab 3</a>
</div>
<div class="Pages" style="width: 300px; height: 250px;">
<div class="Page">
<div class="Pad">
Tab 1.1 <br />
Tab 1.2 <br />
Tab 1.3 <br /> </div>
</div>
<div class="Page">
<div class="Pad">
Tab 2.1 <br />
Tab 2.2 <br />
Tab 2.3 <br />
</div>
</div>
<div class="Page">
<div class="Pad">
Tab 3.1 <br />
Tab 3.2 <br />
Tab 3.3 <br /> </div>
</div>
</div>
</div>
</form>
<script type="text/javascript">
tabview_initialize('TabView');
</script>
Kemudian Simpan.

Keterangan :

Untuk kode yang berwarna merah adalah lebar dan tinggi menu, silahkan sobat sesuaikan dengan isi.
Kode yang berwarna biru silahkan sobat isi dengan judul - judul dari menu.
Dan yang berwarna ungu, adalah isi dari menu. Sobat bisa menambahkan link, gambar, banner, dll.

Oke sobat, selamat bereksperimen.

Thursday, 14 June 2012

Blogging Admin 20:04

Postingan kali ini saya akan membahas bagaimana Caranya Menambahkan 4 Kolom Tambah Gadget Di Atas Footer. langsung saja kita kupas Trik Blogger Cara Menambahkan 4 Kolom Di Atas Footer,

Jangan kebanyakan iia sobat kolom footernya,hehehe nanti sobat sendiri yang bingung mau di apakan itu footer .tapi buat sobat yang masih kurang dengan kolom footernya bisa langsung ikuti langkah-langkah Cara Membuat Footer Menjadi 4 Kolom di bawah ini .

Cara Membuat Footer Menjadi 4 Kolom

1.Seperti biasa Login Dulu ke blogger.

2.Klik Tata Letak.

3.Klik Edit HTML.

4.Selanjutnya silakan sobat cari kode ]]></b:skin> .

5.Jika sudah ketemu Copy dan paste kode di bawah ini tepat di atas kode ]]></b:skin> .

#footer-column-divide {
clear:both;
}
.footer-column {
padding: 10px;
}

6.Selanjutnya silakan sobat cari kode dibawah ini .

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

7.Jika sudah ketemu Hapus kode <b:section class='footer' id='footer'/> kemudian ganti bengan kode dibawah ini .

<div id='footer-column-divide'>

<div id='footer1' style='width: 25%; float:left;
margin:0; text-align:left;'>
<b:section class='footer-column' id='col1'
preferred='yes' style='float:left;'/>
</div>

<div id='footer2' style='width: 25%; float: left;
margin:0; text-align: left;'>
<b:section class='footer-column' id='col2'
preferred='yes' style='float:left;'/>
</div>

<div id='footer3' style='width: 25%; float: right;
margin:0; text-align: left;'>
<b:section class='footer-column' id='col3'
preferred='yes' style='float:right;'/>
</div>

<div id='footer4' style='width: 25%; float: right;
margin:0; text-align: left;'>
<b:section class='footer-column' id='col4'
preferred='yes' style='float:right;'/>
</div>

8.Klik Simpan Template .

9.Jika berhasil maka hasilnya adalah seperti di bawah ini .

10.Selamat Mencoba...

Komputer DotCom