Selamat datang di Blog Bagas, Blog Yang Sangat Sederhana ini. Semoga Isinya Dapat Membantu Anda. Happy Blogging !!
Tampilkan postingan dengan label Tutorial Blog. Tampilkan semua postingan
Tampilkan postingan dengan label Tutorial Blog. Tampilkan semua postingan

Sabtu, 07 April 2012

Setting Custom Domain Untuk Blogger

Bila anda menghendaki domain anda diarahkan ke blogspot yang sudah anda buat, maka ada dua hal yang harus dilakukan :
1.  Mengarahkan CNAME dari domain anda ke  ghs.google.com
Anda perlu manage DNS, bila kesulitan bisa minta bantuan kami dengan mengirim email ke support@idwebhost.com untuk kami bantu setingkan.
2. Seting di blogspot anda untuk diganti dengan domain tersebut.
Caranya dengan login ke blogspot.com lalu lakukan langkah-langkah berikut ini :
Versi Bahasa Inggris :
1. Login di blogger. Pilih menu “Setting –> Publishing
2. Kemudian klik link Switch to : Custom Domain

3. Kemudian klik lagi link Already own a domain? Switch to advanced settings

4. Kemudian isikan nama blog kamu di kolom “Your Domain” (mohon diisikan dengan
www, contoh http://www.NAMADOAMINNYA.com)
5. Lalu Klik tombol “Save Setting
6. kemudian ada menu www di redirect ke NAMADOMAINNYA, dicentang kemudian Klik tombol “Save Setting
Versi Bahasa Indonesia:
1. Login di blogger. Pilih menu “Pengaturan –> Publikasikan
2. Kemudian klik link Switch to : Domain Ubahsuaian

3. Kemudian klik lagi link Beralihlah ke pengaturan lanjut
4. Kemudian isikan nama blog kamu di kolom “Domain Anda” (mohon diisikan dengan
www. contoh http://www.NAMADOAMINNYA.com)
5. Lalu Klik tombol “SIMPAN SETELAN
6. Centang opsi mengarahkan ke www.NAMADOMAINNYA.com

7. Isikan verisikasi kata kemudian Klik tombol “SIMPAN SETELAN
Untuk domain .id
- A record diarahkan ke IP ghs.google.com yaitu  209.85.175.121 (bisa berubah bila ada update dari google)
- mail diarahkan ke ghs.google.com.
– Update –
Tampilan Baru Dasboard Blogger mungkin akan membingungkan anda dalam seting domin custom, berikut ini tutorialnya :
1. Masuk ke blogger.com
2. Klik Tanda panah ke Bawah dan pilih Setelan (setting)
3. Klik Tambahkan Domain bah Sesuaian (Add Domain Custom)
4. Klik Alihkan ke Setelan Lanjutan (Advanced Settings)
5. Tuliskan nama domain Anda (Tulis dengan WWW)
6. Lalu Klik Simpan (Save)
7. Setelah klik simpan (save), masih belum selesai, Klik Edit
8. Centang Kotak kecil untuk mengarahkan domainAnda.com ke www.DomainAnda.com
9. Klik Simpan (Save)

Selasa, 03 April 2012

Membuat Link Follow Blog

Ane dapat info dikit nih, buat sahabat BLOG BAGAS.

Cekibrott aje, ane males basa-basi lagi

Kita semua pengguna blogspot tentu sudah familier dengan yang namanya widget follower blog. Widget follower blog adalah sebuah fasilitas standard blogspot yang digunakan untuk memudahkan seseorang untuk mengikuti perkembangan/update suatu blog.

Tampilan standard dari widget follower pada blogspot sebagai berikut:


gb.1. widget follower pada blogspot


Jika kamu ingin mengikuti/follow blog tersebut maka kamu tinggal klik saja pada tulisanJoin this site

Kemudian nanti akan muncul sebuah kotak konfirmasi buat kamu (Lihat gambar berikut).

Untuk melanjutkan/mengikuti blog tersebut maka kamu klik saja tombol FOLLOW

Nah, posting saya kali ini ingin menunjukkan bahwa kotak widget follower blog seperti pada gambar 1 diatas itu ternyata bisa dihilangkan dari blog dan kita ganti dengan sebuah link saja.

Memangnya kenapa harus dihilangkan?

Alasannya, menurut pengalaman saya, kotak widget follower blog standard itu mengandung banyak eror css/html. Saya sudah melakukan percobaan pada blog saya, pertama pada blog ini saya pasang kotak widget follower lalu saya cek erornya menggunakan w3 validator dan ditemukan 70 eror, lalu saya hapus kotak widget follower dari sidebar blog dan saya ulangi lagi pengecekan eror css/html dengan w3 validator dan ternyata jumlah erornya berkurang lebih dari 10 buah, bukankah itu membuktikan bahwa kotak widget follower ternyata mengandung script eror dan itu tidak baik untuk blog kita? 

(bagi yang ingin mengurangi eror css/html pada blog silahkan baca CARA MENGURANGI EROR HTML PADA BLOG )

Lanjut lagi ke pembahasan kita.
Lantas, bagaimana menggantikan kotak widget follower blog kita agar orang lain bisa tetap mudah mem-follow blog kita sekaligus kita bisa meminimalisir eror script pada blog kita?

Untuk mengatasi permasalahan tersebut saya gunakan sebuah link untuk memudahkan orang lain mem-follow blog saya. Hasilnya seperti pada gambar berikut:



Bagaimana cara membuatnya?

Untuk membuatnya mudah saja, silahkan lihat panduan gambar dibawah ini:

- Pertama Login ke blogspot kamu
- Masuk ke menu/halaman pengaturan Tampilan/Design blog kamu
- Cari Widget Top Tabs



 - Setelah menemukan Top Tabs, lalu klik Edit
Maka akan muncul kotak seperti berikut:



 - Masukkan URL berikut http://www.blogger.com/follow-blog.g?blogID=xxxxxxxxxxxxxxxxxx pada kolom New Site URL

(Pada tulisan blogID=xxxxxxxxxxxxxxxxxx silahkan kamu ganti kode X dengan kode ID blog kamu)

ID blog merupakan deretan angka yang ada pada URL blogspot kamu saat kamu berada pada posisi halaman edit template atau posisi halaman posting.


ID Blog ada pada akhir URL halaman posting


Setelah kamu Copy URL yang saya sebutkan diatas  dan juga sudah kamu tambahkan ID blog kamu, (Misal : http://www.blogger.com/follow-blog.g?blogID=12345678901234567)lalu masukkan URL tersebut ke kolom New Site URL pada widget Top Tab


- Isi juga bagian New Site Name
- Lalu klik ADD LINK
- Terakhir klik SAVE

Semoga trik sederhana Membuat Link Follow Blog ini dapat bermanfaat buat para blogger indonesia. 
atau bisa juga di modif kayak ane gan, tuh, liet di atas :D

Minggu, 01 April 2012

Cara Memasukkan Video youtube Ke posting Blog

Ini gan, si dek echa minta ane kasitau  Cara Memasukkan Video youtube Ke posting Blog ini, langsung aja cekibrot gan..

Bagi teman – teman blog bagas yang belum tahu cara memasukkan video dari youtube.com ke dalam postingan blogspot, semoga tips ini berguna. Bagi yang sudah tahu, semoga bisa menambahi kalau ada yang kurang.
Berikut ini langkah – langkah Cara Memasukkan Video Youtube Ke Postingan Blogspot:
* Login dulu ke account blogspot, kemudian langsung pilih NEW POST.
* Buka www.youtube.com, lalu pilih video sesuai keinginan anda.
* Pada halaman youtube.com sebelah kanan terdapat keterangan URL dan Embeed.
* Nah, kode yang ada di Embeed itu silahkan anda copy dan paste di posting blogspot. Lalu klik PUBLISH POST.
* Silahkan anda cek hasilnya dengan klik VIEW BLOG dan walla…, video dari youtube.com tampil di blog anda.

Rabu, 28 Maret 2012

Merubah blog dari blog Nofollow, menjadi Dofollow

dofollowCara Membuat Blog Menjadi Dofollow - Blog Dofollow sudah merajarela dimana-mana, dan telah tersebar hingga seluruh dunia. Menanggapi request dari sahabat Deny maka Deny akan menuliskan artikel cara membuat blog menjadi dofollow.

Banyak sobat blogger yang membuat blog menjadi dofollow hanya untuk mendapatkan komentar yang banyak. Selain itu menurut mereka blog dofollow akan menghasilkan pengunjung yang banyak dan terus setia berkunjung dan bahkan berkomentar di blognya.
Jika menurut saya, blog dofollow dan nofollow itu hampir sama saja, namun yang membedakan blog dofollow memberikan backlink yang lebih banyak saat berkomentar daripada blog nofollow, maka itulah yang menimbulkan minat pengunjung untuk berkomentar di blog dofollow.

Apakah anda sudah yakin ingin merubah blog anda menjadi dofollow? Jika anda berminat silakan ikuti tutorial berikut di bawah ini:

1. Login ke akun blogger sobat.
2. Pergi ke tab rancangan, lalu pilih edit html.
3. Centang expand template widget, lalu cari kode berikut:
 rel='nofollow'> 
4. Hapus kode yang berwarna merah di atas, sehingga kodenya akan menjadi seperti ini:
> 


5. Lalu cari kode berikut ini:
rel='nofollow'> 


6. Kemudian hapus kode yang berwarna merah di atas, sehingga kodenya akan menjadi seperti ini:


> 

7. Simpan template.

Kini, Blog anda sudah menjadi blog dofollow. Semoga bermanfaat

Selasa, 27 Maret 2012

Membuat slide login / register panel di blog

Selamat sore sobat blogger, agan-agan dan agan wati sekalian, ini ane mau share cara Membuat slide login / register panel di blog

langsung aja cekidot gan,
Login Form yang akan saya bahas hanya Contoh dan tidak dapat digunakan layaknya Login Form seperti di Facebook, Twitter, atau yang lainnya. Karena Blog ini terbuka untuk umum tanpa perlu mendaftar menjadi Member.
Sebagai contoh sobat bisa melihat pada screenshot dibawah ini:

Sceenshot/Demo

Form tersebut berada di atas header blog/nafbar blog, dengan efek sliding.
Seperti itulah kiranya yang akan saya buat, bila sobat tertarik, langsung saja berikut langkah-langkah membuatnya:

1. Login ke akun blogger sobat
2. Masuk Rancangan/Layout
3. Pilih Edit HTML
4. Klik "Download Template Lengkap" (ini untuk memBackUp template sobat)
5. Beri tanda centang "Expand Template Widget"
6. Lalu carilah kode:
7. Bila sudah ketemu, letakan kode berikut di atas kode



8. Setelah itu cari kode: ]]> setelah ketemu copy paste-kan kode berikut tepat diAtasnya


/***** clearfix *****/
.clear {clear: both;height: 0;line-height: 0;}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
.clearfix {height: 1%;}
.clearfix {display: block;}

/* Panel Tab/button */
.tab {
background: url(http://web-kreation.com/demos/Sliding_login_panel_jquery/images/tab_b.png) repeat-x 0 0;
height: 42px;
position: relative;
top: 0;
z-index: 999;
}

.tab ul.login {
display: block;
position: relative;
float: right;
clear: right;
height: 42px;
width: auto;
font-weight: bold;
line-height: 42px;
margin: 0;
right: 150px;
color: white;
font-size: 80%;
text-align: center;
}

.tab ul.login li.left {
background: url(http://web-kreation.com/demos/Sliding_login_panel_jquery/images/tab_l.png) no-repeat left 0;
height: 42px;
width: 30px;
padding: 0;
margin: 0;
display: block;
float: left;
}

.tab ul.login li.right {
background: url(http://web-kreation.com/demos/Sliding_login_panel_jquery/images/tab_r.png) no-repeat left 0;
height: 42px;
width: 30px;
padding: 0;
margin: 0;
display: block;
float: left;
}

.tab ul.login li {
text-align: left;
padding: 0 6px;
display: block;
float: left;
height: 42px;
background: url(http://web-kreation.com/demos/Sliding_login_panel_jquery/images/tab_m.png) repeat-x 0 0;
}

.tab ul.login li a {
color: #15ADFF;
}

.tab ul.login li a:hover {
color: white;
}

.tab .sep {color:#414141}

.tab a.open, .tab a.close {
height: 20px;
line-height: 20px !important;
padding-left: 30px !important;
cursor: pointer;
display: block;
width: 100px;
position: relative;
top: 11px;
}

.tab a.open {background: url(http://web-kreation.com/demos/Sliding_login_panel_jquery/images/bt_open.png) no-repeat left 0;}
.tab a.close {background: url(http://web-kreation.com/demos/Sliding_login_panel_jquery/images/bt_close.png) no-repeat left 0;}
.tab a:hover.open {background: url(http://web-kreation.com/demos/Sliding_login_panel_jquery/images/bt_open.png) no-repeat left -19px;}
.tab a:hover.close {background: url(http://web-kreation.com/demos/Sliding_login_panel_jquery/css/../images/bt_close.png) no-repeat left -19px;}

/* sliding panel */
#toppanel {
position: absolute;
top: 0;
width: 100%;
z-index: 999;
text-align: center;
margin-left: auto;
margin-right: auto;
}

#panel {
width: 100%;
height: 270px;
color: #999999;
background: #272727;
overflow: hidden;
position: relative;
z-index: 3;
display: none;
}

#panel h1 {
font-size: 1.6em;
padding: 5px 0 10px;
margin: 0;
color: white;
}

#panel h2{
font-size: 1.2em;
padding: 10px 0 5px;
margin: 0;
color: white;
}

#panel p {
margin: 5px 0;
padding: 0;
}

#panel a {
text-decoration: none;
color: #15ADFF;
}

#panel a:hover {
color: white;
}

#panel a-lost-pwd {
display: block;
float: left;
}

#panel .content {
width: 960px;
margin: 0 auto;
padding-top: 15px;
text-align: left;
font-size: 0.85em;
}

#panel .content .left {
width: 280px;
float: left;
padding: 0 15px;
border-left: 1px solid #333;
}

#panel .content .right {
border-right: 1px solid #333;
}

#panel .content form {
margin: 0 0 10px 0;
}

#panel .content label {
float: left;
padding-top: 8px;
clear: both;
width: 280px;
display: block;
}

#panel .content input.field {
border: 1px #1A1A1A solid;
background: #414141;
margin-right: 5px;
margin-top: 4px;
width: 200px;
color: white;
height: 16px;
}

