Cihan Eken Blog

BETA – Bu site henüz yapım aşamasındadır.

Sosyal Paylaşım Butonları Yapımı Javascript / HTML / CSS

Web sitelerinizde olmazsa olmazlardandır sosyal paylaşım butonları. Bende düşündüm herkesin işine yarayacak, her sistemde çalışabilecek minimum dış kaynak ile hoş bir görünüme sahip Google, Facebook, Twitter platformlarının paylaşım butonlarını yapıyoruz. Özellikle belirteyim ki bu butonlar her hangi bir alt yapıya bağımlı değildir. Her hangi bir sistemde çalışabilir.

Öncelikle belirteyim bu butonların çalışması için sayfaya Javascript kaynağı olan jquery.js yada jquery.min.js kaynağının dahil edilmesi gereklidir.

Aşağıda Google tarafından sunulan jquery.min.js kaynağını kullanabilirsiniz.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

 

Şimdi gelelim butonlarımızın yapımına.

Öncelikle HTML kısmı;

Web sitenizde görünmesini istediğiniz herhangi bir yere yukarıdaki HTML buton kodlarını ekleyiniz.

 

CSS Kısmı;

 

Javascript Kısmı;

 

Demo ve Önizleme;

 

See the Pen Social Share Button – HTML/ CSS/JS by Cihan Eken (@cihaneken) on CodePen.

Bir yorum bırakın.