Gilang Tutorial

Cara Membuat Burung Twitter Di Blog

Selamat pagi , siang , sore , magrib , malam gan . kali ini saya akan memposting postingan TUTORIAL BLOG , yaitu Cara Membuat Burung Twitter Di Blog , mungkin sekarang jika agan agan memakai HTML / JavaScript kemungkinan sudah tidak work , akan tetapi masih ada cara kok gan memakai tips dari saya / tetangga yang saya copas script nya , bagi yang belum tahu apa itu burung twitter saya akan menjelaskan nya sedikit . Burung Twitter Dalam Blog adalah Mempromosikan akun twitter anda di blog anda sendiri , dengan sekali klik di burung twitter tersebut , maka akan muncul halaman akun twitter anda , sekian penjelasannya dan langsung ke intinya , berikut langkah langkahnya :

1. Pertama , login ke blogger lalu pilih blog yang agan ingin tempelkan burung.

2. Kedua , pilih menu template kemudian pilih edit html

3. lalu cari kode </body>

4. Copy code dibawah ini tepat diatas kode </body>

. <script src='http://yourjavascript.com/1523826141/Flying twitter bird.js' type='text/javascript'>
</script> <script type='text/javascript'> var twitterAccount = "Nama Akun Anda"; var tweetThisText = " <data:blog.pageTitle/>: <data:blog.url/> "; tripleflapInit(); </script>

Keterangan : Tulisan Berwarna Merah : Nama Akun Twitter Anda
Tulisan Berwarna Biru : Nama Blog anda

Sekian tutorial yang sampaikan , jika tutorial diatas ada kekurangan tolong komentar dibawah ya :)

Baca Selengkapnya >>>

Cara Membuat Tombol / Button ( Update )

Hai sobat , di karenakan post tentang atrikel ini yang sebelum nya kurang menarik dan belum lengkap , makanya saya update menjadi lengkap walau tanpa gambar , dalam tutorial inibisa digunakan dalam postingan maupun widget sidebar , lebih menarik bukan ? , berikut langkah langkah dari saya :

sebagai contoh , saya akan memberi demo walaupun tidak ada link nya ( didemo selanjutnya ada kok )

- Pertama , buat entri baru di blog agan

- Kedua , klik menu HTML di bawah judul entri sebelah kiri

- Ketiga , masukan script berikut ini

<button>Masukan Teks Agan Disini</button>

Lalu jika agan ingin menambahkan link pada tombol/button , agan bisa ikuti langkah saya , sama seperti diatas langkahnya hanya script nya berbeda :

.<a href="gilangsa-tutorial.blogspot.com"><button>Masukan Teks Agan Disini</button></a>

Dan hasilnya seperti ini :

*

Jika agan ingin langsung auto new tab , maka agan harus mengikuti script dibawah berikut

<a href="gilangsa-tutorial.blogspot.com" target="blank"><button>Masukan Teks Agan Disini</button></a>

dan hasilnya :

*

Keterangan : ganti teks biru dengan url yang ingin dituju

Agan juga bisa menambah kan di sidebar atau ditempat agan mau , bagi agan yang belum tahu caranya , agan bisa mengikuti tuturial di bawah ini :

- Klik menu tata letak diblogger

- tambahkan widget did tempat agan mau

- masukkan script berikut

Semoga Bermanfaat

sekian tutorial dari saya , jika ada kekurangan tolong komentar dibawah

Baca Selengkapnya >>>

Cara Membuat SUB MENU BAWAAN BLOG

Hai gan , artikel ini berbeda dengan artikel sub menu sebelumnya , yang sebelumnya itu untuk para blogger amatiran - pro ( mungkin ) saja , karna pada artikel ini hanya berlaku untuk Pemula atau biasa disebut newbie .. , Sub menu di artikel ini tidak sama sekali menggunakan Kode CSS , HTML atau sebagainya , sub menu tersebut dapat dilakukan secara instant ( Bawaan Blog ) , tak menyangka blog telah menyediakan fitur ini , tetapi sayangnya tidak ada dropdown menu , jika ingin menambah kan Menu Dropdown pada menu , baca artikel ini

berikut langkah langkah Cara Membuat SUB MENU BAWAAN BLOG

- Pertama , login ke blogger

- kedua pilih blog yang ingin ditempelkan dengan sub menu ini

- Pilih menu tata letak

- Pilih Gadget di bawah Header

- Pilih Menu " Laman "

