oh... cinta... : Tutorial Blog

Showing posts with label Tutorial Blog. Show all posts

Cara Memasukkan Youtube Video ke Posting Blog

Cara Memasukkan Youtube Video ke Posting Blog-Wahidun Blog-Video Youtube ke Posting Blog pasti sering anda temukan di postingan blogpspot lantas gimana caranya Memasukkan Youtube Video ke Posting Blog,oleh karena itu kali ini Wahidun Blog akan membahas yang satu ini, oke langsung aja kita ke TKP Cara Memasukkan Youtube Video ke Posting Blog:

1.Buka situs youtube.com dan cari video yang Anda perlukan, masukkan item pencarian Anda dan klik tombol search

2.Klik tombol "embed" yang ada pada bagian bawah video

3. Copy kode script yang muncul (ctrl + c) dan paste (ctrl + v) di notepad.

3.Sign in di dalam acoount blogger Anda dan klik tombol Posting Baru dan berikutnya, pilih pilihan 'Edit html'

Gimana mudahkan Cara Memasukkan Youtube Video ke Posting Blog cuman butuh waktu singkat, sampai disini dolo tutorial kali ini semoga bermanfaat buat anda

CARA MENGURANGI ERROR HTML DAN CSS PADA TEMPLATE BLOG

Cara Mengurangi Error HTML dan CSS Pada Template Blog-Mengurangi Error HTML dan CSS Pada Template Blog Penting sekali karena dengan cara itu template blog kita lebih valid xhtml, karena dengan hal seperti itu dapat mempermudah robot untuk menelusuri halaman blog kita dan tentunya sangat mempengaruhi SEO.

Langsung aja TKP Cara Mengurangi Error HTML dan CSS Pada Template Blog

Merubah 'deklarasi DOCTYPE Strict' menjadi 'Transisi XHTML delcaration DOCTYPE" dan menambahkan meta tag default blogger. Cari kode dibawah

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>

hapus semua kode diatas dan ganti dengan kode berikut

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang='en' xml:lang='en' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/> | <data:blog.title/></title>
</b:if>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<meta content='blogger' name='generator'/>
<link expr:href='data:blog.url' rel='canonical'/>
<link href='/atom.xml' rel='alternate' title='Judul Blog Kamu - Atom' type='application/atom+xml'/>
<link href='/rss.xml' rel='alternate' title='Judul Blog Kamu - RSS' type='application/rss+xml'/>

Menghapus comment declaration yang ada pada CSS,Cari kode dash ( ----- ) dan hapus semuanya. contoh:

/* -----------------------------------------------
Blogger Template Style
Name: Minima
Date: 26 Feb 2004
Updated by: Blogger Team
----------------------------------------------- */

hasilnya menjadi

/* Blogger Template Style
Name: Minima
Date: 26 Feb 2004
Updated by: Blogger Team */

Menghapus Navigasi Bar bawaan blogger,cari kode </head> dan tambahkan kode berikut tempat dibawahnya

Menghapus Icon Quickedit atau gambar obeng,cari kode <b:include name='quickedit'/> kalo sudah ketemu hapus semua tanpa terkecuali, jangan lupa kalo besoknya menambahkan widget baru hapus lagi kode tersebut.

Menghapus Post icon,cari kode berikut

<span class='post-icons'>

<b:if cond='data:post.emailPostUrl'>
<span class='item-action'>
<a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
<img alt='' class='icon-action' height='13' src='http://img1.blogblog.com/img/icon18_email.gif' width='18'/>
</a>
</span>
</b:if>

<b:include data='post' name='postQuickEdit'/>
</span> <div class='post-share-buttons'>
<b:include data='post' name='shareButtons'/>
</div> </div>

hapus dan ganti dengan kode berikut

<span class='post-icons'>

<b:if cond='data:post.emailPostUrl'>
</b:if>
</span>
</div>

Menambahkan jenis type="text/javascript" pada semua kode JavaScript yang ada. Contoh:

<script src="http://wahidsahidu.googlecode.com/files/SakuraRain.js"></script>

Ubahlah Menjadi:

<script type="text/javascript" src="http://wahidsahidu.googlecode.com/files/SakuraRain.js"></script>

Menyembunyikan page navigation di halaman utama,cari kode

<b:include name='nextprev'/>

hapus dan ganti seperti kode berikut

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

<b:include name='nextprev'/>
</b:if>

Menambahkan atribut Alt pada semua gambar termasuk saat posting artikel,contoh

