https://bl.id/kumpulink_io_art

Share button sederhana

  06:12:00    

      Selamat datang di sini,semoga kalian di beri kesehatan oleh yang maha kuasa,share button kalian mungkin sudah tak asing lagi di telinga para blogger,dan mungkin kali ini juga untuk para blogging sudah bosan melihat postingan tentang sahre button yang telah di postingan oleh beberapa blogger tersebut,Namun apa salahnya seoke.com pengen berbagi pengalamannya kepada para blogging pemula.
Share button mungkin cukup di butuhkan oleh para blogging di karenakan sahre button tersebut bisa membuat blog kita sedikit mudah jika kalian pengen baerbagi dengan yang lain.
kita cari tau youk code nya sperti apa.


  • kalian silahkan masuk dulu pada blog kalian
  • setelah masuk kalian silahkan pilih di mana saat penempatan code tersebut yang di inginkan,
  • semilalkan di bawah postingan atau pun di mana aja yang terlihat menarik saat di lihat oleh pengunjung 
  • kalian tinggal masuk pada TATA LETAK > pilih TAMBAHKAN WIDGET > HTML/JAVASCRIPT
  • Dan copy paste code di bawah ini :




dan hasilnya akan seperti ini

Cara Membuat Tombol Share Sosial di Blogger


mungkin bila kalian pengen tampilan share button seperti di bawah ini.
Cara Membuat Tombol Share Sosial di Blogger

silahkan tinggal copy paste code di bahwah ini,Caranya sama seprti cara yang di atas tadi 



Bila kalian butuh sahre button yang lain silahkan tulis di komentar pesannya .
seoke.com mengucapkan banyak berterima kasih kalian menyempatkan waktunya di postinga Share button sederhana.dan terima kasih untuk www.seocips.yang membantu saya membuat postingan seperti ini
Terima kasih

  

  No Comments

Demo button effek slide

  06:32:00    

   Butuh tombol DENGAN Yang unik, seoke.com akan postingkan mebuat demo tombol effek slide. Kalian langsung aja kecaranya oke

foto Dengan www.kellydennisvoice.com/
  •  Cari Kode </ style> tau cari Kode ]]> </ b: skin>
  • Masukan Kode Di Bawah ini Tepat di atas Kode di ANTARA dua yang kalian pilih 
