BISNIS ONLINE

Cara Agar Artikel Blog Tidak Bisa Di Copy Paste Terbaru

Posted by BISNIS ONLINE on Saturday, February 27, 2016

Marquee adalah kode html yang berfungsi untuk membuat teks atau tulisan menjadi berjalan contohnya di kehidupan sehari hari seperti pada layar bawah tv biasanya ada tulisan berjalan yang berisi sebuah news / berita, namun script ini digunakan pada sebuah blog, wordpress maupun web yang biasanya efektif untuk memberikan info kepada pengunjung sebab dapat membuat penglihatannya tertuju pada teks berjalan yang menarik dengan berbagai macam style, warna dan gerakan tersebut.

Kali ini saya akan share gimana Cara Membuat Tulisan Berjalan (Marquee) Di Blog Terbaru, silahkan ikuti tutorial langkah langkah berikut lengkap beserta gambarnya buat sobat yang ingin memasukkan, memasang, menambahkan, menampilkan efek animasi teks berjalan pada blog / wordpress / web dengan script html.

Berikut 2 cara memasang tulisan berjalan (efek marquee)

Cara Memasang Tulisan Berjalan Di Dalam Artikel :

1. Masuk ke Text Editor dan klik HTML seperti pada gambar

2. Kemudian masukkan script kode berikut ke dalam isi artikel, ganti kode warna merah dengan tulisan yang sobat inginkan, jika sudah klik Compose

<marquee>Contoh Teks Berjalan Dengan Menggunakan efek Marquee</marquee>

3. Setelah itu klik Publikasikan untuk melihat hasilnya.. Selesai

Cara Memasang Tulisan Berjalan pada Widget Blog :

1. Masuk menu Tata Letak dan klik Tambahkan Gaget

2. Kemudian klik tombol tambah pada HTML/Javascript

3. Setelah itu masukkan scriptnya ke dalam kotak konten, jika sudah klik Simpan.. Selesai

Berikut adalah kode - kode marquee dengan berbagai efek dan style, jika sobat ingin memasangnya silahkan lihat kodenya dibawah ini

Marquee Standar

<marquee>Contoh Teks Berjalan dengan Efek Marquee Standar</marquee>

Menambahkan background pada tulisan berjalan

<marquee style="background: gray;">Contoh Teks Berjalan dengan Background Abu Abu</marquee>

Mangganti warna tulisan berjalan

<marquee style="background: gray; color: white;">Contoh Teks Berjalan dengan Background Abu Abu dan Teks warna putih</marquee>

Membuat Tulisan Berjalan pada setengah layar

<marquee width="50%">Contoh Teks Berjalan dengan Width 50%</marquee>

Membuat Tulisan Berjalan dengan jeda waktu tertentu

<marquee scrolldelay="500">Contoh Teks Berjalan dengan Scrolldelay 500</marquee>

Mengatur Kecepatan berjalannya tulisan

<marquee scrollamount="10">Contoh Teks Berjalan dengan Speed Scroll Amount 10</marquee>

Membuat Tulisan Berjalan dari kiri ke kanan

<marquee direction="right">Contoh Teks Berjalan dari Kiri ke Kanan</marquee>

Membuat Tulisan Berjalan dengan efek memantul

<marquee behavior="alternate">Contoh Tulisan Berjalan dengan Efek Memantul</marquee>

Membuat Tulisan Berjalan dari mulai bawah ke atas

<marquee direction="up">Contoh Tulisan Berjalan dari Bawah ke Atas</marquee>

Membuat Tulisan Berhenti Berjalan ketika disentuh kursor mouse

<marquee onmouseover="this.stop()" onmouseout="this.start()">Contoh Teks Berhenti Berjalan ketika disentuh kursor mouse</marquee>

Nah itulah bagaiamana membuat tulisan berjalan efek Marquee di blog dengan mudah dan cepat.

Silahkan dicoba Eco Racing 12:54 AM New Google SEO Bandung, Indonesia

Cara Membuat Tulisan Berjalan (Marquee) Di Blog Terbaru

Posted by BISNIS ONLINE on Friday, February 26, 2016