<img href="http://1.bp.blogspot.com/-n2OIL8Xv3ZI/TlvP2WEe4mI/AAAAAAAAAAU/gskf9ZSuiAc/s1600/dofollowlogo.jpg">
ganti menjadi seperti berikut
<img alt="dofollow logo" href="http://1.bp.blogspot.com/-n2OIL8Xv3ZI/TlvP2WEe4mI/AAAAAAAAAAU/gskf9ZSuiAc/s1600/dofollowlogo.jpg">

Memperbaiki atribut title dan alt pada link bergambar,sebagai contoh

<a href="http://www.getfreebl.com" alt="free backlink generator powered by http://www.getfreebl.com" target="_blank"><img src="http://www.getfreebl.com/services/backlink/backlink.php?aut=EF60387089C968920487F89D5739455201155A64B924A54A750E6D8DD2AD0BC1854A7AD421A02FC8C133214B6D89C17132344F7139C830162C23D81597BA7B4BBFE8" title="Free backlinks for your site powered by http://www.getfreebl.com" border="0" /></a>

rubah posisi atribut title dan alt

<a href="http://www.getfreebl.com" title="free backlink generator powered by http://www.getfreebl.com" target="_blank"><img src="http://www.getfreebl.com/services/backlink/backlink.php?aut=EF60387089C968920487F89D5739455201155A64B924A54A750E6D8DD2AD0BC1854A7AD421A02FC8C133214B6D89C17132344F7139C830162C23D81597BA7B4BBFE8" alt="Free backlinks for your site powered by http://www.getfreebl.com" border="0" /></a>

Untuk kasus diatas jangan lupa untuk link atributnya title dan target, untuk gambar alt dan border jagan sampe terbalik-balik.

Menyembunyikan widget dihalaman utama,kalo widget itu dianggap penting dan tidak bisa di validasi sebaiknya sembunyikan dari halaman utama dengan cara menambahkan kode berikut

<b:if cond='data:blog.homepageUrl != data:blog.url'>
Widget Yang Mau DiSembunyikan
</b:if>

Nah Berikut itu Cara Mengurangi Error HTML dan CSS Pada Template Blog semoga dapat bermanfaat buat sobat,
Source Code: naughtyric.blogspot.com

Memasang Meta Tag Super Ampuh SEO Friendly

Memasang Meta Tag Super Ampuh SEO Friendly- Meta Tag sangat berperan penting dalam sebuah blog, karena dengan menerapkan meta tag yang benar maka artikel pada blog Anda akan mampu bersaing pada serps mesin pencari yakni Abah Google, Oleh karena itu pada kesempatan kali ini wahid sahidu akan Sedikit memberikan tips SEO yakni Memasang Meta Tag Super Ampuh SEO Friendly, Pada Meta Tag kali ini dapat dikatakan Super Ampuh, karena Meta Tag ini telah dimodifikasi sedemikian rupa sehingga sangat bagus pada blog yang ingin meningkatkan pengunjung. Meta Tag ini terdiri dari deskripsi dan keyword yang berbeda pada homepage dan juga berbeda pada setiap postingan. Nah Jika anda tertarik untuk memasangnya

silahkan ikuti langkah langkah berikut ini:

