flas script


Cara Membuat Daftar Isi Blog Dengan Menggunakan JQuery


Bagaimana Cara Membuat Daftar Isi Blog Dengan Menggunakan JQuery. Daftar isi Merupakan salah satu fitur tambahan yang kita pasang di blog bertujuan untuk memudahkan pengunjung blog dalam mencari Artikel-artikel yang ada di blog kita. Selain itu, Daftar isi juga merupakan Penilaian tersendiri dari pengunjung blog terhadap pengaturan tata-letak artikel pada blog tersebut.

Daftar isi yang kali ini berbeda dengan daftar isi pada umumnya, kali ini saya akan share cara membuat daftar isi blog dengan JQuery, oke langsung saja :


1.Login Ke Akun Blog Sobat
2.Masuk Ke Template
3.Pilih Edit Html
4.Klik Lanjutkan
5.Centang Expandt Widget Templates
6.Cari Kode ]]></b:skin> , & letakkan kode berikut tepat diatas kode yang telah di cari :
/* Daftar Isi With JQuery */ #dafis-acc{ font-family:"Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#333; background:url(http://1.bp.blogspot.com/-Q0gQpqnpwdw/TggUQZh1y3I/AAAAAAAAANg/-9rHKcaz5JU/s320/bg5.gif) repeat-y scroll left center #E7F7FB; padding:2px 0; border:1px solid #339DC6; } .dafis-label{ background:url(http://2.bp.blogspot.com/-SlHI9wfcEy0/TggUQSS6hBI/AAAAAAAAANY/osNWdKWUfZQ/s1600/bg4.gif) repeat-x scroll 0 0 #E1F4FB; font-weight:bold; line-height:1.4em; overflow:hidden; white-space:nowrap; vertical-align: baseline; margin: 1px 3px; outline: none; cursor: pointer; text-decoration: none; padding: 2px 10px; color: #fff; text-shadow: 0 1px 1px rgba(0,0,0,.3); border:1px solid #2F94BA; } .dafis-label:hover{ background:url(http://3.bp.blogspot.com/-x7WFTrEvdnY/TggUQNCYIkI/AAAAAAAAANQ/i8ZH9H_K_bg/s320/bg2.gif) repeat-x scroll 0 0 #E1F4FB; color:#003366; } .dafis-daf ol{ margin:0 0 0 30px !important; padding:0 !important; } .dafis-daf ol li{ background-color:#C9E9F4; line-height:1.5em; margin:1px 3px !important; white-space:nowrap; text-align:left; border:1px solid #339DC6; } .dafis-daf ol li a{ text-decoration: none !important; color:#333 !important; display:block; padding-left:10px; } .dafis-daf ol li a:hover{ background: #7BC4DF; border-left: 5px #333 solid; padding-left: 5px; text-shadow: 0 1px 1px rgba(0,0,0,.3); }
7.Kemudian Cari kode </head> dan letakkan kode berikut tepat di atas kode yg di cari :
 <script src='http://dapurtutorial8.googlecode.com/files/Shttp://agungtalaga.blogspot.com/2012/05/cara-membuat-daftar-isi-blog-dengan.htmlcriptdaftarisi1.js' type='text/javascript'/>
8.Kemudian Save Template
9.Selanjutnya sobat masuk Ke TataLetak => Tambah Gadget => Html/JavaScript
10.Copy-Pastekan Kode Berikut  :
<script type="text/javascript" src="http://dapurtutorial9.googlecode.com/files/Scriptdaftarisi2.txt"></script> <script src="http://fungsi-media-internet.blogspot.com/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc"></script>
11.Save Gadget
12.Jika Sobat ingin Membuat Daftar Isi Dengan Scrool, Silahkan Coppas Script Berikut :

<div style="overflow:auto;width:350px;height:150px;padding:
10px;border:1px solid #C33F00">
<script type="text/javascript" 
src="http://dapurtutorial9.googlecode.com/files/Scriptdaftarisi2.txt">
</script>
 <script src="http://fungsi-media-internet.blogspot.com/feeds/posts/summary?
max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc">
</script></div>
13.Ganti Teks Yang Bewarna Merah Deng Url Blog Sobat.

Sampai di sini dulu, semoga bermanfaat...!!!

Tips Ngeblog :

Kembali ke Site Map / Daftar Isi di Blog Ini, Klik Di Sini !


Membuat Breadchumbs Agar Label Di Index Google


