Kegiatan Prakerind Multimedia Qori: Oktober 2012

Rabu, 31 Oktober 2012

Hari ke-27 Masuk PKL

Cara Mempercantik dan Menghias BLOG

Blog kita akan terasa lebih cantik apabila di isi dengan berbagai hiasan seperti jam, buku tamu, yahoo emotion, tukaran link, beberapa logo, dan juga lain2 sebagainya. sebetulnya hiasan ini bisa kita dapatkan dengan cara mudah karena hiasan ini sebetulnya free, jadi apabila anda melihat blog yang ada hiasan seperti jam atau lain2 anda tinggal menklik saja hiasan itu maka kita akan dibawa ke web penyedia hiasan itu. tapi sebelum kita mengambil hiasan itu sudah pasti terlebih dahulu kita harus melakukan registrasi.

Untuk masalah hiasan saya akan memberikan beberapa contoh saja. karena saya yakin yang lainnya anda pasti akan bisa setelah mempelajari dikit demi sedikit tentang kode HTML yang ada dari hiasan itu.

Memberikan Hiasan Jam pada Blog kita. caranya adalah :

Silahkan klik link berikut –> http://www.clocklink.com
Jika sudah berada pada situs tersebut, pilih menu Gallery pada sebelah kiri homepage clocklink (atau klik world clock untuk hiasan jam dengan tampilan peta dunia).
Pada menu Gallery silahkan anda melihat-lihat dulu model dari jam yang tersedia, yaitu mulai dari Analog, Animal, Animation, dll
Jika di rasa sudah menemukan model jam yang anda sukai, klik tulisan View HTML tag yang berada di bawah jam yang anda sukai tadi
Klik tombol yang bertuliskan Accept
Pilih waktu yang sesuai dengan tempat anda di samping tulisan TimeZone. Contoh : untuk indonesia bagian barat pilih GMT +7:00
Set ukuran jam yang anda sukai di samping tulisan size
Copy kode HTML yang di berikan pada notepad
Paste kode HTML yang di copy tadi pada tempat yang anda inginkan
Selesai

Memasang Buku Tamu pada Blog :

Daftar terlebih dahulu di www.shoutmix.com
Setelah daftar pada kolom yang berjudul style, klik menu appearance
Silahkan klik menu pulldown di samping tulisan Load From Preset untuk mengatur tampilan buku tamu anda, silahkan pilih yang sesuai dengan keinginan anda. Jika sudah selesai klik Save Setting.
Untuk mendapatkan kode HTML dari shoutbox anda, silahkan klik Use Shoutboxyang berada di bawah menu Quick Start
Klik tulisan Place Shoutbox on web page. Isi lebar dan tinggi shoutbox yang di inginkan
Copy seluruh kode HTML yang ada pada text area yang berada di bawah tulisanGenerated Codes, lalu simpan di program Notepad anda
Klik Log out yang berada di atas layar anda untuk keluar dari halaman shoutmix anda. Silahkan close situs tersebut.
Selesai

Untuk menempatkan kode HTML shoutbox tadi pada blog anda, silahkan ikuti langkah-langkah berikut ini.
Untuk blogger dengan template klasik :

Log in terlebih dahulu ke blogger.com dengan id anda
Klik menu Template
Klik Edit HTML
Paste kode HTML shoutbox anda yang telah di copy pada notepad tadi di tempat yang anda inginkan
Untuk jelasnya saya ambil contoh dengan shoubox milik saya, untuk menempatkannya tinggal klik Edit pada browser lalu pilih Find (on this page).. trus tuliskan kata buku tamu lalu klik find, maka kita akan langsung di bawa ke tulisan tersebut. Jika sudah ketemu tulisan tadi silahkan paste kode HTML shoutbox nya.
Klik tombol Preview untuk melihat perubahan yang kita buat.
Jika sudah cocok dengan perubahan tadi, klik Save Template Changes
Selesai

Sedikit Clue, agar shoutbox anda sesuai dengan ukuran lebar sidebar , anda bisa merubah ukuran lebar ataupun tinggi dari shoutbox , caranya anda tinggal merubah angka Width (untuk lebar) dan Height (untuk tinggi) dari dalam kode HTML shoutbox tersebut.

Untuk Blogger baru :

Silahkan Login dengan id anda
Klik menu Layout
Klik Page Element
Klik Add a Page Element
Klik tombol Add to Blog yang berada di bawah tulisan HTML/JavaScript
Tuliskan judul shoutbox anda pada form title. Contoh : Buku tamu ku, atau my guestbook atau apa saja yang anda suka
Copy paste kode HTML shoutbox anda di dalam form Content
Klik tombol Save Changes
Drag & Drop element yang telah anda buat tadi di tempat yang di sukai
Tekan tombol Save
Selesai

Selamat mencoba !

Sebagai tambahan, guestbook yang sering dipakai para blogger lainnya :

Untuk langkah-langkahnya hampir sama dengan langkah diatas.

Pasang Statistik atau Tracker

