Terbaru=>>
Loading...

Cara Memasang Widget Pencarian CariSalafy di Blog

Bismillah,,, bagi antum yang mempunyai blog dan ingin untuk memasang widget Google Custom Search Engine (CSE) yang mengambil dari situs-situs salaf, bisa mengikuti tutorial di bawah ini. Widget ini diberi nama CariSalafy. Mengambil dari 73 situs salaf.

cara membuat pencarian google


Jika antum merasa ada situs salaf buatan ikhwah yang amanah dan dirasa layak untuk dimasukkan, faddol antum tuliskan di komentar. Mungkin nanti bisa di update list situs berikut;

  • www.abukarimahaskari.com
  • www.ahlussunnahkendari.com
  • www.ahlussunnahkarawang.com
  • www.ahlussunnahkolaka.blogspot.com
  • www.ahlussunnahriau.net
  • www.ahlussunnahslipi.com
  • www.albayyinah.or.id
  • www.alfawaaid.net
  • www.almanshuroh.net
  • www.almanshurohcilacap.com
  • www.almuwahhidiin.com
  • www.alilmumadura.wordpress.com
  • www.alifta.net/Fatawa/FatawaChapters.aspx?languagename=id
  • www.alifta.net/Fatawa/DisplayIndexes.aspx?languagename=id&section=3
  • www.alifta.net/Fatawa/IndexHits.aspx?languagename=id
  • www.alifta.net/Fatawa/DisplayIndexAlpha.aspx?languagename=id
  • www.alifta.net/Search/ResultDetails.aspx?languagename=id
  • www.alifta.net/Search/Result.aspx?languagename=id
  • www.alifta.net/default.aspx?languagename=id
  • www.anwarussunnahpth.blogspot.com
  • www.arrisalah.or.id
  • www.assalafy.net
  • www.asysyariah.com
  • www.attauhid-babakan.com
  • www.atsarussalaf.wordpress.com
  • www.bismillah.us
  • www.buletin-alilmu.net
  • www.daarulhaditssumbar.or.id
  • www.darulilmi.info
  • www.darussalaf.or.id
  • www.daarulihsan.com
  • www.forumsalafy.net
  • www.forumdakwahahlussunnah.com
  • www.ibnutaimiyah.org
  • www.ilmusyari.com
  • www.islammujur.com
  • www.ittibaus-sunnah.net
  • www.kajian.sunnah.web.id
  • www.kajianbanjar.info
  • www.mahad-alfaruq.com
  • www.mahad-annur.com
  • www.mahad-assalafy.com
  • www.mahadsyariah.blogspot.com
  • www.miratsul-anbiya.net
  • www.manhajul-anbiya.net
  • www.postinganwhatsapp.blogspot.com
  • www.qonitah.com
  • www.radiorasyid.com
  • www.radioislam.or.id
  • www.radiosalafysamarinda.com
  • www.salafy.or.id
  • www.salafybandung.com
  • www.salafybulukumba.com
  • www.salafybpp.com
  • www.salafycileungsi.info
  • www.salafycirebon.com
  • www.salafydepok.net
  • www.salafykudus.com
  • www.salafymajalengka.com
  • www.salafymakassar.net
  • www.salafymalangraya.blogspot.com
  • www.salafymagelang.com
  • www.salafysemarang.com
  • www.salafysiar.com
  • www.salafysorowako.com
  • www.serambidarussunnah.com
  • www.sunnah.web.id
  • www.suaratauhidambon.com
  • www.tanyajawab.asysyariah.com
  • www.tashfiyah.net
  • www.tauhiddansyirik.wordpress.com
  • www.thalabilmusyari.web.id
  • www.tukpencarialhaq.com
  • Total = 73 Situs

Cara Memasang Widget CariSalafy di Blog

Buka www.blogger.com
Lalu klik tombol yang ada di sebelah kiri tombol "Lihat Blog"
cara membuat pencarian google

Lalu klik "Template"

Kemudian klik "Edit HTML"
memasang google custom search

Setelah terbuka halaman Edit Html maka silahkan klik sembarang di dalam kotak tersebut, lalu tekan di keyboard komputer antum, tombol Ctrl dan huruf F secara bersamaan

Kemudian tulis ini  ]]></b:skin> didalamnya dan tekan Enter



Lalu Copy kode di bawah ini
#search-form {
 background: #e1e1e1; /* Fallback color for non-css3 browsers */
 width: 300px;

 /* Gradients */
 background: -webkit-gradient( linear,left top, left bottom, color-stop(0, rgb(243,243,243)), color-stop(1, rgb(225,225,225)));
 background: -moz-linear-gradient( center top, rgb(243,243,243) 0%, rgb(225,225,225) 100%);

 /* Rounded Corners */
 border-radius: 17px;
 -webkit-border-radius: 17px;
 -moz-border-radius: 17px;

 /* Shadows */
 box-shadow: 1px 1px 2px rgba(0,0,0,.3), 0 0 2px rgba(0,0,0,.3);
 -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,.3), 0 0 2px rgba(0,0,0,.3);
 -moz-box-shadow: 1px 1px 2px rgba(0,0,0,.3), 0 0 2px rgba(0,0,0,.3);
}

