Cara Lain Memperbaiki URL Blog Blogger

Pada kesempatan kali ini, akan membahas tentang "bagi mana caranya memperbaiki URL blog Blogger?" Alasannya mengapa? Karena, setiap kali kita membuat posting baru suka lupa atau kurang lengkap mengetik judul pada posting baru tersebut. Kiat untuk mengatasi masalah URL yang akan dirubah, karena saya telah mengalami masalah seperti ini. Saya sudah berusaha memperbaiki URL ketika dipublikasikan yaitu dengan cara rekaulangdan  rerubah judul posting, tetap tidak berubah, seperti contoh URL postingan dari (http://http://gadgetbloganda.blogspot.com/2012/07/cara-memuat-silde-image-javascript.html) yang diinginkan adalah salah, seharusnya yang muncul  seperti ini (http://gadgetbloganda.blogspot.com/2012/07/cara-membuat-silde-image-javascript.html) selintas bila dilihat memang hampir sama, namun beda arti. Untuk mengatasi masalah ini menurut cara yang saya pakai adalah, klik edit atau gambar pensil pada halaman blog, untuk mempebaiki URL yang salah. Lalu pada halaman pengedintan tersbut, untuk melakukan hal tersebut, cara terbaik jika konten blog dilengkapi gambar, maka sebelum klik Edit HTML (gambar bawah)

Setelah diklik dalam posisi Edit HTML lalu Cut seluruh isi konten dalam bentuk code HTML. Sakarang Anda lihat ke pojok kiri bagian atas cari New Post pada halaman Edit post, tunggu sesaat muncul halaman baru untuk posting. Bila sudah muncul, jangan lupa ketik kembali  judul postingan dan periksa ajaan agar tidak ada lagi kesalahan! Lalu beralih ke halaman konten, Harap diingat! Sewaktu mengambil atau Cut tadi dalam posisi Edit HTML, jadi pada halaman ini yaitu untuk meyimpan atau paste posisinya sama,  agar tidak ada kekeliruan ketika dipublikasikan. Paste teks konten code HTML , Klik PUBLISH POST . Selesai lihat hasilnya.

Tips ini semoga bermanfaat Anda,,,,,,,,Terima kasih

Cara Membuat Silde Image Java/Script

Cara mudah untuk membuat gambat hidup dan begser ke atas secara otomatis, seperti contoh gambar di bawah ini. Jika Anda ingin menerapkan atau membuat gambar bergeser secara otomatis tersebut.

• 
• 
• 
• 
• 
• 
• 
• 

Berapapun banyaknya gambar yang ingin Anda muat pada gadget ini, semuanya akan tertampung. Langkah pertama, Anda harus masuk ke blog untuk mengedit code HTML:

Membuat Menu Drop Down Serbaguna Blogger

Selamat jumpa kembali, kali ini saya akan mencoba menampilkan artikel tentang "Menu Drop Down Serbaguna" untuk blog Blogger, yang dimaksud serbaguna ini adalah, pada menu Drop Down tersebut Anda bisa menyimpan potongan teks posting berikut gambar dari judul posting dan lagi dapat menyisipkan link untuk kelanjutannya (readmore) contohnya di bawah:

Bagian pertama:

Gadget menu drop down serbaguna seperti pada gambar atas, ini sangat reflek dan sensitif sekali apabila tersentuh cursor, dengan spontan menjulur ke bawah, memperlihatkan isi menu yang disimpan di gadget. 

Bagian ke dua:

Anda pun dapat membuat daftar link seperti halnya pada menu drop down navigasi lainnya, hanya saja pada menu ini mampu memuat dari apa yang kita inginkan, lihat gambar bawah adalah satu wadah dapat memuat semuanya.

Lihat gambar atas adalah contoh link yang berada pada masing - masing kotak ketika cursor menyentuh akan berubah warna latar belakang link dalam kotak tersebut. Dan masih mampu menyimpan beberapa potongan teks dari postingan dan link nya plus gambar.

Cara menerapkannya pun sangat sederhana sekali Anda cukup menambahkan gadget baru untuk blog Anda, adapun code HTML /JavaScript seperti di bawah:

COPY CODENYA

<div id="menu">

<li><a href="#" class="drop"><p class="strong">JUDUL BLOG</p></a><!-- Begin Home Item -->
    <div class="dropdown_2columns"><!-- Begin 2 columns container -->
    <div class="col_2">
    <h2>Selamat Datang di Blog Kami</h2>
         <div class="col_2">

<p>TEKS AREA POTONGAN ARTIKEL 1</p>            
    <p>TEKS AREA POTONGAN ARTIKEL 2 <a href="http:"#">JUDUL UNTUK LINK</a></p>            
    </div>
    <div class="col_2">
    <h2>Berikutnya</h2>
    </div>
    <div class="col_1">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvYjWDnPyH58Y46rJy9abqpWD-HswJafpeZqGEzfKo5L4swqpLWoz6uCyxTrRG2pylXObvAMxdgdHRpKLKDzM7mRDKKfzyolQGOyuEqHZLtFjNvVOwcUevEo7nPDw4snaimUn1Jv8smhWT/s1600/DSC_0100.JPG" width="250" height="90" alt="" />
    </div>
    <div class="col_2">
    <p>TEKS AREA POTONGAN ARTIKEL 3 <a href="http://gadgetbloganda.blogspot.com/">baca halaman selanjutnya</a></p>
    </div>
    </div><!-- End 2 columns container -->
    </div></li></div><!-- End Home Item --> 

<style type="text/css">
    body, ul, li {
     font-size:14px;
     font-family:Arial, verdana, sans-serif;
     line-height:21px;
     text-align:left;
    }
     
    /* Navigation Bar */
     
    #menu {
     list-style:none;
     width:100px;
     margin:37px auto 0px auto;
     height:40px;
     padding:0px 10px 0px 10px;
     
     /* Rounded Corners */
     
     -moz-border-radius: 8px;
     -webkit-border-radius: 8px;
     border-radius: 8px;
     
     /* Background color and gradients */
     
     background: BLACK;
 background: -moz-linear-gradient(top, BLACK, #444444);
 background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(BLACK), to(#444444));
 
 /* Borders */
 
 border: 1px solid black;
 
 -moz-box-shadow:inset 0px 0px 1px yellow;
 -webkit-box-shadow:inset 0px 0px 1px yellow;
 box-shadow:inset 0px 0px 1px BLACK;
}
 
#menu li {
 float:left;
 text-align:center;
 position:relative;
 padding: 4px 10px 4px 10px;
 margin-right:30px;
 margin-top:7px;
 border:none;
}
 
#menu li:hover {
 border: 1px solid yellow;
 padding: 4px 9px 4px 9px;
 
 /* Background color and gradients */
 
 background: #848484;
 background: -moz-linear-gradient(top, #444444, #444444);
 background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#444444), to(#444444));
 
 /* Rounded corners */
 
 -moz-border-radius: 5px 5px 0px 0px;
 -webkit-border-radius: 5px 5px 0px 0px;
 border-radius: 5px 5px 0px 0px;
}
 
#menu li a {
 font-family:Arial, verdana, sans-serif;
 font-size:23px;
 color: BLUE;
 display:block;
 outline:0;
 text-decoration:none;
 text-shadow: 1px 1px 1px 0;
}
 