Jam dan kalender merupakan hal yang umum di kehidupan sehari-hari karena berfungsi sebagai pengingat untuk melihat berapa tanggal dan waktu yang ditujukkan sekarang. Adapun bagi blogger yang ingin menghias dan memperindah blog nya juga dapat memasang widget jam dan kalender keren pada bagian sidebar blog yang bisa didapatkan secara gratis serta mempunyai berbagai macam banyak pilihan bentuk dan warna yang bagus.

Kali ini saya akan share gimana Cara Memasang Widget Jam Dan Kalender Di Blog Terbaru, silahkan ikuti tutorial langkah langkah berikut lengkap beserta gambarnya buat sobat yang ingin menambahkan / pasang animasi widget jam analog / digital dan kalender keren, lucu, unik pada blog untuk membuat tampilannya menjadi lebih menarik.

Cara Menambahkan Jam dan Kalender di Blog :

1. Bikin widget jam dan kalender seperti gambar diatas yaitu sobat harus mendapatkan script widgetnya terlebih dahulu, untuk jam silahkan buka situs http://localtimes.info/getwidget/analog/ maka akan muncul tampilan dibawah ini kemudian ada beberapa option di sebelah kanan silahkan ubah seperti city ( kota ), size ( ukuran ), widget type ( tipe widget analog / digital / world ), widget number ( bentuk widget ), color (warna) dll. Jika sudah maka sobat telah mendapatkan script kode widget jam tersebut seperti pada gambar.

2. Untuk kalender silahkan sobat buka situs http://mycalendar.org/getwidget/2/ maka akan muncul gambar dibawah ini kemudian ada beberapa option silahkan ubah seperti size ( ukuran ), transparent ( tembus pandang ), no calender label ( tulisan calender ) dan warna bisa lihat di halaman bawahnya. Jika sudah klik tombol refresh maka sobat telah mendapatkan script kode widget kalender tersebut seperti pada gambar

3. Setelah script kode dari widget jam dan kalender telah didapatkan lalu tinggal memasangnya di blog silahkan sobat masuk ke menu Tata Letak dan klik Tambahkan Gadget pada bagian sidebar

4. Kemudian klik tombol tambah pada pilihan HTML/Javascript

5. Lalu masukkan script kode jam atau kalender atau bisa juga keduanya langsung pada kotak konten, agar letaknya pas ditengah bisa menambahkan kode <center> pada awal script dan kode </center> pada akhir script kode dan jika memasukkan kedua script langsung bisa berikan kode <br /> antara kedua script tersebut untuk spasi nya, jika sudah klik Simpan.. Selesai

6. Berikut adalah tampilan widget jam dan kalender yang telah terpasang pada sidebar blog

Nah itulah bagaimana memasang widget jam dan kalender di blog dengan mudah dan cepat.

Silahkan dicoba Eco Racing 6:17 PM New Google SEO Bandung, Indonesia

Cara Memasang Widget Jam Dan Kalender Di Blog Terbaru

Posted by BISNIS ONLINE on Wednesday, February 17, 2016

Salah satu cara lain untuk memperindah dan membuat tampilan blog menjadi menarik yaitu dengan membuat text atau tulisan bergerak mengikuti kursor di blog. Mungkin sobat blogger pernah berkunjung pada sebuah blog dan melihat tulisan bergerak mengarah ke mana saja kursor sobat gerakkan lalu jika kursor didiamkan maka tulisan tersebut akan terus berputar mengelilingi cursor. Sebenarnya sobat juga bisa membuatnya secara mudah dengan hanya menambahkan script html tertentu pada blog.

Kali ini saya akan share gimana Cara Membuat Tulisan Mengikuti Kursor Di Blog Terbaru, silahkan ikuti tutorial langkah langkah berikut lengkap beserta gambarnya buat sobat yang ingin membuat text bergerak / berjalan / berputar mengelilingi cursor pada blog.

Cara Membuat Tulisan Bergerak Mengikuti Cursor :

1. Bikin tulisan mengelilingi kursor seperti diatas yaitu dengan cara masuk ke menu Tata Letak dan klik Tambahkan gadget

2. Kemudian klik tombol tambah pada pilihan HTML/Javascript