/*** TEXT BOX ***/
input[type="text"]{
 background: #fafafa; /* Fallback color for non-css3 browsers */

 /* Gradients */
 background: -webkit-gradient( linear, left bottom, left top, color-stop(0, rgb(250,250,250)), color-stop(1, rgb(230,230,230)));
 background: -moz-linear-gradient( center top, rgb(250,250,250) 0%, rgb(230,230,230) 100%);

 border: 0;
 border-bottom: 1px solid #fff;
 border-right: 1px solid rgba(255,255,255,.8);
 font-size: 16px;
 margin: 4px;
 padding: 5px;
 width: 219px;

 /* Rounded Corners */
 border-radius: 17px;
 -webkit-border-radius: 17px;
 -moz-border-radius: 17px;

 /* Shadows */
 box-shadow: -1px -1px 2px rgba(0,0,0,.3), 0 0 1px rgba(0,0,0,.2);
 -webkit-box-shadow: -1px -1px 2px rgba(0,0,0,.3), 0 0 1px rgba(0,0,0,.2);
 -moz-box-shadow: -1px -1px 2px rgba(0,0,0,.3), 0 0 1px rgba(0,0,0,.2);
}

/*** USER IS FOCUSED ON TEXT BOX ***/
input[type="text"]:focus{
 outline: none;
 background: #fff; /* Fallback color for non-css3 browsers */

 /* Gradients */
 background: -webkit-gradient( linear, left bottom, left top, color-stop(0, rgb(255,255,255)), color-stop(1, rgb(235,235,235)));
 background: -moz-linear-gradient( center top, rgb(255,255,255) 0%, rgb(235,235,235) 100%);
}

/*** SEARCH BUTTON ***/
input[type="submit"]{
 background: #44921f;/* Fallback color for non-css3 browsers */

 /* Gradients */
 background: -webkit-gradient( linear, left top, left bottom, color-stop(0, rgb(79,188,32)), color-stop(0.15, rgb(73,157,34)), color-stop(0.88, rgb(62,135,28)), color-stop(1, rgb(49,114,21)));
 background: -moz-linear-gradient( center top, rgb(79,188,32) 0%, rgb(73,157,34) 15%, rgb(62,135,28) 88%, rgb(49,114,21) 100%);

 border: 0;
 color: #eee;
 cursor: pointer;
 float: right;
 font: 16px Arial, Helvetica, sans-serif;
 font-weight: bold;
 height: 30px;
 margin: 4px 4px 0;
 text-shadow: 0 -1px 0 rgba(0,0,0,.3);
 width: 54px;
 outline: none;

 /* Rounded Corners */
 border-radius: 30px;
 -webkit-border-radius: 30px;
 -moz-border-radius: 30px;

 /* Shadows */
 box-shadow: -1px -1px 1px rgba(255,255,255,.5), 1px 1px 0 rgba(0,0,0,.4);
 -moz-box-shadow: -1px -1px 1px rgba(255,255,255,.5), 1px 1px 0 rgba(0,0,0,.2);
 -webkit-box-shadow: -1px -1px 1px rgba(255,255,255,.5), 1px 1px 0 rgba(0,0,0,.4);
}
/*** SEARCH BUTTON HOVER ***/
input[type="submit"]:hover {
 background: #4ea923; /* Fallback color for non-css3 browsers */

 /* Gradients */
 background: -webkit-gradient( linear, left top, left bottom, color-stop(0, rgb(89,222,27)), color-stop(0.15, rgb(83,179,38)), color-stop(0.8, rgb(66,143,27)), color-stop(1, rgb(54,120,22)));
 background: -moz-linear-gradient( center top, rgb(89,222,27) 0%, rgb(83,179,38) 15%, rgb(66,143,27) 80%, rgb(54,120,22) 100%);
}
input[type="submit"]:active {
 background: #4ea923; /* Fallback color for non-css3 browsers */

 /* Gradients */
 background: -webkit-gradient( linear, left bottom, left top, color-stop(0, rgb(89,222,27)), color-stop(0.15, rgb(83,179,38)), color-stop(0.8, rgb(66,143,27)), color-stop(1, rgb(54,120,22)));
 background: -moz-linear-gradient( center bottom, rgb(89,222,27) 0%, rgb(83,179,38) 15%, rgb(66,143,27) 80%, rgb(54,120,22) 100%);
}


Dan Paste di atas  ]]></b:skin>  tadi, Lalu tekan tombol "Simpan Template"

Sekarang kita pasang widgetnya di tempat yang kita inginkan.
Silahkan tekan "Tata Letak" yang ada di sebelah kiri layar antum
tata letak blogspot

Tekan "Tambahkan Widget"

cara menambahkan widget di blogspot


Maka akan muncul jendela pop-up, kemudian scroll ke bawah hingga antum melihat "HTML?JavaScript" lalu tekan tulisan tersebut



Kemudian beri Judul WidgetCariSalafy dan masukkan kode dibawah ini kedalam kotak konten

<form id="search-form" id="002404860764311600584:yhsmhlr7bac" action="http://mahadalbayyinah.blogspot.com/p/carisalafy.html">
<input value="002404860764311600584" name="cx" type="hidden"/>
<input value="FORID:11" name="cof" type="hidden"/>
<input  id="q" name="q" size="70" type="text" />
<input name="sa" type="submit"  value="Cari" />
</form> Ingin pasang widget seperti ini? <b><a href="http://bit.ly/carisalafy">KLIK DISINI</a></b><br /><br />


Lalu klik "Simpan"


Alhamdulillah, in sya Allah sekarang widgetCarisalafy sudah terpasang di blog antum, jazakumullahukhoiron sudah mengikuti tutorialnya

1 komentar: Leave Your Comments

  1. syukron akh, izin memasangkannya di website dakwah sunnah ini http://www.pangandaranmengaji.com/

    BalasHapus

Pilih Name/URL untuk berkomentar, Cukup masukkan Nama tanpa memasukkan apa-apa di URL