#menu li:hover a {
 color:#8cbb02;
 text-shadow: 1px 1px 1px transparent;
}
#menu li .drop {
 padding-right:21px;
 background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFo-3XVQtyq9vThEu3QCTf-OTMxLVW2WDeWkvmd6FIEpYEWwQO7iULDsAAYxXIf3S8rw0b8e9Ekb60YWLhXeBkUFmb_mowL6q3ebC7Ec7bN86pHCThISyxzcpT_HpDINIWfLRtof5hkMgo/s1600/drop.png") no-repeat right 8px;
}
#menu li:hover .drop {
 background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFo-3XVQtyq9vThEu3QCTf-OTMxLVW2WDeWkvmd6FIEpYEWwQO7iULDsAAYxXIf3S8rw0b8e9Ekb60YWLhXeBkUFmb_mowL6q3ebC7Ec7bN86pHCThISyxzcpT_HpDINIWfLRtof5hkMgo/s1600/drop.png") no-repeat right 7px;
}
 
/* Drop Down */
 
.dropdown_1column,
.dropdown_2columns,
.dropdown_3columns,
.dropdown_4columns,
.dropdown_5columns {
 margin:4px auto;
 float:left;
 position:absolute !important;
 left:-999em; /* Hides the drop down */
 text-align:left;
 padding:10px 5px 10px 5px;
 border:1px solid yellow;
 border-top:none;
 
 /* Gradient background */
 background:#444444;
 background: -moz-linear-gradient(top, #444444, #000000);
 background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#444444), to(#000000));
 
 /* Rounded Corners */
 -moz-border-radius: 0px 5px 5px 5px;
 -webkit-border-radius: 0px 5px 5px 5px;
 border-radius: 0px 5px 5px 5px;
}
 
.dropdown_1column {width: 140px;}
.dropdown_2columns {width: 280px;}
.dropdown_3columns {width: 420px;}
.dropdown_4columns {width: 560px;}
.dropdown_5columns {width: 700px;}
 
#menu li:hover .dropdown_1column,
#menu li:hover .dropdown_2columns,
#menu li:hover .dropdown_3columns,
#menu li:hover .dropdown_4columns,
#menu li:hover .dropdown_5columns {
 left:-1px ;
z-index:444 !important;
    top:auto;
}
 
