Showing posts with label Tips and Trik. Show all posts
Showing posts with label Tips and Trik. Show all posts

Sunday, October 16, 2011

thumbnail

Mengatasi Pesan An error occurred while saving Ketika Posting Artikel

Posted by AKTUAL NEWS ONLINE  | No comments

An error occurred while saving
Blogspot menyediakan mode WYSIWYG untuk melakukan edit posting sebelum anda postingnya. Mode WYSIWYG ini memudahkan pengguna, dalam proses edit dan input text, karena apa yang diketik oleh user akan selalu sama dengan hasilnya setelah diposting ke blog. WYSIWYG adalah singkatan dari What You See What You Get. Jadi apa yang anda lakukan dan anda buat di mode ini, maka itulah yang akan tampil sebagai hasil akhirnya. Setiap menginput text di sini, maka setiap detik input yang anda masukkan akan otomatis tersimpan sebagai draft di blogspot. Gunanya apabila sewaktu-waktu terjadi eror, maka hasil text terakhir yang tersimpan tersebut dapat dimunculkan kembali melalui edit post pada blogspot anda. Pesan eror yang sering terjadi adalah An error occurred while saving


An error occurred while saving adalah pesan yang muncul ketika anda input text untuk posting dalam mode WYSIWYG yang ternyata di dalamnya mengandung code-code html atau javascript. Karena secara default, blogspot tidak bisa melakukan penyimpanan (saving) jika terdapat kode seperti itu. Maka muncullah pesan “An error occurred while saving“ . Dalam istilah webmaster parse html.

Bagaimana mengatasi pesan An error occurred while saving. Cara mengatasinya dengan melakukan unformated text anda. Seleksi semua text yang ada, atau tekan Ctrl+A kemudian anda tekan tombol remove formating. Sebelum anda melakukan ini, sebaiknya kode html yang ada anda hapus. Untuk memasukkan kode html pada blogspot, silahkan baca Memasukkan Code Html Ketika Posting Artikel Blogspot
Jika Anda suka dengan artikel Mengatasi Pesan An error occurred while saving Ketika Posting Artikel
Tolong share dengan yang lainnya. Bantu dan dukung bloggerafif juga
untuk ikut kontes seo dengan share artikel Pulauweb Web Hosting Murah Indonesia dan Bejubel Market Place Terbaik Indonesia
silahakan anda coba dan perhatikan hasilnya.... 
Read More»

thumbnail

Cara Mengatasi Pasang Javascript Error

Posted by AKTUAL NEWS ONLINE  | No comments

Pasang javascript memang gampang-gampang susah,mudah-mudahan dengan sedikit berbekal trik untuk dapat mempermudah pemasangan Javascript. Dengan begitu kesal mangkel dan jengkel kalau pemsangan javascript ada yang error dan kita kurang teliti hanya kurang koma atas aja jadi gak bisa save dan gak jalan programnya.
Yah … emang begitu kasus yang sering kita alami dengan javascript. Kalau kebetulan kode javascriptnya cocok di blog, wus …. langsung bisa jalan tanpa perlu coba-sini coba-sana, semua bagai kentut tanpa dihalangi. Pasang javascript memang nggak banyak kendala bila dilakukan terhadap javascript yang sebelumnya telah diupload. Begitu juga pemasangan javascript melalui penambahan widget. Hampir bisa dikatakan 100% tak akan menemui kendala sama sekali. Permasalahan yang muncul biasanya hanya terjadi pada masalah ke-kompatibelan javascript tersebut terhadap browser atau blog yang kita kelola.
Permasalahan pemasangan javascript yang akan kita bicarakan di sini adalah ketika sebuah javascript akan kita pasang di antara tag <body> dan </body> atau di antara tag <head> dan </head> di dalam template (nggak lewat penambahan widget). Beberapa javascript sama sekali tak dapat disimpan dengan pernyataan penolakan yang disampaikan blogger karena berbagai alasan. Bagaimana cara mengatasi masalah seperti ini? Ada satu cara termudah yang dapat kita lakukan untuk menetralisir penolakan blogger tersebut. Tambahkan seikit kode baru seperti di bawah ini, maka dengan penambahan  javascript akan membawa perubahan dan menyatu dengan template dan blog sampeyan.
Cara Mengatasi Pemasangan Javascript yang Bandel di Template Blog

Di bawah ini adalah contoh bentuk kode javascript yang akan di pasang di blog :
<script type="text/javascript">
if(
this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') {
this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';
this.innerText = '';
this.value = 'Close !;
}
else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = '';
this.value = 'Please ..., Open!';
}
</script>
Jadikan bentuk javascript menjadi seperti ini :
<script type="text/javascript">
//<![CDATA[

Di sini Javascript di tuliskan!