- Tambah Tautan Eksternal .

- Isi dengan cara di bawah ini.

- Terakhir, klik simpan setelan , dan simpan

Sekian Tutorial Dari Saya
Tentang Cara Membuat Sub Menu Bawaan Blog
Jika ada kekurangan berkaitan dengan artikel Tolong komnetar dibawah dan akan dibahas secepatnya
Please Like , Follow Blog Ini

Salam Gilang

Baca Selengkapnya >>>

Cara Membuat Sub Menu Di Blog

Salam Bloggers , saya akan berbagi ilmu kepada kalian Cara Membuat Sub Menu Di Blog dengan menggunakan HTML/JavaScript , dan ini sangat mudah tentunya . jika menggunakan kode CSS / HTML di Edit Html itu sebenarnya agak susah , jika agan memakai cara ini tentunya akan simple karna tidak memengaruhi kode CSS . Bentuk sub menu nya bisa dilihat diblog saya , juga bisa dilihat dari gambar diatas , walaupun tidak dapat merubah warna BACKGROUND , tetap akan menarik kok gan :D, agan tertarik ? , ikuti langkah langkah yang saya buat dibawah ini :

- Pertama tama , agan harus login ke Blogger

- Setelah agan ke blogger , pilih blog yang ingin ditempelkan sub menu ini

- Yang ketiga , pilih menu tata letak , atau bisa lihat gambar dibawah ini

- Lalu pilih Tambahkan Gadget/ widget dibawah header . ( NB : Bagi yang sudah menggunakan Gadget dibawah header , tidak berlaku untuk tutorial ini )

- Pilih Menu HTML/JavaScript

- Tambahkan Kode Berikut :

<div id="RickyMenu">
<div id="Rickybox">
<ul id="punch">
<li><a href="#">Beranda</a></li>
<li>
<a href="#">Contoh Menu</a>
<ul>
<li>
<a href="#">Contoh Menu Dropdown #1</a>
<ul>
<li><a href="#">Dropdown #1</a></li>
<li><a href="#">Dropdown #2</a></li>
<li><a href="#">Dropdown #3</a></li>
</ul>
</li>
<li><a href="#">Dropdown #2</a></li>
<li><a href="#">Dropdown #3</a></li>
<li><a href="#">Dropdown #4</a></li>
</ul>
</li>
<li><a href="#">Daftar Isi</a></li>
<li><a href="#">Blog Page</a></li>
</ul>
</div>
</div>

Keterangan : Teks Biru : URL yang ingin dituju
Teks Merah : Nama Menu

Untuk yang tidak ada Dropdown

.<div id="RickyMenu">
<div id="Rickybox">
<ul id="punch">
<li><a href="URL ANDA">Beranda</a></li>
<li>
<a href="URL ANDA">Daftar Isi</a><li>
<li>
<li><a href="URL ANDA">Menu</a></li>
<li><a href="URL ANDA">Contact</a></li>
</li></li></li></ul>
</div>
</div>

Keterangan : Teks Biru : URL yang ingin dituju
Teks Merah : Nama Menu

Sekian tutorial dari saya , jika ingin cara menambahkan menu / berkaitan dengan artikel ini tolong komentar dibawah , dan jgn lupa ikuti blog ini

Baca Selengkapnya >>>

Cara Mengubah Cursor Di Blog

hai gan , saya update lagi :D , kali ini saya akan berbagi ilmu kepada agan agan bagaimana cara merubah cursor . tampak nya para blogger telah bosan dengan cursor biasa biasa saja , dan tidak sesuai dengan template blog agan , seperti contoh , blog saya berwarna biru muda , dengan cursor standart sih , tampilan blog saya biasa biasa saja, tapi dengan saya menyesuaikan warna cursor dengan warna blog template saya , blog saya kelihatan menjadi sedikit menarik , karna cursor pun memengaruhi blog agan agan . oke , sekarang langsung aja ke intinya , ikuti langkah langkah saya di bawah ini

- Pertama , agan harus login blogger dan pilih blog yang akan di tempelkan dengan cursor baru

- Kedua , Pilih menu tata letak

- Ketiga , lalu agan kunjungi web cursors-4u

- Keempat , Pilih cursor agan suka ( sekedar tips untuk memudahkan pencarian cursor pakailah categories yang agan suka )

- Kelima , Setelah agan memilih cursor , copy HTML code .. ( jika tidak ada , anda harus cari yang
lain )