Bagaimana caranya Agar Label Dapat Di Index Google Search Engine. Membuat Navigasi Breadchumbs Untuk Sebuah Web/Blog Sangatlah Penting.
Breadcrumbs adalah link / tautan yang biasanya sering sobat temukan di atas sebuah judul artikel, bentuknya seperti Home, Kategori, Judul Artikel, dll
Penggunaan breadcrumbs bisa bermanfaat untuk:
1. memudahkan user atau pengunjung untuk menavigasi halaman situs
2. membuat search engine dapat menavigasi struktur halaman situs dengan lebih mudah

Berikut Tutorialnya :
1.Login Akun Blog Sobat
2.Masuk Ke Template
3.Klik Edit Html
4.Klik Lanjutkan
5.Centang Expandt Widget Template
6.Cari Kode ]]></b:skin> Dan Letakkan Kode Berikut Tepat Di atasa Kode ]]></b:skin> 
breadcrumbs {padding:5px 5px 5px 0px; margin: 0px 0px 15px 0px; font-size:85%; line-height: 1.4em; border-bottom:3px double #e6e4e3;}
7.Selanjutnya Sobat Cari Kode <b:includable id='main' var='top'>
8.Hapus Kode Tersebut Dag Ganti Dengan Kode Berikut :
<b:includable id='breadcrumb' var='posts'><b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> &#187; <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- breadcrumb for the post page -->
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs' xmlns:v='http://rdf.data-vocabulary.org/#'>
<span typeof='v:Breadcrumb'><a expr:href='data:blog.homepageUrl' property='v:title' rel='v:url'>Home</a></span>
<b:loop values='data:post.labels' var='label'>
&#187; <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span>
</b:loop>
&#187; <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> &#187; <span>Unlabelled</span> &#187; <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<!-- breadcrumb for the label archive page and search pages.. -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>Archives for <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == &quot;&quot;'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>All posts</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>Posts filed under <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
<b:includable id='main' var='top'>
<b:include data='posts' name='breadcrumb'/>  
9.Save Template

Oke Sobat, silahkan di coba...!!!

Tentang SEO :
Kembali ke Site Map / Daftar Isi di Blog Ini, Klik Di Sini !


Bagaimana membuat file terkoneksi ke database mysql dengan PHP

Database adalah salah satu bagian penting dalam membangun sebuah website yang kompleks dan dapat menyimpan berbagai jenis data. disini kita menggunakan database mysql.

kali ini saya akan sharing mengenai cara mengkoneksikan/menghubungkan antara database MySql dengan website yang akan kita bangun nantinya dengan menggunakan php. Kenapa harus menghubungkan Database dengan Website kita ?

pikirkan jika kita ingin membangun website besar yang kompleks dan dapat menyimpan berbagai jenis data, maka kita harus mempunyai database untuk menyimpan data-data tersebut yang disimpan dalam bentuk tabel-tabel.

Pertama anda harus membuat file dengan nama dbconfig.php ( anda bisa menggantinya dengan nama yang anda inginkan ), kemudian isi file tersebut dengan code berikut ini.

<?PHP
 $conn = mysql_connect("localhost","root","") or die(mysql_error());
 //Pilih database
 $selectDB = mysql_select_db("db_databaseku") or die(mysql_error());
 if (!$selectDB){
 echo "gagal terkoneksi";
 }
?>


Mari kita mulai membahas code di atas perbagian/baris fungsinya dari masing-masing bagian code tersebut..

 Baris 1
1 I  $conn = mysql_connect("localhost","root","") or die(mysql_error());

$conn = ini merupalan sebuah variabel untuk menyimpan nilai dari  mysql_connect(“localhost”,”root”,”") or die(mysql_error());

sebuah variabel dalam php di lambangkan dengan simbol $, jadi $conn ini dapat kita ganti dengan nama apa saja sesuai dengan keinginan kita tapi harus di awali dengan simbol $.
mysql_connect :  ini adalah fungsi untuk menghubungkan dengan Database.
“Localhost” : ini di isi dengan nama server kita, yaitu localhost.
“root” : isi dengan Username dari Database yang kita buat, jika anda menggunakan localhost defaultnya adalah root 
“” : isi bagian kosong ini dengan password dari Database anda, untuk hosting berbayar biasanya kita harus memasukkan password untuk setiap database yang kita buat, namun untuk localhost cukup di kosongkan saja.
or die(mysql_error()); : ini adalah fungsi alert jika koneksi ke database gagal atau ada kesalahan dalam pengisian nama server, username atau password.

Baris 2
2 I $selectDB = mysql_select_db("db_databaseku") or die(mysql_error());

$selectDB : ini tidak jauh beda dari $conn tadi jadi sebagai variabel yang menyimpan nilai dari 
mysql_select_db("db_databaseku") or die(mysql_error());
“db_databaseku” : isi dengan nama database yang telah di buat.

Baris 3 dan 4
3 I if (!$selectDB){
4 I  echo "gagal terkoneksi";

if (!$selectDB){ :  jadi disini kita memakai fungsi if,  jadi code tersebut bisa kita baca jika tidak $selectDB, jadi simbol “!” ini menyatakan “tidak/gagal” , jadi jika selectDB itu gagal maka akan masuk ke langkah berikutnya yaitu munculkan teks “Gagal Terkoneksi”. 

selamat anda sudah menyelesaikan file koneksi ke database anda, semoga bermanfaat...!!!

Tentang Website : 
Kembali ke Site Map / Daftar Isi di Blog Ini, Klik Di Sini !


Jquery - Kumpulan Link Plugins JQuery

Menurut situs resmi nya jquery adalah :

"JQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to change the way that you write JavaScript."

Intinya jquery digunakan untuk memanipulasi tampilan website kita menjadi lebih baik dan menarik dari sisi tampilannya. JQuery berisi sekumpulan syntax javascript dan terdapat konsep Ajax didalamnya.

Artikel ini merupakan kumpulan link website yang menyediakan plugins jQuery.

Form Validation
File upload
Form – Select Box stuff
Form Basics, Input Fields, Checkboxes etc.
Time, Date and Color Picker
Rating Plugins
Search Plugins
Inline Edit & Editors
Audio, Video, Flash, SVG, etc
Photos/Images/Galleries
Google Map
Games
Tables, Grids etc.
Charts, Presentation etc.
Border, Corners, Background
Text and Links
Tooltips
Menus, Navigations
Accordions, Slide and Toggle stuff
Drag and Drop
XML XSL JSON Feeds
Browserstuff
Alert, Prompt, Confirm Windows
CSS
DOM, Ajax and other jQuery plugins
Sekian artikel dari saya, semoga dapat bermanfaat untuk teman-teman dan anda semua.

Tentang Website :
Kembali ke Site Map / Daftar Isi di Blog Ini, Klik Di Sini !


Cara Mudah Membuat Foto Muncul di Search Engine Google

Cara Mudah Membuat Foto Muncul di Search Engine Google. Membuat Foto kita muncul di search engine miliknya mbah Google pasti menyenangkan ya? Tips ini sebenarnya sudah banyak yang posting dan ada beberapa cara, namun buat sobat yang belum tahu, pada postingan kali ini saya akan berbagi Cara bikin foto muncul di Search engine google dengan mudah dan ngga ribet tentunya heheee..

Langsung saja, silahkan bagi sobat yang ingin foto tampannya atau bagi sobat yang cantik ingin fotonya mejeng di search engine,berikut ini saya kasih cara yang mudah:
  1. Sobat harus sudah memiliki akun Google+ miliknya mbah Google 
  2. Pada profil google plus milik sobat bagian Kontributor,masukkan blog milik sobat. 
  3. Setelah blog sobat di masukkan pada bagian kontributor,buka dasbor blog milik sobat dan Klik Template-Edit HTML 
  4. Cari kode <head> dan bila sudah ketemu, masukkan kode dibawah ini tepat di bawahnya:

    <link href='https://plus.google.com/102321364607408613915' rel='author'/>

  5. Simpan dan selesai.
Catatan:
  • Ganti no. id 102321364607408613915 dengan nomer id google puls milik sobat. 
  • Untuk menguji keberhasilan cara ini, lakukan pengujian dengan alat penguji di Rich Snippets Testing Tool. Cara melakukan pengujiannya adalah copy salah satu link url milik blog sobat dan masukkan pada kotak yang sudah di sediakan 
  • Klik preview,bila sudah berhasil maka foto milik sobat akan kelihatan.
Ok sobat semua, itulah Cara membuat foto muncul di search engine google, semoga bermanfaat dan berhasil sobat praktekkan biar foto cakep milik sobat bisa mejeng di search engine.

Tips Ngeblog :

Kembali ke Site Map / Daftar Isi di Blog Ini, Klik Di Sini !

Diberdayakan oleh Blogger.
Twitter Delicious Facebook Digg Stumbleupon Favorites More