Cari Kode seperti ini ( Gunakan F3 Untuk Memudahkan Pencarian anda
<b:include data='blog' name='all-head-content'/>

Kemudaia Letakan Kode berikut tepat di bawah kode yang di atas

<b:if cond='data:blog.pageType == "index"'>

<title><data:blog.pageTitle/></title>

<meta content='Tulis Deskripsi Blog Anda' name='description'/>

<meta content='Tulis Keyword untuk Homepage' name='keywords'/>

<meta content='http://bloganda.blogspot.com' name='subject'/>

<meta content='Tulis Deskripsi Blog Anda' name='Abstract'/>

<b:else/>

<b:if cond='data:blog.pageType == "item"'>

<title><data:blog.pageName/> | <data:blog.title/></title>

<b:else/>

<title><data:blog.pageTitle/></title>

</b:if><meta expr:content='data:blog.pageName + " - Tulis Deskripsi Pada Halaman Yang Sedang Dibuka"' name='description'/>

<meta expr:content='data:blog.pageName + " - Tulis Keyword Pada Halaman Yang Sedang Dibuka"' name='keywords'/>

<meta expr:content='data:blog.pageName' name='subject'/>

<meta expr:content='data:blog.pageName' name='Abstract'/>

</b:if>

<meta content='Hak Cipta' name='copyright'/>

<meta content='Nama Anda' name='author'/>

<meta content='UTF-8' name='Charset'/>

<meta content='Global' name='Distribution'/>

<meta content='General' name='Rating'/>

<meta content='INDEX FOLLOW' name='Robots'/>

<meta content='1 days' name='revisit'/>

<meta content='1 Days' name='Revisit-after'/>

<meta content='ID' name='language'/>

<meta content='ID' name='geo.country'/>

<meta content='Indonesia' name='geo.placename'/>

<meta content='global' name='distribution'/>

<meta content='blogger' name='generator'/>

<meta content='general' name='rating'/>

<meta content='global' name='target'/>

<meta content='index,follow,snipet' name='googlebot'/>

<meta content='follow, all' name='Googlebot-Image'/>

<meta content='follow, all' name='Scooter'/>

<meta content='follow, all' name='msnbot'/>

<meta content='follow, all' name='alexabot'/>

<meta content='follow, all' name='Slurp'/>

<meta content='follow, all' name='ZyBorg'/>

<meta content='follow, all' name='Scooter'/>

<meta content='ALL' name='SPIDERS'/>

<meta content='ALL' name='WEBCRAWLERS'/>

Catatan: Silahkan Anda edit khususnya pada tulisan yang bercetak tebal berwarna biru.

Simpan Template Sobat

Sekian dulu tips SEO Memasang Meta Tag Super Ampuh SEO Friendly pada kali semoga dapat membawa manfaat bagi anda

Cara Membuat Gadget Label Blog Menjadi 2 Kolom

Cara Membuat Gadget Label Blog Menjadi 2 Kolom, ini adalah cara sederhana agar tampilan blog lebih rapi dan dinamins, oke langsung aja ke TKP:

1. Seperti biasa masuk account blogger.com
2. Pilih "Icon go to post list" ->> Layout ->> Add a Gadget3. Pilih Gadget Label
4. Buka Gadget Label yang sudah terpasang, lalu setting Gadget label, jika sudah simpan Gadget

5. Selanjutnya pilih Template ->> Backup Template
6. Pilih Edit HTML ->> Proceed ->> Centang "Expand Widget Templates"
7. Tekan Ctrl+f untuk mencari cepat kode ]]></b:skin> letakkan kode Css dibawah ini tepat diatas atau jika gagal letakkan dibawah kode tersebut

   <style>
   #Label1 li {
      float:left;
      width:120px;
   }
                  </style>

Keterangan: Cara Buat Gadget Label Blog Menjadi 2 Kolom Agar Blog Anda Hemat Ruangan Dan Terkesan Lebih Rapih.

Uuntuk width:120px bisa Anda gunakan % menjadi 40% atur sesuai kebutuhan halaman Gadget blog Anda.

8. Simpan dan Lihat Hasilnya

Cara Membagi Sidebar Menjadi 2 kolom

1. Login ke Blogger. Klik Design -> Edit HTML
2. Backup template anda dengan cara klik "Download Full Template".
3. Beri tanda centang pada "Expand Widget Template"
4. Cari kode

#sidebar-wrapper {
background-color: #f6f6f6;
width:254px;
float:$endSide;
padding:0;
color: $sidebarTextColor;
font-size: 83%;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

Agar mudah untuk mencarinya ketik sidebar-wrapper atau sidebar-wrap dalam kotak Find.

Catatan:
Setiap template mempunyai susunan kode yang berbeda-beda. Jadi yang perlu anda perhatikan adalah nilai widthnya.

Sebagai contoh nilai width diatas adalah 254px. Karena kita ingin membagi kolom sidebarnya menjadi 2 bagian maka kita bagi nilai width dengan 2. Sehingga masing kolom mempunyai lebar sebesar 127px. Agar tidak berdempetan maka masing-masing kolom akan kita beri margin sebesar 10px agar terdapat ruang jarak. Sehingga sekarang lebar masing2 sidebar menjadi 117px.

Setelah kita menentukan lebar sidebar kiri dan kanan. Langkah selanjutnya adalah membuatkannya kedalam kode css.

5. Copy kode css diatas lalu letakkan dibawahnya dan ganti sidebar-wrapperpada kode css ke2 menjadi menjadi sidebar-wrapper2 jadi hasilnya seperti ini

#sidebar-wrapper {
background-color: #f6f6f6;
width:254px;
float:$endSide;
padding:0;
color: $sidebarTextColor;
font-size: 83%;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#sidebar-wrapper2 {
background-color: #f6f6f6;
width:254px;
float:$endSide;
padding:0;
color: $sidebarTextColor;
font-size: 83%;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

