Tampilkan postingan dengan label TUTORIAL BLOG. Tampilkan semua postingan

Senin, 29 Maret 2010

CARA PASANG TEXT AREA

sudah lama juga saya tidak posting......
maklum lagi mengejar pagerank.....hehehehe
nah sekarang saya akan memberitahu tentang text area...
apa sih text area itu....???
text area adalah sebuah kotak yang bisa di isi dengan link atau tulisan. kalau ingin lebih jelas coba anda lihat di sebelah kanan layar, ada kan link buat tuker link atau banner. nah itu namanya text area.
...
nah sekarang sudah tahu apa itu text area kan...???
nah sekarang text area ada macam-macam, nah sekarang kita coba tutorialnya...
nah sekarang cara buat text area tinggal copy di bawah ini :

<p align="center"><textarea name="code" rows="8" cols="15"> Tulis text ataupun kode-kode yang anda inginkan di sini, maka nanti tulisan anda akan tampil di dalam text area </textarea></p>

jadinya seperti ini :



keterangan : rows="8" adalah menunjukkan berapa tinggi text area, apabila anda ingin meninggikan lagi tinggal diganti angka yang lebih besar, sebaliknya juga sama apabila ingin lebih kecil tinggal diganti dengan angka yang lebih kecil.

cols="15" adalah menunjukkan berapa lebar text area, apabila anda ingin meninggikan lagi tinggal diganti angka yang lebih besar, sebaliknya juga sama apabila ingin lebih kecil tinggal diganti dengan angka yang lebih kecil.

ada variasi lain dari text area, yaitu menggunakan kata copy atau lainnya agar memudahkan untuk mengcopy isi dari text area. ini juga memudahkan bagi yang mengcopy agar tidak tertinggal suatu kata pun yang akan di copy. nah sekarang kalau belum paham coba lihat di bawah ini.

copy HTML di bawah ini :

<div><form name="copy"><div align="center"><input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Copy All"> </div><div align="center"></div><p align="center"><textarea style="WIDTH: 300px; HEIGHT: 144px" name="txt" rows="100" wrap="VIRTUAL" cols="55">simpan tulisan anda di sini, maka tulisan yang anda tulis akan muncul di sini dan siap di copy oleh para pengunjung</textarea></p></div></form>

maka jadinya akan seperti ini :



agar tahu apa yang ada di atas saya akan sedikit menguraikan kode-kode di atas. Kode di atas mempunyai dua elemen bagian, yakni elemen kode untuk membuat tombol yang bertuliskan Copy All, dan yang kedua adalah elemen kode untuk membuat text area.

Elemen tombol Copy All :

  1. <div align="center">-->kata center menunjukan bahwa posisi tombol akan berada di tengah, jadi jika anda ingin posisi tombol berada di tepi sebelah kiri, tinggal ganti dengan kata left. Dan jika ingin berada di tepi sebelah kanan, tinggal ganti dengan kata right
  2. <input onclick="javascript:this.form.txt.focus();this.form.txt.selec()"> --> kode ini artinya ketika tombol Copy All di klik, maka seluruh text yang ada di dalamnya akan di tandai atau di blok, jadi anda jangan merubah tulisan ini.
  3. Value="Copy All" --> kata Copy All adalah kata yang akan muncul di dalam tombol, jadi jika anda ingin merubah tulisan ini silahkan ganti dengan kata yang anda inginkan.


Elemen text Area :

  1. <p align="center"> --> ni menunjukan bahwa text area akan berada di tengah, nah jika anda ingin text area anda berada di tepi kiri, ganti kata center dengan kata left, bila ingin di tepi kanan, ganti dengan kata right.
  2. <text style="WIDTH: 300px"> --> kata "WIDTH:300px" menunjukan lebar dari text area tersebut sebanyak 300 pixel, jadi jika anda ingin memperpendek atau memperpanjang lebar text area, anda tinggal menggantinya dengan angka yang anda inginkan. misal: "WIDTH:500px;"
  3. HEIGHT: 144px --> angka "144px" menunjukan bahwa text area akan mempunyai tinggi sebesar 144 px, jadi jika anda ingin merubahnya tinggal ganti angka tersebut dengan angka yang anda inginkan. Misal : HEIGHT:80px.


Nah itu adalah cara membuat text area, sekarang selamat mencoba.

Selasa, 02 Maret 2010

CARA MEMBUAT RELATED POST