3. Setelah itu masukkan kode berikut ke dalam kotak konten seperti pada gambar, silahkan ganti script yang ditandai merah dengan kode warna (bisa lihat disini) dan tulisan yang sobat inginkan, jika sudah klik Simpan.. Selesai

<style type='text/css'>
/* Circle Text Styles */
#outerCircleText {
font-style: italic;
font-weight: bold;
font-family: 'comic sans ms', verdana, arial;
color: #4679BD;/*Ganti warna sesuai keinginan*/
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;}
</style>
<script type='text/javascript'>//<![CDATA[
/* 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(){
var msg = "Welcome To My Blog"; // Ganti tulisan sesuai keinginan
var size = 24;
var circleY = 0.75; var circleX = 2;
var letter_spacing = 5;
var diameter = 10;
var rotation = 0.4;
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>

4. Berikut adalah tampilan text bergerak mengelilingi kursor pada blog

Nah itulah bagaimana membuat tulisan mengikuti kursor di blog dengan mudah dan cepat.

Silahkan dicoba Eco Racing 7:47 PM New Google SEO Bandung, Indonesia

Cara Membuat Tulisan Mengikuti Kursor Di Blog Terbaru

Posted by BISNIS ONLINE on Tuesday, February 16, 2016

Cara Memasang Widget Kamera CCTV Di Blog Terbaru

Posted by BISNIS ONLINE on Monday, February 15, 2016

Siapa yang tidak tahu dengan twitter yang merupakan salah satu sosial media populer di internet. Perlunya menambahkan widget twitter di blog, selain agar mendapatkan banyak follower juga dapat membuat blog ramai pengunjung yang dapat ngetweet atau share artikel kita di twitter. Bagi para blogger mungkin tidak asing lagi dengan widget burung twitter yang terbang kesana kemari di tampilan blog. Namun tidak ada salahnya saya untuk berbagi kembali tutorial berikut khususnya untuk blogger yang baru supaya dapat membuat blognya lebih menarik.

Kali ini saya akan share gimana Cara Membuat Burung Twitter Terbang Di Blog Terbaru, silahkan ikuti tutorial langkah langkah berikut lengkap beserta gambarnya buat sobat yang ingin memasang / menambahkan widget animasi burung twitter untuk blog.

Cara Memasang Burung Twitter Terbang Di Blog :

1. Bikin widget burung twitter terbang seperti gambar diatas yaitu dengan cara masuk ke menu Tata Letak dan klik Tambahkan Gadget

2. Kemudian klik tombol tambah pada HTML/Javascript

3. Setelah itu masukkan kode berikut ke dalam kotak konten seperti pada gambar, untuk kode warna biru silahkan ganti dengan url akun twitter sobat, jika sudah klik Simpan.. Selesai

<script type="text/javascript" src="https://googledrive.com/host/0BxH5pEKXqBWUSmpWajYwdTZMWXc/burung-twitter-terbang-di-blog-masyadi-com.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEho5g588-eOwtIy1BUE8-TRxFr0fksQtfc4f4-dXWjQX_fZpuJITxNPo5C3CFaymNjiPwRKx-DtXs1_kPGvEX9If_o16MytQxLehmKcIlPEgurGpxsEssRjeqK1v24a9drpOUXrXXBNvHc/s1600/cyan+bird.png";
var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3",
"h4","p","code","object","a","b","strong","span");
var twitterAccount = "http://twitter.com/cara_zain";
var tweetThisText = "Twitter - UserID http://carazain.blogspot.com/";
tripleflapInit();
</script>

Untuk membuat burung twitter dengan warna lain sobat dapat mengganti kode yang berwarna merah diatas dengan kode di bawah ini sesuai dengan keinginan

Burung twitter warna putih
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzIipZ8kC9s2Osp3R_5QLvsOSiVrtwqvF8wvO30_1iqH9kJLqzqgVzQTbOT8TuKkFe4KK4x-Fc_BIt8W1bwafPOeyOJMPYvrBHsD0_3FKxaiKkVst2t0b_krj-EPHQyBNUEmsMiHQKKmQ/s1600/white+bird.png

Burung twitter warna kuning
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJaoVMPa0T6PatEG0-w7rK9dbnjHC8l0K2zGgsyyu3CiIbWsGXvRIOWYTdjVuCgpPNxXskT0q9fZYK7lFHT7uv6HMvNsgtWKRLrIgSHPCPDGql1sMMewWjYLLBiW0CpSFabzx9k5KKYjA/s1600/yellow+bird.png

Burung twitter warna merah
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgR4mrArFajw0UQh1LlRY5g0yisBS8mg1MYtl4wbbgzrZCiKjgAGeKmotLIEqvMqbwTLyA-S1kXipUaJQRDyi2nPYQOSV2gVwIUZQIWdjGrQSKjWbKnx-ZWYc0ZQjSm8_s0wEtQYA6dMa8/s1600/red+bird.png

Burung twitter warna ungu
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjPYqYX21m82jD-xLQi3HEowoab-wr5GSLAe8r9JfQ7KMPB3YaGaBDm6jFeJmO_Fn7vbD2WxoDTMX3agQWDqtaObheA4KSQLXELapnphl3rb2bwLGbTxYF-9Pd701j8UxwulyQZiDZuj0/s1600/purple+bird.png

Burung twitter warna hijau
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVbjh_-bn1ki0qu6AzT9VI-E_B7rR9XpTjrEulwW0dWOAxwzzoqd7lUMGb7bgB2lYJ_EGBrCx_mFACgl1CbzG_pXE2SVXtDqFmhDRdlQ04TEKZNU0rsl5vo-jyHv1NTI0F7IUjhC0Sgog/s1600/Green+bird.png

Burung twitter warna biru
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEho5g588-eOwtIy1BUE8-TRxFr0fksQtfc4f4-dXWjQX_fZpuJITxNPo5C3CFaymNjiPwRKx-DtXs1_kPGvEX9If_o16MytQxLehmKcIlPEgurGpxsEssRjeqK1v24a9drpOUXrXXBNvHc/s1600/cyan+bird.png

Burung twitter warna coklat
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_VEMzsDGsrPKwsUnXLOZwMk76e5QLgkGaL25Ulbi2zYJUsBfmfItSN74z1CdWecfP9Eanpu6VaYMIvqlXWZTAPG3Olwke6EZnLLDbm20Sq_MLQHndlKIBQGnIFDv3Jl8V50pEFZgTf4U/s1600/brown+bird.png

Burung twitter warna hitam
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDtlybPLUmX3LX0SyRghYbh-1tvYFdW7k5z5xMQbOgNn8I-SGbsZl97WLmsVbnUfRPo3t7n9zh-PAiFEnQk3F5yoCqqqlGtv4TSx-fBGRfHDvShHDWIt-mnA-TrvphD7lt-M-HP1209ls/s1600/black+bird.png

4. Berikut adalah tampilan widget burung twitter terbang yang telah dipasang pada blog

Nah itulah bagaimana membuat burung twitter terbang di blog dengan mudah dan cepat.

Silahkan dicoba Eco Racing 12:13 AM New Google SEO Bandung, Indonesia

Cara Membuat Burung Twitter Terbang Di Blog Terbaru

Posted by BISNIS ONLINE on Sunday, February 14, 2016

Background blog adalah tampilan latar belakang dari sebuah blog yang berbeda pada setiap template yang dipakai dan biasanya secara default hanya berupa warna saja. Mengganti background blog juga dapat membuat blog menjadi indah dan memberikan kenyamanan pada pengunjung agar betah untuk berlama-lama di blog tersebut serta dapat mengecilkan bounce rate blog yang sangat baik untuk SEO. Bagi para blogger yang bosan dengan tampilan background blognya dan ingin mengubahnya dengan gambar yang keren bisa mengikuti langkah berikut ini.

Kali ini saya akan share gimana Cara Mengganti Background Blog Dengan Gambar/Foto/HTML, silahkan ikuti tutorial langkah langkah berikut lengkap beserta gambarnya buat sobat yang ingin ganti / mengubah background dengan gambar, warna, atau animasi bergerak sesuai dengan keinginan agar membuat nya menjadi keren.

Cara Mengganti Background Blog Sesuai Keinginan :

1. Bikin background blog seperti gambar diatas yaitu dengan cara masuk ke menu Template dan klik Sesuaikan

2. Kemudian pilih menu Latar Belakang dan klik Gambar latar seperti berikut

3. Setelah itu akan muncul tampilan berikut, pilih kategori yang diinginkan lalu klik salah satu gambar background yang disukai atau sobat juga bisa klik unggah gambar untuk upload gambar / foto sendiri untuk dijadikan background blog, jika sudah silahkan klik Selesai maka background blog sobat akan berubah menjadi gambar tersebut

4. Jika cara diatas tidak bisa disebabkan blog sudah diganti templatenya dengan hasil download maka bisa menggunakan cara berikut yaitu masuk menu Template dan klik Edit HTML

5. Kemudian cari kode body{background: ,gunakan Ctrl+F untuk mempermudah pencarian

6. Setelah itu ganti kode yang ditandai warna merah dengan url gambar milik sobat, jika sudah klik Simpan template.. Selesai

#Catatan : Format gambar yang dapat digunakan menjadi background adalah jpg, gif, png dengan ukuran hingga 300kb tapi disarankan dibawah 50kb agar loading blog tidak berat dan untuk mendapatkan latar belakang penuh bisa gunakan gambar dengan ukuran 1800x1600 atau lebih besar serta jika ingin posisi gambar tetap ketika di scroll maka harus memiliki panjang minimal 860px contoh 1400x880

Nah itulah bagaimana mengganti background blog dengan gambar / foto / html dengan mudah dan cepat.

Silahkan dicoba Eco Racing 7:51 AM New Google SEO Bandung, Indonesia

Cara Mengganti Background Blog Dengan Gambar/Foto/HTML

Posted by BISNIS ONLINE on Saturday, February 13, 2016

Cursor / pointer mouse adalah sebuah tanda yang berfungsi sebagai petunjuk posisi mouse pada layar monitor. Kursor biasanya berbentuk tanda panah, namun kita dapat mengubah bentuknya sesuai dengan keinginan atau merubahnya menjadi animasi yang keren, lucu, unik dan bergerak. Bagi para blogger mengganti kursor adalah salah satu cara untuk membuat blog nya menjadi lebih bagus dan menarik sebab cursor merupakan bagian penting dari sebuah blog untuk menarik perhatian pengunjung.

Kali ini saya akan share gimana Cara Mengganti Cursor Mouse Di Blog Keren Terbaru, silahkan ikuti tutorial langkah langkah berikut lengkap beserta gambarnya buat sobat yang ingin merubah kursor / pointer pada blog dengan animasi dan membuat nya menjadi keren.

Cara Mengganti Kursor Blog Dengan Animasi Keren :

1. Bikin cursor seperti gambar diatas yaitu dengan cara buka situs www.cursors-4u.com, lalu lihat disebelah kiri layar terdapat beberapa pilihan kategori, silahkan pilih sesuai dengan keinginan

2. Kemudian klik gambar icon cursor yang sobat suka

3. Setelah itu copy script kode yang ada pada CSS/HTML Code seperti gambar berikut

4. Jika sudah di copy lalu masuk ke menu Template pada blogger dan klik Edit HTML

5. Kemudian cari kode </head>, gunakan Ctrl+F untuk memudahkan

6. Setelah itu paste atau masukkan kode yang tadi tepat diatas kode </head>, jika sudah klik Simpan template.. Selesai

7. Berikut adalah contoh hasil kursor blog yang berhasil diubah

8. Pada situs www.cursors-4u.com tersebut memiliki banyak kumpulan berbagai macam gambar kursor serta ada yang bergerak / animasi, namun jika sobat ingin membuat kursor dengan gambar sendiri juga bisa yaitu dengan mengganti kode yang berwarna merah pada script kode dibawah ini dengan url gambar kursor sobat dan masukkan tepat diatas kode </head> lalu klik Simpan template.. Selesai

<style type='text/css'>HTML,BODY{cursor: url("URL GAMBAR"), auto;}</style>

Nah itulah bagaimana mengganti cursor mouse di blog dengan mudah dan cepat.

Silahkan dicoba Eco Racing 2:20 AM New Google SEO Bandung, Indonesia