#wrap {margin: 20px auto; text-align: center; }
#wrap br {display: none; }
.bie-slide, .bie-slide2 {position: relative; display: inline-block; height: 50px; width: 200px; line-height: 50px; padding: 0; border-radius: 50px; background: #fdfdfd; border: 2px solid # F9690E; margin: 10px; transisi: .5s; }
.bie-slide2 {border: 2px solid # 36D7B7; }
.bie-slide: hover {background-color: # F9690E; }
.bie-slide2: hover {background-color: # 36D7B7; }
.bie-slide: hover span.circle, .bie-slide2: hover span.circle2 {kiri: 100%; margin-left: -45px; background-color: #fdfdfd; color: # F9690E; }
.bie-slide2: hover span.circle2 {color: # 36D7B7; }
.bie-slide: hover span.title, .bie-slide2: hover span.title2 {left: 40px; opacity: 0; }
.bie-slide: hover span.title-hover, .bie-slide2: hover span.title-hover2 {opacity: 1; left: 40px; }
.bie-slide span.circle, .bie-slide2 span.circle2 {display: block; background-color: # F9690E; Warna: # fff; position: absolute; float: kiri; margin: 5px; line-height: 42px; height: 40px; width: 40px; top: 0; kiri: 0; transisi: .5s; border-radius: 50%; }
.bie-slide2 span.circle2 {background-color: # 36D7B7; }
.bie-slide span.title, .bie-slide span.title-hover, .bie-slide2 span.title2, .bie-slide2 span.title-hover2 {position: absolute; kiri: 90px; text-align: center; margin: 0 auto; font-size: 16px; font-weight: bold; color: # F9690E; transisi: .5s; }
.bie-slide2 span.title2, .bie-slide2 span.title-hover2 {color: # 36D7B7; kiri: 80px; }
.bie-slide span.title-hover, .bie-slide2 span.title-hover2 {kiri: 80px; opacity: 0; }
.bie-slide span.title-hover, .bie-slide2 span.title-hover2 {color: # fff; }

  • Kemudian cari Kode </ head> Dan letakan Kode di Bawah ini Tepat di atasnya 
<Link href = 'http: //netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' rel = 'stylesheet' />


  • Simpan Template tersebut, untuk review memanggilnya kita cukupdengan  mode HTML di postingan Dan silahkan Simpan Kode Di Bawah ini dengan yang kalian inginkan
<Div id = "membungkus">
<a class="bie-slide" href="http://seokecom.blogspot.com" target="_blank">
  <Span class = "lingkaran"> <i class = "fa fa-roket"> </ i> </ span>
  <Span class = "title"> Demo </ span>
  <Span class = "title-melayang"> Klik di sini </ span>
</a>
<a class="bie-slide2" href="http://seokecom.blogspot.com" target="_blank">
  <Span class = "CIRCLE2"> <i class = "fa fa Download"> </ i> </ span>
  <Span class = "title2"> Unduh </ span>
  <Span class = "title-hover2"> Klik di sini </ span>
</a>
</ Div>

Mudah Bukan tombol MEMBUAT Demo effek slide pada blog .
seoke.com mengucapkan Banyak terima kasih atas berkunjung di seoke.com JIKA Kalian Punya keritik dan Saran silahkan Tinggalkan pesanya di komentar Yang  telah di siapkan..





   /

  No Comments

Cara membuat permalink pada blog

  06:12:00    

   Ketemu lagi di blognya seoke.com yang selalu menyajikan kode kode untuk blog,buat yang membutuhkan.nah kali ini seoke.com sekarang share ini tentang Cara membuat permalink pada blog.
dan sebelum kita ke pembahannay,kalian harus tau dulu apa sich yangdi maksud dengan Permalink Ialah link permanen yang menuju halam dari sumber artikel berbeda.sangant optimal dalam membuat artikel link yang murni dari sebuah halaman,dan bisa membuat SEO home page dari suatu halaman yang akan membantu halam untuk bisa terindex oleh search berdasarkan KEYWORD yang diketikan.

foto By dribbble.com


untuk prosesnya kalian yang pasti harus masuk ter lebih dahulu pada blog kalian dan masuk ke DASHBOARD > pilih TEMPLATE > dan EDIT HTML.

  • Cari kode seperti ini ]]></b:skin>
  • Setealah kalian menemukan kode  ]]></b:skin> masukan kode di bawah ini tepat di atas kode yang tadi :
.admin-tulisan { display:block; width:auto; background:#fff; border:2px solid#4eabff; box-shadow:0 1px 3px #4eabff; -moz-box-shadow:0 1px 3px #4eabff; -webkit-box-shadow:0 1px 3px #4eabff; padding:0; margin:30px 0 10px 0; font:normal 12px Arial,Sans-Serif; color:#000; }
.admin-tulisan .kontainer { padding:5px; }
.admin-tulisan h4 { background:#4eabff; border:none; border-bottom:1px solid #; color:#000; text-transform:normal; text-  box-shadow:0 1px 3px #4eabff; -moz-box-shadow:0 1px 3px#4eabff; -webkit-box-shadow:0 1px 3px #4eabff; font:bold 12px Arial,Sans-Serif; padding:5px 10px; margin:0 0 0 0; display:block; }
.admin-tulisan h4 a { color:#000; }
.admin-tulisan img { width:110px; height:110px; margin:0 10px 0 0; float:left; border:1px solid #4eabff; padding:2px; background:#4eabff; box-shadow:0 1px 3px #4eabff; -moz-box-shadow:0 1px 3px #1da7e7; -webkit-box-shadow:0 1px 3px #4eabff; }

  • Setelah itu kalian  cari kode <data:post.body/> dan masukan kode di bawah ini tepat di bawahnya 
  • keterangan saat mencari kode <data:post.body/> di dalam template mungkin ada lebih dari satu,jadi kalian coba satu persatu sampai permalink bisa muncul di bawah postingan
<!-- Permalink seoke.com -->
<b:if cond='data:blog.pageType == &quot;item&quot;'><div class='admin-tulisan'><h4>Ditulis Oleh : <b><data:post.author/></b> ~ Tips dan Trik Blogspot</h4><div class='kontainer'><img alt='seoke.com' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8LO2FSeqbOL4opPT3VIbRtAlXoC2imd_sYQfHQMdP14GbyQGLlUpeKFmlFBYLQTWwrvNdcXvqqULfpdwU3siuhnC8rxp0Sc0a0mffgmLSsayM-wM7PjB96lpNuFgSs0WxZFSdAZDjw7w/s200/www.seoke.com.png'/>
Sobat sedang membaca artikel tentang <b><a expr:href='data:post.url'><data:post.title/></a></b>.  Oleh Admin, Sobat diperbolehkan mengcopy paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link dibawah ini sebagai sumbernya
<textarea cols='50' id='bloglinking' name='bloglinking' onclick='this.focus();this.select()' onfocus='this.select()' onmouseover='this.focus()' readonly='readonly' rows='1'>&lt;a href=&quot;<data:post.url/>&quot; target=&quot;_blank&quot;&gt;<data:blog.pageName/>&lt;/a&gt;</textarea>
<p><span style='float:right;font:italic 10px Arial, Sans-Serif;'>
<a href='http://seokecom.blogspot.com' target='_blank'>:: Get this widget ! ::</a></span></p>
<div style='clear:both;'/></div></div></b:if><!-- Permalink seoke.com -->

dan simpan/save template


  • Biru ganti dengan nama yang kalian inginkan
  • Orange ganti url  gambar dengan yang kalian punya
  • Merah untuk besar kecinya ukuran kotak permalink dan kalin bisa sesuaikan dengan template sobat sendiri.
Bila kalian butuh kode kode menarik yang pengen di tempelkan pada blog kalian seperti membuat fans page melayang silahkan kunjungi halamanya.

Terima kasih telah berkunjung di Cara memasang permalink pada blog.bila punya keritik dan saran silahkan tinggalkan pesanya di komentar.

   / /

  No Comments

Cara menginput kode Css pada Html

  06:38:00    

sekarang seoke.com akan berbagi sedikit dengan postingan postingan yang telah seoke.com bagikan.kali ini seoke.com akan berbagi postingan untuk para pemula yang begitu belum mengerti dengan penempatan/menginput kode kode Css pada Html.


foto By maringngerrang.blogspot.co.id

nah seoke.com sekarang pengen postingan tentang Cara menginput kode Css pada Html,dalam hal ini cara mnegipust kode tersebut kita bagi dengan 3 bagian diantaranya yaitu :
  • moetode inline style
  • internal style sheets
  • external style sheets
Yang di maksud dengan metide inline style ialah untuk menginput kode Css pada halaman/tag Html di haruskan menggunakan atribut style,contoh dengan cara penemptan dan atribut yang akan di pasang lihat contohnya di bawah ini 

1
2 
3
4
5
6
7
8
9
10
11
 <!DOCTYPE html>
 <html>
 <head>
      <title>Contoh Inline Style CSS</title>
 </head>
    <body>
       <h2 style="background-color:black; color:white" >
          Text ini akan bewarna putih dan background warna hitam
       </h2>
    </body>
 </html>

saat penempatan kode Css tersebut seoke.com menambahkan atributnya pada h2.

 internal style sheets ialahuntuk memisahkan kode Css dari halam Html namun dalam satu halaman Html,atribut style yang sebelumnya berada dalam tag di kumpulkan pada tag <style>. tag style ini harus berada dalam <head> dari halaman Html,kita lihat contohnya di bawah ini :


1
2
3
4
5
6
7
8 
9
10
11
12
13
14
15 
16 
17
 <!DOCTYPE html>
 <html>
 <head>
     <title>Contoh Inline Style CSS</title>
     <style type="text/css">
         h2 {
         background-color:black;
         color:white;
         }
     </style>
 </head>
 <body>
     <h2>
         Text ini akan bewarna putih dan background warna hitam
     </h2>
</body>
</html>

Menggunakan internal style sheets ini lebih baik dari pada metode inline style,karena sudah memisahkan Css dari Html tersebut.dan kekurangan saat menggunakan internal style sheets ialah jika kita memeiliki beberapa halaman yang sama,maka kita harus membuat kode Css pada masing masing halam tersebut.

external style sheets ialah untuk mengankat  kode Css tersebut ke dalam sebuah file yang terpisah dari halaman Html,setiap halaman yang membutuhkan kode Css tersebut.
Contoh sama seoerti dengan saat menggunakan internal style sheets.yang pertama kita lakukan ialah memindahkan isi tag <style> ke halaman baru.dan contohnya seperti ini :


1
2
3  
4 
 h2 {
 background-color:black;
color:white;
}
Pastikan akhir dari file tersebut Css.dan kembali ke halaman Html 
disini Css akan kita bagikan menjadi 2 cara untuk menginput kode Css ke halaman Html tersebut yaitu 

@import 

contohnya seperti ini :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<!DOCTYPE html>
<html>
<head>
    <title>Contoh Inline Style CSS</title>
    <style type="text/css">
        @import url(belajar.css);
    </style>
</head>
<body>
    <h2>
        Text ini akan bewarna putih dan background warna hitam
    </h2>
</body>
</html>

Pada metode @impor ini kita akan sisipkan @impor URL pada Tag  <style> 
dan yang kedua input pada external style sheets dengan mengunakan Tag <LINK>.contohnya seperti ini :

1
2
3 
4
5
6
7
8
9
10
11
12
 <!DOCTYPE html>
 <html>
 <head>
     <title>Contoh Inline Style CSS</title>
     <link rel="stylesheet" type="text/css" href="belajar.css">
 </head>
 <body>
     <h2>
         Text ini akan bewarna putih dan background warna hitam
     </h2>
 </body>
 </html>
Dalam meto de ini kita menggunakan href pada <link> yang akan berisi alamat dari halam Css.

mungkin hanya segitu yang bisa seoke.com terangkan dan jika kalian tidak mengerti dengan apa yang telah sampaikan di atas atau kalian punya keritik dan saran tenta blog seoke.com ini,kalian bisa tinggalkan pesannya di komentar.
Dan seoke.com berterima kasih kalian sudah berkenan mengunjungi blognya seoke.com yang berusaha untuk menyajikan kode kode html untuk para blogging yang bersumber dari para master blogging.

jika kalian butuh kode  Html pasang teks area untuk blog, bisa baca di postingan saya yang lainya di kumpulan kode teks area
Terima kasih 


  

  No Comments

Cara bikin toggle unik untuk blog

  07:15:00    

           Hai kawan seoke.com berjumpa lagi,kali ini seoke.com akan memoisting bagai mana Cara bikin toggle di blog yang unik,pokonya beda dengan yang lain toggle kali ini.
jadi makin unik tampilan pada blog maka akan lebih menarik para blogging dan enak kita saat melihatnya.
kita langsung aja ya ke caranya,klaian tinggal copy paste kode di bawah ini :


foto BY www.freepik.com/

  • Gooey toggle swith.





  • swith button



naha untuk vara pemasangan kode HTML dan CSS kalian bisa kunjungi postingan yang telah saya siapkan di postingan sebelemunya Cara prmasangan kode HTML dan CSS di blog.

mungkin hanya segitu yang bisa saya bagikan apabila kalian tidak mengerti atau kalian punya kriti dan saran tenatng blig yang telah saya ciptakan ,kalian bisa tinggalkan pesannya di komentar yang telah saya siapkan .
dan seoke.com ucapkan terima kasih kalian sudah mau berkunjung di bloganya seoke.com.

jika kalian lagi membutuhkan kode kode hatml bisa kinjungi kumpulan kode kode html untuk blog

Terima kasih

   /

  No Comments

Membuat fans page facebook melayang

  05:34:00    

Selamat malam kawan seoke.com yang selalu setia berkunjung di sini,nah kali ini seoke.com akan share tentang pasang FansPage Melayang seperti miliknya SEOCIPS,Di sini saat pemasangan kode kode tersebut tidak lah begitu sulit cukup kalian tinggal ikutin apa yang saya sampaikan di bawah ini.


foto By www.seocips.com

yang pertama coopy paste kode di bawah ini :

        1. fanspage slide sebelah kanan


Setealah kalian Copy paste kode tersebut kalian masuk terlebih dahulu akun Blog kalian kemudian kalian Masuk DASHBOARD > pilih TATA LETAK > TAMBAHKAN WIDGET > pilih HTML/JAVASCRIPT dan tinggal simpat widget tersebut

       2.fanpage slide sebelah kiri



Untuk cara yang kedua sama seperti cara yang telah sampaikan di atas tadi
mungkin cuma segitu yang bisa saya share kan dan bila kalian tidak mengerti atau punya keritiok dan saran silahkan kalian tinggalkan pesannya di komentar yang telah saya siapkan di bawah ini.
  seoke.com mengucapkan banyak terima kasih kepada blogging SEOCIPS yang telah menjadi sumber referensi blog seoke.com
NOte

kalain harus cari alamat URL seperti ini http://www.facebook.com/seokecom ganti dengan alamat fanspage punya kalain yang mau di pasang pada blog.
kalian butuh dengan cara pemasang navigasi di blog silahkan kunjungi disini cara pasang navigasi dengan gambar.

  

  No Comments

Menu navigasi dengan gambar

  05:49:00    

 butuh biar blognya unik dan menarik saat di lihat,kali ini seoke.com akan ber bagi tentang Menu navigasi dengan gambar.
jika kalian tertarik dengan menu navigasi dengan gambar kalian langsung aja copy paste kode di bawah ini.dan kalau masalh penempatan kodenya pasti kalian juga lebih mengerti dari seoke.com.


foto by ui-cloud.com

 silahkan di sedoooooot gan di bawah ini kodenya :



 saya dapatkan kode tersebut bersumber dari www.seocips.com
gimana unik bukan dengan tampilan seperti di atas,dan bila kalian tidak mengerti dengan cara penempatan kodenya silahkan kirimkan pesan kalian di komentar,

Terima kasih telah berkenann di blognya seoke.com

  

  No Comments

Subscribe to: Posts (Atom)