Silahkan klik di sini untuk menuju menuju situs http://www.sitemeter.com
klik tulisan Sign Up untuk melakukan pendaftaran
klik tombol bertuliskan Next
Klik tombol Next lagi
Isi semua tabel yang ada lalu klik tombol Next lagi
Isi lagi tabel yang ada, lalu klik tombol Next lagi
klik tombol Next lagi
klik tombol Next lagi ( cape dech next..next melulu )
Setelah ada keterangan proses sign up selesai, anda harus melakukan veryfikasi, silahkan buka email yg anda berikan
Buka email yang datang dari sitemeter.com, di dalamnya ada username dan password anda untuk login ke sitemeter.com
Silahkan login dengan id anda
Bila sudah login, Klik menu Manager
Klik Menu Meter Style untuk memilih gaya dari site meter anda
Pilih style yang anda sukai, kemudian klik tombol Select
Klik menu HTML Code
Klik tulisan Adding site Meter to a Blogger.com Site
copy semua kode HTML yang di berikan lalu paste pada Notepad
Klik menu Logout untuk keluar dari situs tersebut
Selesai, tinggal memasukan kode yang kita dapat ke dalam blog kita

Sekarang tugas kita adalah memasukan kode yang sudah kita dapat ke dalam blog, ikuti langkah- langkah berikut :

khusus blog dengan template klasik :

Sign in di blogger dengan id anda
Klik menu TEMPLATE
Klik Edit HTML
Klik Edit (yang ada pada bar menu browser anda)
Klik Find (on this page)… –> untuk mempercepat pencarian
Tuliskan kata dimana anda ingin tempatkan, contoh di blog saya adalah blogger (karena dekat dengan tombol blogger) klik Find
Copy & paste kode yang telah di simpan di notepad tadi, lalu klik tombol Previewuntuk melihat perubahan yang terjadi
Jika sudah cocok dengan perubahan tadi, Klik Save Template Changes. Selesai

Sedikit tambahan, bila anda ingin site meter posisinya berada di tengah-tengah, tinggal tambah kode

…kode site meter…

Untuk blog dengan Template baru :

Login di blogger dengan ID anda
Klik menu Layout
Klik Page Elements
Klik Add a Page Element
Klik ADD TO BLOG pada menu HTML/JavaScript
Tulis Judul site meter anda pada pada isian di sebelah form Title (bila ingin ada keterangan. kalau tidak, ya kosongkan saja)
Copy & paste kode Site meter pada kolom Content
Klik tombol Save Changes
Klik Element yang baru anda buat tadi, tahan lalu pindahkan ke tempat yang anda inginkan ( di drag & drop)
Klik tombol PREVIEW untuk melihat perubahan yang baru di lakukan
Bila sudah cocok dengan perubahan tadi, klik tombol SAVE
Selesai

Demikian beberapa contoh dari hiasan blog saya yakin teman2 pasti bisa membuatnya dan menjadikan blog teman2 lebih indah apabila ada informasi yang kurang dari blog saya silahkan cek langsung ke sumber informasinya yaitu

Buku Tamu
Bukutamu blog disebut juga dg shoutbox atau tagboard. Sama dengan bukutamu website, tapi bentuknya lebih sederhana. Banyak situs penyedia bukutamu blog gratis yg bisa Anda cari di google dg kata kunci shoutbox atau tagboard.http://shoutmix.comtermasuk penyedia buku tamu blog yg disukai yg servernya cukup stabil.atau Bisa juga di www.Smartgb.com

Caranya:
(a) Daftar di alamat di atas, ikuti semua perintahnya; (b) Setelah selesai, log-in dg id dan password yg sudah terdaftar; (c) Klik menu “Code Generator”; (d) Pilih Full-frame shoutbox; (e) Klik “Generate the Code”; (f) Copy kode HTML yg ada, dan masukkan ke template blog Anda di bagian Sidebar; (g) Klik SAVE SETTING & REPUBLISH. Selesai.

Statistic dan Tracker
Berfungsi untuk mengetahui berapa pengunjung yg datang setiap harinya, setiap minggu, dan bulan dan dari negara mana saja. Selain itu, ia memberi tahu kita lewat mana pengunjung itu datang: lewat pencarian di google atau via blog/situs lain yg memasang link blog kita. Statistic/tracker gratis yg paling terkenal ada dua Sitemeter dan Extreme Tracking. Klik link berikut untuk mendaftar:

(a)http://www.sitemeter.com/?a=newaccount(b) http://www.extreme- dm.com/tracking/?reg Setelah daftar, login dan masukkan kode HTML-nya di blog Anda.

Kamus Online
Kalau blog Anda berbahasa Inggris, Anda bisa memasang Kamus Indonesia-Inggris dan Inggris-Indonesia di blog Anda supaya pengunjung Indonesia yg lagi belajar bahasa Inggris bisa betah nongkrong. Kode HTML-nya bisa diambil dihttp://kamus.net

Jadwal Shalat
Bagi blogger Muslim, www.islamicfinder.org menyediakan jadwal shalat lima waktu yg bisa ditempel di blog. Anda bisa pilih berdasarkan kota dan negara. Silahkan ambil kodenya di link berikut: http://www.islamicfinder.org/index.php?inl_language