#panel .content input:focus.field {
background: #545454;
}

/* BUTTONS */
/* Login and Register buttons */
#panel .content input.bt_login,
#panel .content input.bt_register {
display: block;
float: left;
clear: left;
height: 24px;
text-align: center;
cursor: pointer;
border: none;
font-weight: bold;
margin: 10px 0;
}

#panel .content input.bt_login {
width: 74px;
background: transparent url(http://web-kreation.com/demos/Sliding_login_panel_jquery/images/bt_login.png) no-repeat 0 0;
}

#panel .content input.bt_register {
width: 94px;
color: white;
background: transparent url(http://web-kreation.com/demos/Sliding_login_panel_jquery/images/bt_register.png) no-repeat 0 0;
}

#panel .lost-pwd {
display: block;
float:left;
clear: right;
padding: 15px 5px 0;
font-size: 0.95em;
text-decoration: underline;
}


9. Lanjut lagi sob, cari lagi kode: kemudian letakan kode dibawah ini tepat diAtasnya

Welcome In Kode Blogger

Contoh Sliding Login Dengan JQuery

Disamping ini adalah contoh Sliding Login menggunakan JQuery. Login Form Disamping hanya Contoh dan tidak dapat digunakan layaknya Login Form FB, Karena Blog ini terbuka untuk umum tanpa perlu mendaftar menjadi Member