- Keenam , Pilih Tambahkan Gadget

- Ketujuh , Pilih menu HTML/JavaScript

- Kedelapan , Simpan

dan lihat blog agan

Sekian tutorial dari saya , jika ada kekurangan tolong tinggalkan jejak di komentar serta like & follow facebook & Twitter agar agan bisa melihat Postingan secara instant

Baca Selengkapnya >>>

Cara Membuat / Memasang Auto Read More

Cara Membuat / Memasang Auto Read More adalah andalan para blogger untuk menjadikan blog blogger menjadi sederhana / simple . Guna Read More adalah untuk mempersingkat postingan atau artikel yang agan publishkan . Tetapi , para blogger sudah mengenal apa itu read more , jadi tidak perlu dijelaskan lagi . berikut demo nya :

Dari gambar diatas, read more dilengkapi dengan tampilan gambar dari salah satu halaman posting, posisi gambar disebelah kiri dan diteruskan dengan sedikit penjelasan dari isi artikel. Cara membuat / memasang auto read more. Ikuti langkah-langkah dibawah ini.

1 . Login ke blogger , pilih blog , pilih pengaturan template

2 . Pilih menu Edit HTML seperti yang saya gambarkan diatas

3 . Cari kode </head> , Gunakan CTRL + F

4 . Jika sudah ketemu , copy script berikut tepat dibawah kode </head>

<script type='text/javascript'>
var thumbnail_mode = "yes";
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 150;
img_thumb_width = 150;
</script>
<script type='text/javascript'>
//<![CDATA[
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(thumbnail_mode == "yes") {
    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>

Keterangan kode diatas :

summary_noimg = 430; Jumlah huruf tanpa gambar
summary_img = 340; Jumlah huruf dengan gambar
img_thumb_height = 150; Tinggi Gambar
img_thumb_width = 150; Lebar Gambar

5 .Selanjutnya , cari kode <data:post.body/> , dan ganti kode tsb dengan kode dibawah ini

<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<div style='text-align:justify;' expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'> createSummaryAndThumb("summary<data:post.id/>");
</script>
<a class='more' expr:href='data:post.url'><font color='#1780dd'>Baca Selengkapnya >>></font></a>
</b:if>
</b:if>

6 . ada sekitar 2/3 kode <data:post.body/> , ganti semuanya

7 . kode <font color='#1780dd'>Baca Selengkapnya >>></font></a> . Tulisan Baca Selengkapnya bisa diganti dengan kata yang kamu inginkan, <font color='#1780dd'> Ini kode warnanya, bisa diganti dengan warna lain. >>> ini kode tanda >>> setelah tulisan Baca selengkapnya.

8 . Terakhir , Save Template , Semoga bermanfaat untuk agan agan

Sekian Tutorial Dari Saya
Tentang Cara Membuat / Memasang Auto Read More
Jika ada kekurangan berkaitan dengan artikel Tolong komnetar dibawah dan akan dibahas secepatnya
Please Like , Follow Blog Ini

Salam Gilang

Baca Selengkapnya >>>

Cara Membuat Ikon Sosial Media Di Blog

sosial media telah dikenal dengan kalangan pengguna internet , dan juga dikenal oleh dunia , salah satu yang paling terpopuler adalah Facebook dan Twitter , fungsi sosial media adalah komunikasi jarak jauh . Kali ini saya akan memposting Cara Membuat Ikon Sosial Media Di Blog dengan 1 kali klik dapat berpindah ke halaman sosial media agan , Berikut Demo ikon nya .

Sudah lihat kan ikon nya ? apa agan tertarik ? ikuti langkah langkah dibawah ini :

1 . Loggin ke Blogger

2 . Pilih menu tata letak diatas template

3 . Tambahkan Widget yang akan ditempati oleh Ikon Sosial Media

4 . Dan pilih menu HTML/JavaScript

5 . Copy semua script berikut .

Ket : Teks Merah : Nama Halaman Sosial Media Anda
Teks Biru : Ukuran Ikon ( saya sih , s40 )

6 . Terakhir Simpan , semoga bermanfaat

Sekian Tutorial Dari Saya
Tentang Cara Membuat Ikon Sosial Media Di Blog
Jika ada kekurangan berkaitan dengan artikel Tolong komnetar dibawah dan akan dibahas secepatnya
Please Like , Follow Blog Ini

Salam Gilang

Baca Selengkapnya >>>