Untuk kali ini saya akan memberikan tutorial mengenai cara membuat related post agar blog kita ada fasilitas related post / posting yang berkaitan. Jika anda sengaja mencari tutorial pembuatan related post lewat search engine anda sudah mencari dengan tepat karena di posting ini saya akan memberikan langkah-langkah secara terperinci…..
Sebelum memasuki langkah-langkahnya saya akan memberi tahu apa itu related post….??? Kalau diartikan sebenarnya agak rumit juga karena saya tidak bisa menjelaskannya dengan kata-kata tapi menurut saya releted post itu semacam posting yang berkaitan....!! berkaitan apa....??? yang pasti sistemnya berkaitan dengan label yang kita pakai….(mengerti apa tidak ya…???hehehehe)
...
maksudnya begini seumpama kita mau membuat postingan tentang tutorial ngeblog, di dalam postingan itu kita kasih label bernama "tutorial blog", untuk membuat labels bisa kan...?kalau tidak bisa ini tutorialnya klik disini...
Sekarang kita balik lagi ke related post, terus setelah kita membuat postingan yg berlabels "tutorial blog" sekarang kita buat lagi postingan dengan judul yang lain tapi topiknya sama (mengenai blog) dan kita beri labels yg sama lagi yaitu "tutorial blog". Lalu setelah anda sudah memasang script untuk related post yg akan saya kasih tahu nanti, maka secara otomatis di blog anda akan muncul related postnya...biasanya tepat di bawah posting.
jika masih belum jelas mengenai penjelasan saya sekarang anda coba dulu aja tutorialnya ini pasti anda akan tahu…..

Yang pertama anda lakukan adalah copy seluruh code script dibawah ini :

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

<div class='widget-content'>
<h3>Related Posts by Categories</h3>
<div id='data2007'/&qt;<br/&qt;<br/>
<script type='text/javascript'>

var homeUrl3 = " <data:blog.homepageUrl/>
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;

maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 3;


function listEntries10(json) {
var ul = document.createElement('ul');
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;

for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement('li');
var a = document.createElement('a');
a.href = alturl;

if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l < json.feed.link.length; l++) {
if (json.feed.link[l].rel == 'alternate') {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace("%20", " ");
var txt = document.createTextNode(label);
var h = document.createElement('b');
h.appendChild(txt);
var div1 = document.createElement('div');
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById('data2007').appendChild(div1);
}
}
}
function search10(query, label) {

var script = document.createElement('script');
script.setAttribute('src', query + 'feeds/posts/default/-/'
+ label +
'?alt=json-in-script&callback=listEntries10');
script.setAttribute('type', 'text/javascript');
document.documentElement.firstChild.appendChild(script);
}

var labelArray = new Array();
var numLabel = 0;

<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = " <data:label.name/>

var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>

</div>
</b:if>

setelah anda copy seluruh code script di atas, lalu sekarang anda login ke blog anda dan pilih layaot kemudian masuk di halaman edit html, dan jangan lupa anda kasih tanda centang atau cecklist pada tulisan "Expand Widgets Template"

kemudian cari dan temukan code script seperti di bawah ini :

<data:post.body/>

jika sudah ketemu code script seperti itu, silahkan paste code script yang anda copy pertama kali tadi yang panjang tepat di bawah code :

<data:post.body/>

Dan untuk tambahan jika blog anda sudah pernah anda edit dan anda kasih readmore atau baca selengkapnya, pasti ada dua code seperti ini dan anda harus mencari code script ini tadi yang pertama dari atas dan paste tepat di bawahnya lalu jangan lupa anda tekan tombol save template...

mudah bukan..? ingat bahwa setiap anda memposting harus di kasih labels, biar related postnya mau muncul...

selamat mencoba……..




Senin, 15 Februari 2010

CARA MEMBUAT LABELS

Labels dalam blog itu sangat membantu karena apabila postingan kita sudah banyak tentunya apabila pengunjung akan repot kan untuk mencari posting yang diinginkan.....????
nah maka labels inilah yang bisa membantu.....

Apa sih labels itu....???
labels adalah penggolongan atau pengkatagorian posting agar dapet lebih mudah dalam pencarian posting yang akan dicari.....
seperti yang ada pada sidebar saya ini......
...
di blogger fasilitas ini sbenarmya sudah tersedia, namun apabila sudah tersedia namun tidak yahu cara pakai dan maksutnya kan sama saja.....
di blogger pengkatagorian atau pengelompokan ini di sebut LABEL.
nah bagi pengguna blogger anda cuma tingal mengisi kotak label yang telah disediakan, simpel kan....

BAGAIMANA SIH CARA BUAT LABELS...???

cara membuat labels sendiri tuh sebenarnya gampang bila sudah mengerti maksutnya apabila belum mengerti maka di sini saya akan menjelaskan cara membuat labels.
pertama anda akan masuk ke postingan anda lalu di sebelah bawah posting ada tulisan "label untuk entri ini" nah di sebelahnya kan ada kotak kosong kan...???nah itu anda tulis postingan anda itu termasuk kategori apa...???misalnya ditulis TUTORIAL BLOGmaka nanti postingan ini akan masuk label postingan anda dan tentunya isi tentang postingnya itu juga tentang tutorial blog.

BISAKAH KATEGORI(LABEl) DITAMPILKAN PADA SIDEBAR....???