/* Columns */
 
.col_1,
.col_2,
.col_3,
.col_4,
.col_5 {
 display:inline;
 float: left;
 position: relative;
 margin-left: 5px;
 margin-right: 5px;
}
.col_1 {width:130px;}
.col_2 {width:270px;}
.col_3 {width:410px;}
.col_4 {width:550px;}
.col_5 {width:690px;}
     
    /* Right alignment */
     
    #menu .menu_right {
     float:right !important;
     margin-right:0px;
    }
    #menu li .align_right {
    /* Rounded Corners */
    -moz-border-radius: 5px 0px 5px 5px;
    -webkit-border-radius: 5px 0px 5px 5px;
    border-radius: 5px 0px 5px 5px;
    }
    #menu li:hover .align_right {
    left:aut;
    right:-1px;
    top:auto;
    }
     
    /* Drop Down Content Stylings */
     
    #menu p, #menu h2, #menu h3, #menu div li {
    font-family:Arial, verdana, sans-serif;
    line-height:21px;
    font-size:12px;
    text-align:left;
    text-shadow: 1px 1px 1px transparent;
    }
    #menu h2 {
    font-size:21px;
    font-weight:400;
    letter-spacing:-1px;
 margin:7px 0 14px0;
 paddingbottom:14px;
 border-bottom:1px solid yellow;
}
    #menu h3 {
     font-size:14px;
     margin:7px 0 14px 0;
     padding-bottom:7px;
     border-bottom:1px solid yellow;
    }
    #menu p {
    line-height:18px;
     margin:0 0 10px 0;
    }
     
    #menu li:hover div a {
