Cara Menambahkan Kotak Script Cantik di Postingan

Cara Menambahkan Kotak Script Cantik di Postingan, berikut caranya :

1. Buka Entri Baru
2. Aktifkan mode HTML dengan cara klik tombol HTML yang terdapat disamping Compose
3. Copy script box code yang tersedia di bawah
4. Paste script box code diantara bagian yang diinginkan di tab HTML
5. Pilih kembali bagian tab Compose

5 Macam Versi Kotak Script / Box Code

1. Kotak Script Border Left

<div style="background-color: #f3f3f3; border-left: 5px solid #2288dd; padding: 10px; t-align: left;"> Tambahkan Script disini...</div>

2. Kotak Script Border Solid

<div style="background-color: #f3f3f3; border: 4px solid #999; padding: 10px; t-align: left;"> Tambahkan Script disini...</div>

3. Kotak Script Border Dashed

<div style="background-color: #ffe599; border: 2px dashed #aaa; padding: 10px; t-align: left;"> Tambahkan Script disini...</div>

4. Kotak Script Border Double

<div style="background-color: #6fa8dc; border: 4px double #fff; padding: 10px; t-align: left;"> Tambahkan Script disini...</div>

5. Kotak Script Border Outset

<div style="background-color: #a2c4c9; border: 4px outset #fff; padding: 10px; t-align: left;"> Tambahkan Script disini...</div>

6. Kotak Script Nice Box

<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: turquoise; border-left: 10px solid #4fee0f; border-radius: 10px; padding: 10px; t-align: left;"> Tambahkan script di sini...</div>

 7. Kotak Script Easy Looking box

<div style="-moz-border-box: 10px; -webkit-border-box: 10px; background-color: turquoise; border-top: 10px solid #4fee0f; border: 10px; padding: 10px; t-align: left;">Tambahkan script di sini...</div>

8. Kotak Script Minimalis Box

<div style="-moz-border-box: 10px; -moz-border-box: 10px; -webkit-border-box: 10px; background-color: white; border-top: 20px solid #f4034c; overflow: auto; padding: 10px; t-align: left; t-color: #fff;">
Tambahkan script di sini...</div>

9. Kotak Script Mistique

 <div style="-moz-border-box: 10px; -webkit-border-box: 10px; background-color: black; border-left: 10px solid red;  padding: 10px; t-align: left;">
<span style="color: white;"><span style="font-family: 'Trebuchet MS', sans-serif;">Tambahkan script di sini...</span></div>

10. Kotak Script Elegan box

<div style="-moz-border-box: 10px; -webkit-border-box: 10px; background-color: turquoise; border-left: 10px solid #4fee0f; border: 10px; padding: 10px; t-align: left;">Tambahkan script di sini...</div>

Script tersebut dapat kamu kreasikan sesuai dengan keinginan:
- Mengganti warna kotak: background-color:#kodewarna
- Merubah warna border: border:#kodewarna
- Mengatur ketebalan border: border:4x 

Read More

Cara membuat link Open New Tab

 Cara membuat link Open New Tab berikut Scripnya :

1. Klik "Layout" (Tata Letak)
2. Klik "Add Gadget"
3. Pilih "Javascript/HTML"
4. Copy dan Paste kode berikut ini:
5. save.

<a href="https://anangzaini.blogspot.co.id/" target="_blank">Entertainment</a>

Read More

Script Kode HTML Cara memasang menu di blog

 Script Kode HTML Cara memasang menu di blog berikut caranya :

1. Klik "Layout" (Tata Letak)
2. Klik "Add Gadget"
3. Pilih "Javascript/HTML"
4. Copy dan Paste kode berikut ini:
5. save.

<!--begin top menu--></pre>

<div id="topmenuCont" class="cleanfix">

<ul class="clearfix">

<li><a class="home"><span style="font-family: comic sans ms;">Home </span></a></li>

<li><a title=" Nama menu1" href = "Link menu1"><span style ="font-family: comic sans ms;"> Nama .menu1 </span></a></li>

'

<li><a title="Nama menu 2" href="Link menu2"><span style = "font-family: comic sans ms;"> Nama menu 2 </span></a></li>

<li><a title="Nama menu 3" href="Link menu3"><span style == "font-family: comic sans ms;"> Nama menu 3 </span></a></li>

</ul>

</div>

<pre>

<!-- end top menu-->

Read More

Script Kode HTML Membuat back to top ringan dan responsif

Berikut cara pasang Script Kode HTML Membuat back to top ringan dan responsif :

