Kategori: jQuery

Yapışkan Sidebar Nasıl Yapılır?

Bu yazımda yapışkan web sitenizde bulunan sidebar (kenar çubuklarını) yapışkan hale getirip projenize nasıl entegre edebileceğinizi anlatıyor olacağım. Gün geçtikçe kullanımı artan bu yapışkan sidebar çeşidi bir web sitesinde kullanıcıların aşağı ve yukarı kaydırma işlemini yaparken kalıcı olarak görünür durumda kalmasına yarayan oldukça kullanışlı bir sidebar çeşididir. Ben javascript bilgimin üst seviyede olmaması kaynaklı olarak … Okumaya devam et Yapışkan Sidebar Nasıl Yapılır?

CSS ve jQuery ile Sosyal Medya Paylaş Buton Barı

Uzun zamandır yazı giremiyorum sitenin kapanmasına kadar giden bir süreç oldu ama bu kadar emeğin boşa gitmemesi amacıyla geri döndüm. Hem başlangıç olması amacıyla hemde yararlı olacağını düşündüğüm bir css örneği paylaşmak istedim. Bu yazıda css ve jquery yardımıyla sayfada aşağıya inildiğinde ortaya çıkan yukarı çıkıldığında kaybolan bir sosyal medya paylaş buton barı örneği paylaşacağım. … Okumaya devam et CSS ve jQuery ile Sosyal Medya Paylaş Buton Barı

Sol Taraftan Açılıp Kapanabilen Drawer Menü

Android’in Marshmallow sürümüyle hayatımıza giren Materyal Tasarım trendinin en çok beğenilen özelliği olan drawer menü hakkında bir örnek hazırladım. Google’nin yeniden tasarladığı veya yeni projelerinde sıkça yer verdiği drawer menü oldukça kullanışlı bir menüdür. Tasarladığım menüyü adım adım yapılışını anlatarak sizlerle paylaşmak istedim, umarım beğenirsiniz. Menü oldukça kullanışlı ve modern bir yapıdadır. Çalışma mantığı ise hamburger görünümünde olan … Okumaya devam et Sol Taraftan Açılıp Kapanabilen Drawer Menü

CSS ile Off-Canvas mobil menü nasıl yapılır

Bu yazımda mobil cihazlarda off-canvas yöntemiyle çalışan kullanışlı bir menü tasarlayacağız. Bunu yaparken herhangi bir css ve jquery kodu kullanacağız. Örnekte Kullandıklarım Örneğin çalışması için jquery kütüphanesini ve fontawesome ikonunu<head> tag’ı içine eklemeniz gerekmekte. FontAwesome Google Font (Open Sans, Roboto Slab) Html, CSS ve jQuery CSS ile Off-Canvas mobil menü nasıl yapılır Yapımı oldukça basittir ilk olarak … Okumaya devam et CSS ile Off-Canvas mobil menü nasıl yapılır

WordPress eklentisiz ajax daha fazla yükle seçeneği

Günümüzde tema tasarleken en önem verilen şey tasarımınızın işlevselliğidir. Tasarımınızın kullanımı kolay olduğu sürece her daim google ve ziyaretçileriniz tarafından sevileceksiniz. Bu yazımda sizlere genellikle Twitter, İnstagram gibi yerlerde görmeye alışık olduğunuz nesnelerin ihtiyaç halinde yani aşağıya inildikçe gözükmesini sağlayan bir ajax eklentisinden bahsedeceğim. [button]Demo[/button] Başlayalım İlk olarak div oluşturarak başlıyoruz. <div id=”lazyload”> </div> WordPress yazılarını … Okumaya devam et WordPress eklentisiz ajax daha fazla yükle seçeneği

Responsive açılır-kapanır menü örneği

Günümüzün mobil internet kullanımı en üst seviyeye çıkmış durumda.. Haliyle mobil tasarımda ön plana çıkıyor bende sizin için responsive açılır kapanır menü hazırladım.  Paylaşacağım bu menü örneği tüm mobil cihazlar için uygun görünüme bürünmektedir ayrıca bu menü wordpress stil yapısına uygun tasarlanmıştır. [button color=”btn-danger” size=”” link=”http://codepen.io/uckannet/pen/MwaxVw” icon=”” target=”true”]Detaylı Demo[/button] [button color=”btn-info” size=”” link=”http://codepen.io/uckannet/full/MwaxVw/” icon=”” target=”true”]Full … Okumaya devam et Responsive açılır-kapanır menü örneği

WordPress yazı beğenme (like) sistemi

Bu beğeni sistemini Sven Hoffman isimli bir geliştirici yayınlamıştır. Kendi sitem lazım olan bu sistem için bir kaç araştırma yaptım ve bu sisteme ulaştım bulmuşken de türkçe kaynak yaratmak istedim umarım işinize yarar.. Sistem güncellenmiştir haliyle yazıyıda güncelliyorum hatta yakında sistemi admin panelden kontrol edilebilecekmişiz. WordPress yazı beğenme (like) sistemin indir [button style=”uckan-btn–fab” color=”uckan-btn–red” size=”uckan-btn–middle” link=”https://github.com/JonMasterson/WordPress-Post-Like-System/archive/master.zip” icon=”fa-download” target=”true”][/button] … Okumaya devam et WordPress yazı beğenme (like) sistemi

Google Material Design Ripple Efekti – jQuery

Bugün kü yazımda günümüzün popüler tasarım trendi google material design ile sıkça görmeye başladığımız fare etkileşimini konu alıyorum.  Makalemde dalganma efektini yaratmak jquery eklentisi yaratacağız. Google material design hakkında bilgi edinmek istiyorsanız tıklayın. [indir]Demo Downlaod[/indir] Dalgalanma Efekti nasıl yaratılır? 1. Web sayfamızda buton oluşturalım. <button>Tıklayın</button> 2. jQuery kütüphanesi ve oluşturacağız jQuery eklentisini web sayfamıza çağıralım. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script … Okumaya devam et Google Material Design Ripple Efekti – jQuery

WordPress Sosyal Medya Paylaş Butonu

Bugün kü makalemizin konusu sosyal medya.. Günümüzde kullanımı artan bazı sosyal medya sitelerinde yazılarınızı paylaşmanız için bir içerik hazırladım ve bunu sizlerle paylaşıyorum.. [indir]Demo[/indir] HTML yapımız aşağıda ki şekildedir..  Temanızın single.php dosyasında görünmesini istediğiniz yere eklemeniz gerekmektedir. <ul class="btn-share clearfix"> <li><a href="#" class="button share entypo-share"></a></li> <li><a href="https://www.twitter.com/intent/tweet?url=<?php echo get_permalink(); ?>" class="button twitter entypo-twitter" target="_blank"></a></li> <li><a href="https://www.facebook.com/sharer/sharer.php?u=<?php echo … Okumaya devam et WordPress Sosyal Medya Paylaş Butonu