font-size:12px;
color:#015b86;
    }
    #menu li:hover div a:hover {
     color:#029feb;
    }
    .strong {
     font-weight:bold;
    }
    .italic {
     font-style:italic;
    }
    .imgshadow {
     background:transparent;
     padding:4px;
     border:1px solid yellow;
     margin-top:5px;
     -moz-box-shadow:0px 0px 5px yellow;
     -webkit-box-shadow:0px 0px 5px yellow;
     box-shadow:0px 0px 5px yellow;
    }
    .img_left { /* Image sticks to the left */
     width:auto;
     float:left;
     margin:5px 15px 5px 5px;
    }
    #menu li .black_box {
     background-color:#333333;
     color: #eeeeee;
     text-shadow: 1px 1px 1px 0;
     padding:4px 6px 4px 6px;
     
     /* Rounded Corners */
     -moz-border-radius: 5px;
     -webkit-border-radius: 5px;
     border-radius: 5px;
     
     /* Shadow */
     -webkit-box-shadow:inset 0 0 3px transparent;
     -moz-box-shadow:inset 0 0 3px transparent;
     box-shadow:inset 0 0 3px transparent;
    }
    #menu li ul {
     list-style:none;
     padding:0;
     margin:0 0 12px 0;
    }
    #menu li ul li {
     font-size:12px;
     line-height:24px;
     position:relative;
     text-shadow: 1px 1px 1px transparent;
     padding:0;
     margin:0;
     float:none;
     text-align:left;
     width:130px;
    }
    #menu li ul li:hover {
     background:none;
     border:none;
     padding:0;
     margin:0;
    }
    #menu li .greenbox li {
     background:#797079;
     border:1px solid yellow;
     margin:0px 0px 4px 0px;
     padding:4px 6px 4px 6px;
     width:116px;
     
     /* Rounded Corners */
     -moz-border-radius: 5px;
     -webkit-border-radius: 5px;
     border-radius: 5px;
    }
    #menu li .greenbox li:hover {
     background:#f6f627;
     border:1px solid yellow;
     padding:4px 6px 4px 6px;
     margin:0px 0px 4px 0px;
    }
     
    .tabs-inner .widget li a {
    padding: 1px ;
    display:block !important;
    border: 1px solid  transparent !important ;
    }
     
</style></div>

Catatan: 

Yang berwarna merah, seperti "JUDUL BLOG" , "JUDUL UNTUK LINK" , " URL IMAGE_ANDA_JPG"ganti dengan  punya Anda.

Sedangkan teks yang berwarna hijau, seperti: > TEKS AREA POTONGAN ARTIKEL 1<, 3 dan 3.ganti pula dengan  punya Anda.

Lihat demo pada Link Teks pada Sidebar/Gadget " HOME "

Cara Membuat Teks Pelangi (Rainbow)

Ok! kali ini Saya akan memberikan artikel tentang, bagaimana caranya membuat teks pelangi, untuk tampilan blog Anda. Jika tertaik  mari kita simak bersama. Disamping mempercantik blog Anda, juga penampilan dan sebagainya. Ok! langsung ke TKP, Anda perlu masuk masuk ke Blogger teruskan pada Dashboard, untuk membuat rancangan,untuk, sebuah posting atau sebagai gadget. Perlu diperhatikan! Bahwa teks pelangi ini tidak bisa dibuat dua dalam postingan atau untuk gadget blog Anda sekaligus, dalam artian, misalnya: Anda ingin menampilkan  pada posting baru dan satunya lagi untuk gadget, walaupun dengan teks berbeda tetap tidak akan berfungsi, terkadang yang satu berfungsi dan satunya lagi tidak, mungkin juga mengkibatkan macet.

Sekarang beralih ke code HTML/JavaScript lalu copy code-nya di bawah ini:

COPY CODENYA

<script>
/*
RAINBOW TEXT Script by Matt Hedgecoe (c) 2002
Featured on S66
For this script, visit http://.com
*/

// ********** MAKE YOUR CHANGES HERE

var text="Teks Anda di sini" // YOUR TEXT
var speed=80 // SPEED OF FADE

// ********** LEAVE THE NEXT BIT ALONE!