Peta Kampung Kita
Bagi yg ingin melihat nama dan peta kampung kelahiran nempel di blog, silahkan daftar di http://feedmap.net atau bisa juga lihat digoogle earth

Caranya,
(a) masuk ke

http://feedmap.net; (b) Klik “Explore Blog”, akan muncul peta dunia; (c) Pilih negara Indonesia dg cara klik kanan secara terus menerus mouse komputer Anda dan geser/putar peta dunia tsb. ke kanan/kiri sampai ketemu peta Indonesia. (d) Setelah peta Indonesia ditemukan, perbesar fokus peta dg cara mengklik 2x secara berulang-ulang; (e) Pilih kawasan atau propinsi yg paling dekat dg kampung kelahiran Anda, dan perbesar fokus peta dg mengklik berkali-kali sampai tidak dapat diperbesar lagi; (f) Setelah nama kampung kelahiran atau kota terdekat dari kampung kita tampak, arahkan panah mouse ke kota tsb dan klik kanan mouse; (g) Akan tampil menu “Add Blog”, klik menu ini; (h) Akan muncul kotak, isi alamat blog Anda. Contoh,http://silverains.blogspot.com (jangan lupa pake awalan http://; (i) Klik submit; (j) Apabila berhasil, maka akan muncul tulisan: Thank You! Di bawahnya ada tiga kotak yg berisi kode html untuk BLOGMAP, NEIGHBLOGMAP BUTTON, dan LOCAL BLOGROLL. Copy ketiga kode HTML tsb. dan paste di sidebar blog Anda; (k) Selesai.

www.kebumenmedianet.com

Senin, 29 Oktober 2012

Hari ke-26 Masuk PKL

Di hari ini saya akan menjelaskan tentang bagaimana cara membuat teks bergerak mengikuti gerakan kursor.

Tanpa basa basi lagi, ayo kita coba bersama-sama khususnya bagi para pengguna blogspot

1. Login akun Blogger
2. Masuk menu Rancangan
3. Pilih Eleman Laman kemudian tambahkan gadget
4. Pilih HTML/JavaScript
5. Masukkan kode script di bawah ini

<style type="text/css">
    /* Circle Text Styles */
    #outerCircleText {
    /* Optional - DO NOT SET FONT-SIZE HERE, SET IT IN THE SCRIPT */
    font-style: italic;
    font-weight: bold;
    font-family: 'comic sans ms';
    color: #000000;
    /* End Optional */

    /* Start Required - Do Not Edit */
    position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}
    #outerCircleText div {position: relative;}
    #outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}
    /* End Required */
    /* End Circle Text Styles */
    </style>

    <script type="text/javascript">
    /* Circling text trail- Tim Tilton
    Website: http://www.tempermedia.com/
    Visit: http://www.dynamicdrive.com/ for Original Source and tons of scripts
    Modified Here for more flexibility and modern browser support
    Modifications as first seen in http://www.dynamicdrive.com/forums/
    username:jscheuer1 - This notice must remain for legal use
    */

    ;(function(){

    // Your message here (QUOTED STRING)
    var msg = "Tutorial Blog";

    /* THE REST OF THE EDITABLE VALUES BELOW ARE ALL UNQUOTED NUMBERS */

    // Set font's style size for calculating dimensions
    // Set to number of desired pixels font size (decimal and negative numbers not allowed)
    var size = 24;

    // Set both to 1 for plain circle, set one of them to 2 for oval
    // Other numbers & decimals can have interesting effects, keep these low (0 to 3)
    var circleY = 0.75; var circleX = 2;

    // The larger this divisor, the smaller the spaces between letters
    // (decimals allowed, not negative numbers)
    var letter_spacing = 5;

    // The larger this multiplier, the bigger the circle/oval
    // (decimals allowed, not negative numbers, some rounding is applied)
    var diameter = 10;

    // Rotation speed, set it negative if you want it to spin clockwise (decimals allowed)
    var rotation = 0.4;

    // This is not the rotation speed, its the reaction speed, keep low!
    // Set this to 1 or a decimal less than one (decimals allowed, not negative numbers)
    var speed = 0.3;

    ////////////////////// Stop Editing //////////////////////

    if (!window.addEventListener && !window.attachEvent || !document.createElement) return;

    msg = msg.split('');
    var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
    ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
    o = document.createElement('div'), oi = document.createElement('div'),
    b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement : document.body,

    mouse = function(e){
    e = e || window.event;
    ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position
    xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position
    },

    makecircle = function(){ // rotation/positioning
    if(init.nopy){
    o.style.top = (b || document.body).scrollTop + 'px';
    o.style.left = (b || document.body).scrollLeft + 'px';
    };
    currStep -= rotation;
    for (var d, i = n; i > -1; --i){ // makes the circle
    d = document.getElementById('iemsg' + i).style;
    d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) + 'px';
    d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
    };
    },

    drag = function(){ // makes the resistance
    y[0] = Y[0] += (ymouse - Y[0]) * speed;
    x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
    for (var i = n; i > 0; --i){
    y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
    x[i] = X[i] += (x[i-1] - X[i]) * speed;
    };
    makecircle();
    },

    init = function(){ // appends message divs, & sets initial values for positioning arrays
    if(!isNaN(window.pageYOffset)){
    ymouse += window.pageYOffset;
    xmouse += window.pageXOffset;
    } else init.nopy = true;
    for (var d, i = n; i > -1; --i){
    d = document.createElement('div'); d.id = 'iemsg' + i;
    d.style.height = d.style.width = a + 'px';
    d.appendChild(document.createTextNode(msg[i]));
    oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
    };
    o.appendChild(oi); document.body.appendChild(o);
    setInterval(drag, 25);
    },

    ascroll = function(){
    ymouse += window.pageYOffset;
    xmouse += window.pageXOffset;
    window.removeEventListener('scroll', ascroll, false);
    };

    o.id = 'outerCircleText'; o.style.fontSize = size + 'px';

    if (window.addEventListener){
    window.addEventListener('load', init, false);
    document.addEventListener('mouseover', mouse, false);
    document.addEventListener('mousemove', mouse, false);
    if (/Apple/.test(navigator.vendor))
    window.addEventListener('scroll', ascroll, false);
    }
    else if (window.attachEvent){
    window.attachEvent('onload', init);
    document.attachEvent('onmousemove', mouse);
    };

    })();
    </script>