6. Ganti nilai width masing-masing kolom menjadi 117px. Lalu tambahkanmargin:0px 20px 0px 0px; pada bagian sidebar-wrapper2. Sehingga hasilnya menjadi seperti ini

#sidebar-wrapper {
background-color: #f6f6f6;
width:117px;
float:$endSide;
padding:0;
color: $sidebarTextColor;
font-size: 83%;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#sidebar-wrapper2 {
background-color: #f6f6f6;
width:117px;
float:$endSide;
padding:0;
margin:0px 20px 0px 0px;
color: $sidebarTextColor;
font-size: 83%;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

7. Setelah itu, cari kode

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Label1' locked='false' title='kategori' type='Label'/>
<b:widget id='Followers1' locked='false' title='Followers' type='Followers'/>
<b:widget id='Feed1' locked='false' title='Herman Blog' type='Feed'/>
</b:section>
</div>

8. Yang harus anda perhatikan adalah kode berwarna biru sedangkan kode berwarna merah setiap template berbeda-beda.

9. Copy kode yang berwarna biru diatas lalu letakkan dibawah </div>. Gantisidebar-wrapper pada kode ke-2 menjadi sidebar-wrapper2 dan id='sidebar'menjadi id='sidebar2'. Jadi hasilnya menjadi seperti ini.

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Label1' locked='false' title='kategori' type='Label'/>
<b:widget id='Followers1' locked='false' title='Followers' type='Followers'/>
<b:widget id='Feed1' locked='false' title='Herman Blog' type='Feed'/>
</b:section>
</div>

<div id='sidebar-wrapper2'>
<b:section class='sidebar' id='sidebar2' preferred='yes'>
</b:section>
</div>

10. Jika sudah klik Save Template.
11. Selesai. Klik Page Element untuk melihat hasilnya.

Sumber :www.hermanblog.com

Cara Membuat Anti Copas Pada Blog

Cara Membuat Anti Copas Pada Blog, Setelah beberapa hari kagak nongol di dunia maya akhirnya bisa nongol juga oke hari ini ane mau bagi sedikit trick yaitu Cara Membuat Anti Copas Pada Blog, Taukan Manfaat dari Membuat Anti Copas Pada Blog, itu itu buat ngindari artikel kita untuk di Copas, Oke langsung aja berikut ini caranya :

Ke Akun Blog Anda
Rancangan>>Edit HTML>>centang Expang Template Widget
Cari Kode Dan Letakan kode berikut ini di bawah kode

<SCRIPT type='text/javascript'>  if (typeof document.onselectstart!="undefined") {  document.onselectstart=new Function  ("return false");}  else{  document.onmousedown=new Function  ("return false");  document.onmouseup=new Function  ("return true");  }  </SCRIPT>

Simpan dan Coba Lihat Hasilnya

Sekian Dulu Dari Gang Trick Semoga bermanfaat bagi sobat sekalian, Salam Blogger Indonesia

Tips Cara Membuat Hak Cipta Pada Postingan Blog

kali ini pada postingan, saya akan sedikit berbagi tips dan trik kepada kawan-kawan ku semua tentang cara Mudah Membuat Hak Cipta Pada Postingan Blog, nich berikut tips bloggingnya :

- Log In Blog

- Rancangan, lalu Edit HTML

- Mencari Code <head> , agar lebih mudah menggunakan Ctrl + F

- Setelah itu letakan Code Script dibawah ini tepat di bagian bawah code <head>

<script type='text/javascript'>

function addLink() {

var body_element = document.getElementsByTagName('body')[0];

var selection;

selection = window.getSelection();

var pagelink = "<br/><br/> Original Post at: <a href='"+document.location.href+"'>"+document.location.href+"</a>"; // change this if you want

var copytext = selection + pagelink;

var newdiv = document.createElement('div');

newdiv.style.position='absolute';

newdiv.style.left='-99999px';

body_element.appendChild(newdiv);

newdiv.innerHTML = copytext;

selection.selectAllChildren(newdiv);

window.setTimeout(function() {

body_element.removeChild(newdiv);

},0);

}document.oncopy = addLink;

</script>

Ganti tulisan warna merah sesuai dengan keinginan kawan

cobalah copy paste artikel yang ada di blog pada sebuah Notepad ataupun sejenisnya. Jika berhasil, maka akan muncul link alamat blog kita dibagian paling bawah.