tentunya bisa karena ini kan untuk mempermudah pengunjung untuk mencari posting yang mereka inginkan.
cara menampilkan label pada sidebar :
1. masuk blogger anda
2. klik menu layout atau tata letak
3. pilih elemen laman
4. pilih tambah gadget pada sidebar
5. terus pilih label
6. nah di sini yang atas anda bisa tulis labels atau kategori atau apalah terserah anda
7. kemudian pilih radio button yang anda pilih
8. kalau sudah anda bisa klik simpan
9. selesai

mudah bukan...???
sekarang anda coba lihat hasilnya pada sidebar anda....
selamat mencoba....

Rabu, 10 Februari 2010

CARA PASANG SNAPSHOT

Apakah anda pernah meliahat blog atau website yang apabila kursor kita berada pada link itu muncul screenshootnya...???
nah,...apabila anda ingin memiliki yang seprti itu anda coba aja lihat dan baca posting ini sampai selesai.....
semoga aja tidak bosan ya.....hehehehehe
...
kita lanjutin......
untuk mendapatkan screenshoot itu anda bisa mencarinya di internet.....
tapi kalau anda malas mencarinya di sini saya bermurah hati memberikan suatu contohnya.....hehehehe jadi lebay....
coba ikuti langkah-langkah berikut ini untuk mempunyai screenshoot itu :
1. http://snap.com
2. apabila anda sudah masuk coba pilih GET STARTED NOW
3. pilih warna yang ingin anda pilih di "CHOOSE A COLOR THEME" tinggal klik aja warna yang ada di situ
4. pilih snap shot dan trigger di bawah tulisan "CHOOSE SNAP SHOT AND TRIGGER" klik aja pada radio button yang ada
5. apabila anda ingin memasang logo sendiri pilih "browser" lalu pilih yang ada pada komputer anda....kalau tidak mau tinggalkan aja....hehehe
6. pilih ukuran snap shot di bawah tulisan "CHOOSE SNAP SNOT SIZE" beri tanda pada radio buttonnya....
7. klik tombol CONTINUE
8. masukkan alamat anda pada pada kotak di bawah tulisan "ENTER YOUR SITE URL" contoh : http://informasibisnisinternet.blogspot.com
9. masukkan alamat email anda di bawah tulisan "ENTER YOUR EMAIL"
10. beri tanda centang pada kotak di samping tulisan I AGREE TO THE TERMS AND CONDITIONS BELOW
11. lalu klik CONTINUE
12. apabila anda pakai template baru maka anda sign in di blogger dan pilih nama blog yang diinginkan
13. klik tombol menambah widget, maka secara otomatis widget akan terpasang blog anda
14. lalu klik tombol simpan
15. selesai

bagi anda yang bertemplate classic maka pada langkah 12 anda klik CONTINUE klik link read more yang berada dibawah kata Put a snap shot badge on your site copy code yang di berikan lalu paste di di tambah widget HTML....
selesai.....
contoh nyatanya ada pada blog ini...hehehhe
selamat mencoba...

Selasa, 09 Februari 2010

CARA PASANG FEEDJIT

apa sih kegunaan feenjit itu...????adalah suatu website penyedia widget counter yang berfungsi untuk merekam kedatangan suatu pengunjung blog atau web. jadi dengan widget ini anda akan mengetahui darimana pengunjung blog anda datang, dari blog orang lain atau dari search engine seperti google, yahoo, msn dll.
dengan widget ini pula anda juga membantu SEO blog anda....
...
nah untuk mendapatkan counternya anda tidak perlu daftar terlebih dahulu cukup mengikuti 3 langkah berikut ini....bahkan bisa berkurang....hehehehe
1. masuk webnya www.feedjit.com
2. setelah itu muncul tampilan anda pilih widget yang berada paling kiri monitor layar anda yaitu "live traffic feed..."
3. jika anda ingin merubah penampilannya dahulu anda klik link yang bertuliskan " first costumize it!"
4. setelah selesai mengeditnya lalu anda bisa mengambil widget dengan cara penginstalan ke blogger secara otomatis dengan klik link " add to your blogger blog"

selesai deh....
sekarang anda sudah bisa memantau siapa saja yang datang ke blog anda......
semoga dapat menambah semangat anda dalam ngeblog....

Senin, 08 Februari 2010

CARA PASANG SHOUTMIX

kita sudah sering melihat blog-blog yang ada kotak chat kan yang warna-warni....
di tambahin smile yang lucu dan imut...????
nah itu dinamakan chat box/chat board/ message board/ message box....terserah deh apa namanya....hehehehehe
ingin tau caranya menampilkan chat box di blog....???

yang saya tahu 2 situs yang menyediakan layanan chat box ini....
  1. www.cbox.ws
  2. www.shoutmix.com
dari segi fisik sama-sama bagus....dari segi pendaftaran juga sama-sama mudah....tidak diperlukan data yang bertele-tele untuk mendapat chat box tersebut.
cara mendapatkannya :
  1. masuk di salah satu website di atas
  2. terus daftar di website itu
  3. setelah terdaftar lalu login
  4. anda akan dapat HTMLnya kan
  5. lalu copy
  6. masukkan ke blog anda dan paste di javascrib/HTML
  7. jadi deh....gampang kan