6. Simpan

Selesai, sekarang kursor akan diikuti dengan teks,
* Yang berwarna orange, berturut-turut adalah kode warna dan teks yang diinginkan
** Yang berwarna hijau ukuran huruf, jarak spasi, besar lingkaran yang dibentuk, kecepatan berputar, dan kecepatan mengikuti gerak mouse

www.kebumenmedianet.com

Minggu, 28 Oktober 2012

Hari ke-25 Masuk PKL

Di hari senin tgal 28 oktober ini saya masuk pukul 12.00.Nah di hari ini saya akan menjelaskan tentang cara membuat widget recent post animasi.

CARA MEMBUAT WIDGET RECENT POST ANIMASI :

1.Sign In di http://www.blogger.com/
2.Pada Dashbor klik Design
3.Klik Add a Gadget dan HTML Java Script
4.Copy kode di bawah ini dan paste pada kolom yang tersedia
<style type="text/css">
#rp_plus_img{height:377px;}
#rp_plus_img li {height:60px;padding:5px;list-style:none;
background-color:#ffffff;
border:solid 1px #000000;}
#rp_plus_img a{color:#00000;}
#rp_plus_img .news-title{display:block;font-weight:bold ;margin-bottom:4px;font-size:11px;
text-align:justify;
-moz-border-radius: 5px;}
#rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #00000;width:55px;height:55px;}
</style>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/recentpost.js"></script>

<script type="text/javascript">
var speed = 1500;
var pause = 3500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>

<ul id="rp_plus_img"><script style="text/javascript">
var numposts = 5;
var numchars = 0;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
</ul><small><a href="http://bloggertutorialblog.blogspot.com/" target="_blank">Get this widget here</a></small>
5.Klik Simpan

www.kebumenmedianet.com

Hari ke-24 Masuk PKL

Sabtu ,27 Oktober 2012

Masuk Pukul 08.00 s/d 13.00 WIB

LIBUR IDUL ADHA

www.kebumenmedianet.com

Hari ke-23 Masuk PKL

Jum'at ,26 Oktober 2012
Masuk pukul 12.00 s/d 16.0 WIB

LIBUR IDUL ADHA

www.kebumenmedianet.com

Kamis, 25 Oktober 2012

Hari ke-22 Masuk PKL

Kamis ,25 Oktober 2012

Masuk Pukul 12.00 s/d 16.00 WIB

Hari ini saya masu siang.Saya tiba di tempat prakerind sebelum pukul 12.00.Selanjutny saya melanjutkan mendesain blog saya.Yaitu cara membuat link pelangi ketika disorot kursor.

Berikut Cara membuat Link Pelangi ketika di Sorot Kursor :
Asslamualikum,
Kali ini Tips dari saya adalah membuat Link Menjadi Warna-Warni Ketika DiSorot oleh Kursor
pada blog,
Langsung aja ini caranya....