- Template > Edit HTML
- Cari kode berikut : </head>
 (gunakan Ctrl+F untuk mempermudah pencarian)
- COPY dan PASTE kode bootstrap font awesome berikut :

 <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet"></link

  tepat diatas  </head>  tadi.
- Save!


- Selanjutnya paste kode css berikut tepat diatas : ]]></b:skin> atau </style>

/* Back To Top */
#back-to-top{background:#E73037;color:#ffffff;padding:8px 10px;font-size:24px}
.back-to-top{position:fixed!important;position:absolute;bottom:20px;right:20px;z-index:999}

- Selanjutnya paste kode jquery berikut tepat diatas: </body>

<div class='back-to-top'><a href='#' id='back-to-top' title='back to top'>
<i class='fa fa-chevron-up'/>
</a></div>
<script>            
$(window).scroll(function() {
if($(this).scrollTop() &gt; 200) {
$(&#39;#back-to-top&#39;).fadeIn();
} else {
$(&#39;#back-to-top&#39;).fadeOut();
}
});

$(&#39;#back-to-top&#39;).hide().click(function() {
$(&#39;html, body&#39;).animate({scrollTop:0}, 1000);
return false;
});
</script>

- Simpan Template.

Read More

Script Kode HTML membuat tulisan efek seperti di ketik

Berikut cara pasang Script kode HTML membuat tulisan efek seperti di ketik :

 1. Klik "Layout" (Tata Letak)
2. Klik "Add Gadget"
3. Pilih "Javascript/HTML"
4. Copy dan Paste kode berikut ini:
5. save.


<script language="JavaScript">
var text="Cara membuat huruf berjalan dengan efek seperti diketik :)";
var delay=20;
var currentChar=1;
var destination="[none]";
function type()
{
//if (document.all)
{
var dest=document.getElementById(destination);
if (dest)// && dest.innerHTML)
{
dest.innerHTML=text.substr(0, currentChar)+"<blink>_</blink>";
currentChar++;
if (currentChar>text.length)
{
currentChar=1;
setTimeout("type()", 5000);
}
else
{
setTimeout("type()", delay);
}
}
}
}
function startTyping(textParam, delayParam, destinationParam)
{
text=textParam;
delay=delayParam;
currentChar=1;
destination=destinationParam;
type();
}
</script> <b><div 0px="" 12px="" arial="" color:="" ff0000="" font:="" id="textDestination" margin:="" style="background-color: none;"></div></b> <script language="JavaScript">
javascript:startTyping(text, 50, "textDestination");
</script>

Read More

Script Kode HTML jam online

Berikut cara memasang Script Kode HTML jam online :

- Template > Edit HTML
- cari kode berikut : ]]></b:skin>
  (gunakan Ctrl+F untuk mempermudah pencarian)