Tutorial Blog

Untuk membuatnya Silahkan : Klik Disini

Member Login

Not a member yet? Sign Up!


Perhatikan kode diatas yang diberi warna Kuning dan Hijau, gantilah tulisan tersebut sesuai keinginan sobat.

10. Seepp, selesai sob, jangan lupa klik Simpan/Save Template, dan lihat hasilnya.
 
Selamat mencoba, dan semoga bermanfaat. Salam Blogging... \m/

Sumber Kode Blogger

Jumat, 23 Maret 2012

cara menghilangkan tanda obeng dan tang

Cara Menghilangkan Tanda Obeng dan Tang di Blog

Tanda tersebut sebenarnya bukan merupakan suatu masalah, karena tanda tersebut hanya muncul jika pemilik blog sedang login di account blognya dan hanya muncul di komputer orang tersebut. Jadi orang lain tidak bisa melihatnya. Dan kalau pemilik blog tersebut sudah "sign out" maka tanda tersebut tidak akan muncul lagi.

Cara menghilangkan seperti dibawah ini:
1. login ke akun blogger kamu
2. masuk ke rancangan--> edit html --> centang kolom expand widget template
3. cari kode ini

]]></b:skin>

4. copy dan paste kode dibawah ini tepat diatas kode nomer 3 tersebut


.quickedit{
display:none;
}

 

5. Klik tombol Simpan Template dan lihat hasilnya .

6. Selesai.

Baca Juga Yang Ini