So Pasti Kamu harus Loggin di Blogger
Trus Langkah Selanjutnya Klik RANCANGAN.
Edit HTML
Sekedar untuk jaga-Jaga Kamu klik Download Template Lengkap takutnya Kamu Terjadi Kesalahan
Jangan Lupa juga Untuk Centang Expland Template Widget
Cari kode <b:skin><![CDATA[/*.kode untuk mempercepat pencarian Tekan Ctrl + F lalu isikan kode tadi
7. Copy kode di dalam kolom ini lalu paste di atas kode tersebut.

<script src='http://achmad46.googlepages.com/rainbow.js'>

</script>

Selasa, 23 Oktober 2012

Hari ke-21 Masuk PKL

Rabu ,24 Oktober 2012
Masuk Pukul 08.00 s/ 12.00 WIB

Berikut kode calender cuteki:

http://www.cuteki.com/widgets/calendars/calendar-widget.aspx?id=1
http://www.cuteki.com/widgets/calendars/calendar-widget.aspx?id=2
http://www.cuteki.com/widgets/calendars/calendar-widget.aspx?id=3
http://www.cuteki.com/widgets/calendars/calendar-widget.aspx?id=4

erikut contoh lain calender cuteki :

How to put it on your Blor or WebSite:
· Choose the language of the calendar widget
· Adjust the size of the calenadar widget (clicking and dragging the size bar)
· Copy the calendar widget code (click "GET CODE ")
· Paste code on your Blog or Web Page code (in HTML View)

www.kebumenmedianet.com

Hari ke-20 Masuk PKL

Selasa ,23 Oktober 2012
Masuk Pukul 08.00 s/d 12.00 WIB

CARA MEMBUAT LINK BERKELIP DISERTAI KERLIPAN BINTANG :

Jika pada postingan terdahulu tentang efek yang terjadi pada link menyebabkan link bergoyang dan juga menyebabkan link berkedip dan bergetar, nah untuk efek pada link kali ini menggunakan gabungan CSS dan gambar. Efek yang ditimbulkan pada link jika mouse diarahkan atau didekatkan atau disorot maka akan membuat link berkelip disertai kerlipan bintang (Efek Hover).

Untuk memasang link berkelip dengan kerlipan bintang disekelilingnya ini sangat cocok untuk template blog dengan latar belakang yang gelap, kan bintang adanya di malam hari, jadi akan terlihat bersinar dan terang benderang di malam hari.

Cara membuat link berkelipan bintang di Blog :

1. Login ke Blogger
2. Pilih Template => Edit HTML
3. Cari kode </head> dan letakkan kode berikut ini diatasnya

<style>
a:hover { text-decoration:blink; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9hZyie8SnpQIImxwqInqdmtdwd2QAHzc8nhnQvTHpiBqeHMbDvY5uGRhoXCrQW1NvF7AzXH0zauZNzGP0nvS_wc4sSsbbnuj5zg0itWA3I1QgmFleqbv5-ODqCP3z5JErNuAclojKVJQ/s1600/str4.gif); }
</style> 4. Selesai dan simpan

Sekian dulu postingan tentang membuat link berkelip / berkedip disertai bintang, selamat mencoba dan semoga bermanfaat.

www.kebumenmedianet.com

Minggu, 21 Oktober 2012

Hari ke-19 Masuk PKL

Senin ,22 Oktober 2012

Masuk Pukul 08.00 s/d 12.00 WIB

Di minggu ke-4 ini saya masuk pukul 08.00,Seperti biasa ,sebelum memulai kegiatan kami membersihkan ruangan tempat prakerind agar terasa nyaman .Setelah itu saya langsung melanjutkan mendesain blog saya.

Mengganti favicon blogspot dengan gambar sendiri

1. Login blogspot >> Dashboard
2. Masuk ke Design >> edit HTML

3. Copy code dibawah ini
<link href='URL your image' rel='shortcut icon' type='image/vnd.microsoft.icon'/>
dan pastekan dibawah kode
<title><data:blog.pageTitle/></title>
Sehingga bentuknya kan seperti ini
4. Ganti tulisan merah URL your image dengan kode URL icon kamu.
Kalau kamu ngambil iconnya dari internet, kamu tinggal klik kanan pada iconmu terus pilih "Copy Image URL" . Tapi kalau kamu buat sendiri, kamu harus upload dulu icon kamu.
5. Save Template.
Sekarang liat blog kamu, apakah sudah berhasil. Harusnya sih berhasil ^^
BAGIAN KEDU:
Sekarang kita setting favicon pada Page Halaman, kalau tadikan pada bagian Edit Halaman Sekarang kamu pindah ke bagian Page Halaman. Tujuannya agar saat kamu di follow blog lain, tampilan icon blog kamu tidak kembali lagi ke icon blogspot.
Ikuti langkah berikut yaa :

1. Masuk ke Design >> Page Halaman
2. Klik edit pada kotak favicon
3. Pilih choose file dan cari icon yang akan kamu upload.
Nah kalau ini, kamu harus download icon kamu dulu (kalau ngambil dari internet).
Kalau upload gagal dan ada tulisan "Not Square Image" atau "This file is too large. You can upload a file up to 100kb in size" ini berarti icon kamu harus diedit.
Baca ketentuannya dibagian atas :
Please use a square image that's less than 100 KB.
Ini artinya bahwa icon yang kamu upload harus berbentuk PERSEGI (Square) bukan yang lain dan ukurannya harus kurang dari 100 KB.
So, edit icon kamu. Gunakan photoshop saja. Buat agar panjang dan lebarnya saja.
Kalau masih bingung mengubah ukurannya, begini caranya :
Buka icon kamu di Adobe photoshop
Pilih menu Image >> Image size
Hilangkan tanda centang di kotak Constrain Proportions
Ganti Width dan Height pada bagian Pixel Dimensions dengan ukuran yang sama.
Klik OK
Save icon kamu
4. Kalau icon kamu muncul dan tidak ada tulisan seperti diatas berarti berhasil.
Sekarang icon blog kamu sudah 100% berganti dengan icon kamu :)

www.kebumenmedianet.com

Jumat, 19 Oktober 2012

Hari ke-18 Masuk PKL

Sabtu ,20 Oktober 2012
Masuk Pukul 08.00 s/d 13.00 WIB

Seperti biasa di hari sabtu kami masuk pukul 08.00 s/d 13.00.Sebelum kami memulai kegiatan kami membersihkan ruangan tempat prakerin terlebih dahulu.setelah itu saya melanjutkan mendesain blog dan menambahkan calender di dalamnya.

Cara Memasang Kalender di Blog

Mungkin sebagian dari para blogger ada yang memasang kalender pada blognya, selain agar mereka mengetahui tanggal pada hari tersebut, biasanya kalender ini digunakan untuk menambah hiasan di blognya masing-masing.

Kemudian bagaimana cara memasang kalender di blog..?
Caranya sangat mudah, mari kita baca di bawah ini :

Untuk memasang sebuah kalender kita bisa memanfaatkan berbagai situs penyedia kalender gratisan. Situs seperti ini sangatlah banyak, dengan menampilkan kalender-kalender yang menarik untuk di lihat.

Sebagai contoh :

http://www.free-blog-content.com.

Di dalam situs ini kalender yang di sediakan sangat beragam. hanya dengan mengklik kategori yang ada untuk memilih bentuk kalender yang anda inginkan untuk dipasang di blog anda, kemudian copy kode yang di berikan di bawah gambar kalender lalu paste pada blog anda dengan cara sebagai berikut :

Klik menu Tata Letak

Klik menu Elemen Halaman

Klik tulisan Tambah Gadget

pilih tulisan HTML/JavaScript

Copy kode kalender tersebut kemudian paste pada kolom yang di sediakan

Klik tombol SIMPAN

Selesai. kemudian lihat perubahan blog.

Jika sudah berhasil, salah satu contoh gambar kalender yang di sediakan akan tampak seperti contoh dibawah ini :

Adapun bagi anda yang ingin memasang widget kalender Hijriah, salah satu situs yang menyediakan widget tersebut adalah http://hijriah.jentayu.com. Bentuk kalendernya seperti dibawah ini :

Jika anda ingin memasang widget kalender hijriah seperti diatas ada tinggal mengunjungi situs penyedia tersebut. atau jika anda ingin lebih cepat, copy kode dibawah ini :

<script src="http://hijriah.jentayu.com/hijriah.php?color=7"> </script>

Ganti tulisan 7 dengan warna yang anda inginkan dibawah ini :

1 akan menjadi warna cokelat
2 akan menjadi warna kuning
3 akan menjadi warna ungu
4 akan menjadi warna biru
5 akan menjadi warna hijau
6 akan menjadi warna abu-abu
7 akan menjadi warna merah

Untuk langkah-langkah pemasangannya sama persis seperti diatas,

Demikianlah artikel tentang Cara Memasang Kalender di Blog
Kembali ke Beranda Blog Trik Tips Tutorial
Semoga Bermanfaat.. www.kebumenmedianet.com

Kamis, 18 Oktober 2012

Hari ke-17 Masuk PKL

Jum'at ,19 Oktober 2012

Masuk Pukul 12.00 s/d 12.00 WIB

Di hari jum'at ini saya masuk pagi,karena temen saya ada keperluan pribadi jadi saya disuruh menggantikannya .Nah di hari jum'at ini saya akan menjelaskan bagaimana cara membuat efek gelembung pada kursor,ayo kita tengok bagaimana cara membuatnya ...........................

Cara Membuat Efek Gelembung (Bubble) Pada Cursor Blog
Pada tutorial blogger kali ini saya akan menuliskan panduan cara bikin efek gelembung atau membuat efek bubble pada cursor bloggger.

Dengan menggunakan script yang akan saya sertakan di bawah nanti, cursor blog blogger teman akan mengeluarkan gelembung-gelembung atau bisa juga di sebut bubble.

Sebelum saya menuliskan caranya, saya ingin menegaskan bahwa ini hanya salah satu cara untuk mempercantik atau menghias blog kita, dan sifatnya tidak wajib, karena mungkin saja ini bisa memperberat loading blog teman.

Mari kita mulai panduan membuat efek bubble ini.
Cara Bikin Efek Bubble atau Gelembung Pada Cursor Blogger
Di sini saya akan menuliskan 2 cara yang bisa kita lakukan agar cursor blog kita bisa mengeluarkan gelembung.
Cara Pertama
1. Klik Tata Letak
2. Klik Tambah Gadget / Add A Gadget
3. Pilih Gadget Html/JavaScript
4. Masukkan Efek Gelembung (Bubble) di dalamnya (jangan lupa klik Edit HTML ya, letaknya di sebelah kanan atas kolom isian).
5. Simpan.

Berikut script Efek Gelembung / Efek Bubble yang harus di pasang, silakan pasang script berikut sesuai tutorial yang sudah saya tuliskan di atas:
<script type="text/javascript" src="http://www.freewebs.com/p.js"></script><script type="text/javascript">
// <![CDATA[
var colours=new Array("#cc0000", "#cc0000", "#cc0000", "#cc0000", "#cc0000"); // colours for top, right, bottom and left borders and background of bubbles
var bubbles=100; // maximum number of bubbles on screen

var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var bubb=new Array();
var bubbx=new Array();
var bubby=new Array();
var bubbs=new Array();

window.onload=function() { if (document.getElementById) {
var rats, div;
for (var i=0; i<bubbles; i++) {
rats=createDiv("3px", "3px");
rats.style.visibility="hidden";

div=createDiv("auto", "auto");
rats.appendChild(div);
div=div.style;
div.top="1px";
div.left="0px";
div.bottom="1px";
div.right="0px";
div.borderLeft="1px solid "+colours[3];
div.borderRight="1px solid "+colours[1];

div=createDiv("auto", "auto");
rats.appendChild(div);
div=div.style;
div.top="0px";
div.left="1px";
div.right="1px";
div.bottom="0px"
div.borderTop="1px solid "+colours[0];
div.borderBottom="1px solid "+colours[2];

div=createDiv("auto", "auto");
rats.appendChild(div);
div=div.style;
div.left="1px";
div.right="1px";
div.bottom="1px";
div.top="1px";
div.backgroundColor=colours[4];
div.opacity=0.5;
if (document.all) div.filter="alpha(opacity=50)";

document.body.appendChild(rats);
bubb[i]=rats.style;
}
set_scroll();
set_width();
bubble();
}}

function bubble() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<bubbles; c++) if (!bubby[c]) {
bubb[c].left=(bubbx[c]=x)+"px";
bubb[c].top=(bubby[c]=y)+"px";
bubb[c].width="3px";
bubb[c].height="3px"
bubb[c].visibility="visible";
bubbs[c]=3;
break;
}
}
for (c=0; c<bubbles; c++) if (bubby[c]) update_bubb(c);
setTimeout("bubble()", 40);
}

function update_bubb(i) {
if (bubby[i]) {
bubby[i]-=bubbs[i]/2+i%2;
bubbx[i]+=(i%5-2)/5;
if (bubby[i]>sdown && bubbx[i]>0) {
if (Math.random()<bubbs[i]/shigh*2 && bubbs[i]++<8) {
bubb[i].width=bubbs[i]+"px";
bubb[i].height=bubbs[i]+"px";
}
bubb[i].top=bubby[i]+"px";
bubb[i].left=bubbx[i]+"px";
}
else {
bubb[i].visibility="hidden";
bubby[i]=0;
return;
}
}
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sleft;
x=(e)?e.pageX:event.x+sdown; }

window.onresize=set_width;
function set_width() {
if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (typeof(self.innerHeight)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
else {
swide=800;
shigh=600;
}
}
window.onscroll=set_scroll;
function set_scroll() {
if (typeof(self.pageYOffset)=="number") {
sdown=self.pageYOffset;
sleft=self.pageXOffset;
}
else if (document.body.scrollTop || document.body.scrollLeft) {
sdown=document.body.scrollTop;
sleft=document.body.scrollLeft;
}
else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
}
else {
sdown=0;
sleft=0;
}
}
function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height;
div.style.width=width;
div.style.overflow="hidden";
return (div);
}
// ]]>
</script>
Keterangan:
Kode #cc0000", "#cc0000", "#cc0000", "#cc0000", "#cc0000 adalah kode warna gelembung, silakan ganti dengan warna yang kamu mau, agar lebih mudah menemukan kode warna yang kamu inginkan silakan cari di Daftar Kode HTML Warna / Kode Warna.
Kode 100 adalah jumlah maksimal gelembung yang akan keluar, silakan ganti angka 100 dengan angka / jumlah gelembung yang kamu suka.Nah itulah tutorial cara membuat efek gelembung / efek bubble pada cursor di blogger.

Selamat mencoba dan semoga bermanfaat.

www.kebumenmedianet.com

Rabu, 17 Oktober 2012

Hari ke-16 Masuk PKL

Kamis ,18 Oktober 2012
Masuk Pukul 12.00 s/d 16.00 WIB

Seperti biasa saya masuk pukul 12.00 .Karena di minggu ke-3 ini saya masuk siang yaitu masuk pukul 12.00 dan pulang jam 16.00.Dan sebelum pulang saya dan teman saya membersihkan ruangan tempat prakerind terlebih dahulu.

Membuat Tanda Tangan Signature Blog - Sekarang untuk membuat tanda tangan digital atau signature di blog dapat sobat lakukan secara online tanpa perlu membuatnya secara manual menggunakan photoshop atau software lain. Memasang tanda tangan di bawah postingan blog jika dibuat dan ditata dengan bagus tentu saja akan membuat tampilan halaman blog menjadi terlihat lebih menarik dan professional. Tanda tangan digital juga dapat digunakan untuk tanda tangan di forum kaskus karena kode tangan yang kita dapatkan dari situs MyLivesignature ini terdiri dari 2 kode, yaitu kode HTML untuk pemasangan dihalaman posting blog dan kode BB untuk tanda tangan di forum kaskus.

Cara Membuat Tanda Tangan Digital di Blog :

1. Langsung saja meluncur ke alamat http://mylivesignature.com/ dan klik tulisan Click Here To Start.
2. Pada halaman berikutnya pilih Using the signature creation wizard.
3. Di halaman wizard (1-6 step) ini masukkan data yang diminta kemudian klik Next Step.
wizard 1: Masukkan name atau nama tanda tangan.
wizard 2: Pilih jenis huruf/font yang digunakan.
wizard 3: Tentukan ukuran besar/kecilnya tanda tangan.
wizard 4: Tentukan warna background serta warna teks tanda tangan.
wizard 5: Aturlah slope/kemiringan tanda tangan.
wizard 6: Tanda tangan sudah selesai tinggal ambil kodenya.
4. Langkah selanjutnya tinggal mengambil kode tanda tangan yang sudah selesai dibuat dengan mengklik tulisan Want to use this signature ?.
5. Nah disini 2 pilihan kode yang bisa di generate, pilih saja Generate HTML code karena kita akan menggunakannya untuk tanda tangan di bawah postingan blog.
6. Klik lagi Generate a code for my handwritten signature.
7. Copy kode HTML tanda tangan yang diberikan dan simpan di notepad.

Hari ke-15 Masuk PKL

Rabu ,17 Oktober 2012

Masuk Pukul 12.00 s/d 16.00 WIB

Seperti biasa saya masuk pukul 12.00 .Sesampainya di tempat prakerin saya langsung melanjutkan mendesain blog saya .Banyak cara dilakukan untuk bisa membuat blognya tampil menarik. Salah satu cara yang bakal saya bagikan kali ini adalah cara membuat cursor bertabur bintang pada blog. Tutorial ini didapat dari blognya Muji Jaya Ganesha .
Berikut langkah - langkahnya :
Login ke blogger
Masuk ke Design >> Page Element
Tambah Gadget >> HTML/Javascript
Copy Paste kode di bawah ini
Bintang Pink
<script src="http://arifinsarpon.googlecode.com/files/mujijayaganesha.blogspot.com_cursor_pink.js" type="text/javascript"/></script>

Bintang Merah
<script src="http://arifinsarpon.googlecode.com/files/mujijayaganesha.blogspot.com_cursor_merah.js" type="text/javascript"/></script>

Bintang Biru
<script src="http://arifinsarpon.googlecode.com/files/mujijayaganesha.blogspot.com_cursor_biru.js" type="text/javascript"/></script>

Bintang Hijau
<script src="http://arifinsarpon.googlecode.com/files/mujijayaganesha.blogspot.com_cursor_hijau.js" type="text/javascript"
/></script>

Selasa, 16 Oktober 2012

Hari ke-14 Masuk PKL

Selasa ,16 Oktober 2012
Masuk Pukul 12.00 s/d 16.00 WIB

Seperti bisa saya masuk pukul 12.00.Sesampai di tempat prakerind saya langsung melanjutkan mendesain blog saya yaitu memberikan gambar flash vortex.
Cara mudah membuat animasi flash teks berjalan(marquee) pada Flashvortex.com

1. Silahkan login ke www.flashvortex.com, atau kalau anda ingin langsung ke halaman utama pembuatan teksnya, klik disini
2. Selanjutnya anda akan di arahkan pada halaman utama flashvortex.com seperti pada gambar di bawah.

Klik tombol teks dan anda akan di arahkan pada halaman seperti pada gambar di bawah.

3. Pada halaman ini, ada beberapa macam pilihan teks animasi, anda klik saja pada ”Scrolling text marquee”, dan halaman selanjutnya yang akan muncul adalah seperti pada gambar di bawah.

4. Selanjutnya anda harus mengisi beberapa kolom, antara lain :
Text : Tulislah teks/kalimat yang ingin anda tampilkan. Penggunaan spasi di akhir tulisan pada kolom ini sangat penting, karena akan berpengaruh pada waktu jeda tampilnya tulisan anda. Kalau anda tidak memakai spasi maka tulisan anda akan muncul secara beruntun.

Txts color : Warna teks, anda cukup meng-klik kotak kecil yang ada, selanjutnya anda atur warna teks sesuai dengan keinginan anda.

Show border : kalau anda hilangin tanda centangnya, maka teks/kalimat yang akan tampil tanpa kotak kolom/garis tepi, dan akan kelihatan lebih transparan seperti animasi saya di bawah.
Left and right padding : lebar tepi kolom teks.
Movie background color : Warna dasar animasi tulisan
Setelah anda selesai mengisi kolom-kolom tersebut, kemudian anda klik tombol ”Generate Animation” dan akan muncul halaman seperti gambar di bawah.

5. Bagi blogger yang menggunakan blogspot/wordpress.org, copy kode sebelah kiri, dan bagi anda yang menggunakan wordpress.com silahkan download animasi flash tersebut, dan simpan di computer/netbook anda yang nantinya akan di install dulu agar bisa di pasang pada halaman blog anda.

www.kebumenmedianet.com