- Setelah anda temukan kode tersebut, letakkan diATASnya kode css berikut ini:

  
    .pelajaranblogareakeren {border: 1px solid #EFF0F1;
    padding: 5px;
    background: #ffffff;-moz-border-radius:5px;}

    .pelajaranblogareakeren a {background:none;}
    img.float-right {margin: 5px 0px 0 10px;}
    img.float-left {margin: 5px 10px 0 0px;}


Setelah itu simpan template anda.


Selanjutnya,
1. Klik "Layout" (Tata Letak)
2. Klik "Add Gadget"
3. Pilih "Javascript/HTML"
4. Copy dan Paste kode berikut dibawah ini:
5. save.



    <table style="border:0px" bgcolor="transparent"><tr><td> <div class='pelajaranblogareakeren'><div style='font-family:arial; color:#999999;font-size:12px;text-transform:none;'>

    <script type="text/javascript">

    window.setTimeout("jam()",1000);
    function jam() {
    var tanggal = new Date();
    setTimeout("jam()",1000);

    document.getElementById("mrpujiajadehclock").innerHTML=tanggal.getHours()+":"+tanggal.getMinutes()+":"+tanggal.getSeconds();
    }

    </script>

    <strong><div id="mrpujiajadehclock"></div></strong></div></div></td><td><div class='pelajaranblogareakeren'><div style='font-family:arial; color:#999999;font-size:12px;text-transform:none;'>
    <script type="text/javascript">

    var mydate=new Date()
    var year=mydate.getYear()
    if (year < 1000)
    year+=1900
    var day=mydate.getDay()
    var month=mydate.getMonth()
    var daym=mydate.getDate()
    if (daym<10)
    daym="0"+daym
    var dayarray=new

    Array("Minggu","Senin","Tuesday","Rabu","Kamis","Jumat","Sabtu")
    var montharray=new
    Array("January","Februari","Maret","April","Mei","Juni","Juli","Agustus","September","Oktober","November","Desember")
    document.write("<b>"+dayarray[day]+", "+daym+" "+montharray[month]+", "+year+"</b>")

    </script></div></div></td><td></td></tr></table>

Read More

Script Kode HTML macam-macam runing teks

 Berikut cara pasang Script Kode HTML macam-macam runing teks :

1. Klik "Layout" (Tata Letak)
2. Klik "Add Gadget"
3. Pilih "Javascript/HTML"
4. Copy dan Paste kode berikut ini:
5. save.


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 ke kanan dan kekiri
-------------------------------------------------------------------------------------
 <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>

Read More

Script Kode HTML Cara memposting kode HTML pada blog

Cara memposting Script Kode HTML pada blog.
berikut Cara Penggunaannya :

- Klik posting
- Klik entri baru
- Klik Mode "HTML"
- Copy & Paste kode dibawah ini di mode HTML :

<div style="border: 1px solid #ddd; padding: 10px; background-color: #f2f2f2; text-align: left;">
Kode Script Anda Di Sini
</div>

- Lalu selanjutnya Klik Mode "Compose"
- Dan selanjutnya  Masukkan kode HTML/JavaScript anda
- Terakhir PUBLIKASIKAN.

Read More

Script Kode HTML widget hari tanggal dan jam saat ini

Script Kode HTML untuk widget hari, tanggal, bulan, tahun dan jam saat ini,
susunan kode html nya adalah seperti dibawah ini :

1. Klik "Layout" (Tata Letak)
2. Klik "Add Gadget"
3. Pilih "Javascript/HTML"
4. Copy dan Paste kode berikut ini:
5. save.

<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN">
<font color="blue"><script type="text/javascript">
now = new Date();
if (now.getTimezoneOffset() == 0) (a=now.getTime() + ( 7 *60*60*1000))
else (a=now.getTime());
now.setTime(a);
var tahun= now.getFullYear ()
var hari= now.getDay ()
var bulan= now.getMonth ()
var tanggal= now.getDate ()
var hariarray=new Array("Minggu,","Senin,",
"Selasa,","Rabu,","Kamis,","Jum'at,","Sabtu,")
var bulanarray=new Array("Januari","Februari","Maret","April","Mei","Juni","Juli","Agustus","September","Oktober","Nopember","/ 12 /")
document.write(hariarray[hari]+" "+tanggal+" "+bulanarray[bulan]+" "+tahun)
</script>
<script type="text/javascript">
now = new Date();
if (now.getTimezoneOffset() == 0) (a=now.getTime() + ( 7 *60*60*1000))
else (a=now.getTime());
now.setTime(a);
document.write(" Jam " + ((now.getHours() < 10) ? "0" : "") + now.getHours() + ":" + ((now.getMinutes() < 10)? "0" : "") + now.getMinutes() + (" W.I.B "))
</script>
</font>
</!doctype>

Ganti yang berwarna "blue" dengan warna kesukaan anda.

Read More

Script Kode HTML membuat tombol pengganti warna background blog

Script Kode HTML membuat tombol pengganti warna background blog adalah seperti dibawah ini :

1. Klik "Layout" (Tata Letak)
2. Klik "Add Gadget"
3. Pilih "Javascript/HTML"
4. Copy dan Paste kode berikut ini:
5. save.

<script type='text/javascript'>
function bgChange(bg)
{document.body.style.background=bg;}
</script>
<table border="1" height="20" style="width: 180px;">
   <tr>
      <td onclick="bgChange('#ffffff')" bgcolor="#ffffff"></td>
      <td onclick="bgChange('#eeeeee')" bgcolor="#eeeeee"></td>
      <td onclick="bgChange('#cfe2f3')" bgcolor="#cfe2f3"></td>
      <td onclick="bgChange('#ebccda')" bgcolor="#ebccda"></td>
      <td onclick="bgChange('#b3f2b3')" bgcolor="#b3f2b3"></td>
      <td onclick="bgChange('#f4f45b')" bgcolor="#f4f45b"></td>
      <td onclick="bgChange('#ccccee')" bgcolor="#ccccee"></td>
      <td onclick="bgChange('#c2f0ac')" bgcolor="#c2f0ac"></td>
      <td onclick="bgChange('#f87ef8')" bgcolor="#f87ef8"></td>
      <td onclick="bgChange('#999999')" bgcolor="#999999"></td>
   </tr>
</table>

Read More