//]]>
</script>
Sehingga apabila diterapkan pada javascript di atas bentuknya menjadi seperti di bawah ini :
<script type="text/javascript">
//<![CDATA[
if(
this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') {
this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';
this.innerText = '';
this.value = 'Close !;
}
else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = '';
this.value = 'Please ..., Open!';
}
//]]>
</script>
Yap … hanya seperti itu saja! nggak ada lagi yang lain. Tapi mengapa bisa jadi bisa di simpan, ya?
senoga ada manfaatnya bagi para blogger...!!!
semoga dengan penuh kesabaran... pasti akan lancar..
Read More»

Friday, October 14, 2011

thumbnail

Membuat Gambar di Pojokan Blog

Posted by AKTUAL NEWS ONLINE  | No comments

Kali ini saya akan mengajarkan caranya membuat gambar di pojokan seperti punya saya untuk
gambar pojokan di 3 sudut sekaligus ya....antara lain kanan bawah,kiri bawah,dan kiri atas.


Sebelum kode ]]></b:skin>
kita masukan script di atas dalam tiga formasi,contohnya di bawah ini :
#gambar_pojokan {
position:fixed;_position:absolute;bottom:0px; left:0px; (gambar kiri bawah)
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
#gambar_pojokan1 {
position:fixed;_position:absolute;bottom:0px; right:0px; (gambar kanan bawah)
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
#gambar_pojokan2 {
position:fixed;_position:absolute;top:0px; left:0px; (gambar kiri atas)
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
lalu cari kode </body> pastekan kode berikut di atas kode tersebut :
<div id="gambar_pojokan">  <--- link gambar simpan disini
<a href="url blog kamu/">        <--- nama blog anda disini
<img src="url gambar 1" border="0" /></a> (kiri bawah)
</div>
<div id="gambar_pojokan1">
<a href="url blog kamu/">
<img src="url gambar 2" border="0" /></a> (kanan bawah)
</div>
<div id="gambar_pojokan2">
<a href="url blog kamu/">
<img src="url gambar 3" border="0" /></a> (kiri atas)
</div>

(Tulisan yang merah ga usah di copy cz itu cuma keterangan)
klik pratinjau atau langsung saved bila udah.
untuk lebih pastinya anda di tunggu komentarnya... 
selamat berkarya..
Read More»

Wednesday, September 21, 2011

thumbnail

Cara Membuat Hover Gambar di Blog

Posted by AKTUAL NEWS ONLINE  | No comments

cara membuat image hover tambah detail atau keterangan ketika disorot mouse, sebelumnya saya telah mempraktekannya dan  membuat sebuah Galeri Foto dengan menggunakan javascript dan css tetapi ada sedikit masalah dan tidak jadi saya sharing. Dalam tutorial ini hanya menggunakan sedikit kode css saja,


Caranya:
Seperti biasa untuk penempatan kode css diatas kode ]]></b:skin>  letakan kode css dibawah ini diatasnya

/*Kolom Image*/
ul.columns {
    width: 960px;
    list-style: none;
    margin: 0 auto; padding: 0;
}
ul.columns li {
    width: 220px;
    float: left; display: inline;
    margin: 10px; padding: 0;
    position: relative;
}
ul.columns li:hover {z-index: 99;}
/*Thumbail Styles*/
ul.columns li img {
    position: relative;
    filter: alpha(opacity=30);
    opacity: 0.3;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; /*SpesIE*/
}
ul.columns li:hover img{
    z-index: 999;
    filter: alpha(opacity=100);
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
/*Hover Size*/
ul.columns li .info {
    position: absolute;
    left: -10px; top: -10px;
    padding: 210px 10px 20px;
    width: 220px;
    display: none;
    background: #ff0000;
    font-size: 1.2em;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
ul.columns li:hover .info {display: block;}

ul.columns li h2 {
    font-size: 1.2em;
    font-weight: normal;
    text-transform: uppercase;
    margin: 0; padding: 10px 0;
}
ul.columns li p {padding: 0; margin: 0; font-size: 0.9em;}


Untuk pemanggilan efeknya memerlukan satu kode lagi, yaitu kode dibawah ini bisa anda letakan dipostingan Edit HTML bukan compose atau di Edit Element add gadget html/javascript. Dan untuk memperbanyak lagi foto anda cukup kopi paste kode dibawah ini dibawahnya lagi.

<ul class="columns">
    <li>
        <a href="link blog/postingan"><img src="URL Gambar" alt="Nama Gambar/Foto" /></a>
        <div class="info">
            <h2>Title</h2>
            <p>Deskripsikan Detail Foto/image Anda</p>
        </div>
    </li>
</ul>

Jika anda tidak ingin memakai link ketika di klik gambar maka hapus kode yang berwarna merah, dan jika anda ingin merubah ukuran kolom dan ukuran gambarnya anda bisa rubah kode yang berwarna biru. Untuk mengganti warna background ketika disorot mouse anda bisa rubah kodewarna yang berwarna hijau.
Semoga sahabat bloger bisa lebih baik lagi .....
Read More»

    If you would like to receive our RSS updates via email, simply enter your email address below click subscribe.

© 2013 ZAIDANS Techno. WP Theme-junkie converted by Bloggertheme9 Published..Blogger Templates
Blogger template. Proudly Powered by Blogger.
back to top