if (document.all||document.getElementById){
document.write('<span id="highlight">' + text + '</span>')
var storetext=document.getElementById? document.getElementById("highlight") : document.all.highlight
}
else
document.write(text)
var hex=new Array("00","14","28","3C","50","64","78","8C","A0","B4","C8","DC","F0")
var r=1
var g=1
var b=1
var seq=1
function changetext(){
rainbow="#"+hex[r]+hex[g]+hex[b]
storetext.style.color=rainbow
}
function change(){
if (seq==6){
b--
if (b==0)
seq=1
}
if (seq==5){
r++
if (r==12)
seq=6
}
if (seq==4){
g--
if (g==0)
seq=5
}
if (seq==3){
b++
if (b==12)
seq=4
}
if (seq==2){
r--
if (r==0)
seq=3
}
if (seq==1){
g++
if (g==12)
seq=2
}
changetext()
}
function starteffect(){
if (document.all||document.getElementById)
flash=setInterval("change()",speed)
}
starteffect()
</script>

Catatan:  "Teks yang berwarna merah", ganti dengan teks Anda.


Paste code HTML/JavaScript pada Add a Gadget di Dashboard Blogspot Anda seperti (gambar bawah):

Pilih dan klik HTML/JavaScript (gambar bawah):

Lalu masukkan / paste code tadi (gambar bawah):

Lanjutan melihat hasilnya, Klik Save.

Selesai..... Lihat posting Anda.................Selemat mencoba semoga berhasil dan bermanfaat,.terima kasih.

Baca juga tentang cara membuat teks efek neon

Cara Mengganti latar belakang (GeoCounter)

Pada umumnya bagi pengguna GeoCounter, hampir semuanya menggunakan dengan tampilan bawaan atau standar, mungkin  pengguna juga  beranggapan bahwa, untuk menautkan gambar pribadi pada latar belakang GeoCounter ini, harus membayar! Padahal tidak perlu membeli alias gratis. Hanya dengan memasukkan akun Anda agar dapat mengakses layanan tersebut, jika Anda belum pernah mendaftar sebelumnya, tapi sebaliknya, Anda pergi ke panel "Access your Admin" untuk login dan merubah latar belakang, contoh gambar di bawah:

Lalu masukkan sebagai nama Anda / username ketika mendaftar, jangan lupa ketik kata sandi, lihat gambar di bawah perhatikan no 1. dan no 2. Klik Go!

Selanjutnya Anda akan diarahkan ke halaman berikutnya, (gambar bawah)

Pilih salah satu Counter yang berada dalam kotak merah misalnya seperti punya saya yang dipilih atau terserah pilihan yang diinginkan oleh Anda, Setelah mengklik akan mengarah ke halaman lanjutan (gambar bawah):

Teruskan, belum selesai, tinggal beberapa langkah lagi. Sekaranga klik lagi peralatan "color configuration" untuk perubahan total (gambar bawah)

 Klik tepat pada gambar yang ditunjuk tanda panah, lihat (gambar atas) sebentar lagi akan segera selesai, terus lihat gamabr berikutnya (gambar bawah), adalah brosur pengambilan gambar dari File image komputer Anda.

Setelah selesai mengambil gambar akan terlihat seperti di bawah: Klik Close

Sekarang kita kembali lagi ke contoh gambar di atas "Color Configuration" atau arahkan cursor Anda pada salah satu gambar, nanti akan muncul teks bertuliskan "Merubah warna latar belakang GeoCounter" setelah itu centang tombol yang berada di sebelah kiri file waktu Anda mengambil gambar tadi (Background). Untuk mendapatka code HTML/JavaScript-nya, klik Submit, akan muncul di bawahnya setelah diklik (gambar bawah) Code HTML/JavaScript. Anda akan membuat sekarang? Dan perhatikan panduanya di sini.

Selesai......Sekarang lanjutkan untuk menambabah gadget baru, masuk ke Blogger Anda, klik Design, tambahkan Add a Gadget:

Pilih dan klik Add a Gadget (gambar bawah)

Masukkan atau paste code HTML/JavaScript di sini (gambar bawah) lalu klik tombol Save.

Selesai...... Lihat hasilnya, selamat mencoba semoga berhasil dan bermanfaat. Mohon tautakan komentarnya.......Terima kasih, sampai konten berikutnya.