Kendi eklentinizi oluşturmak için WordPress sitenizde AJAX ve PHP kullanın
İyi bir tasarım görünmez!Bu, otomatik sıcaklık kontrolüne ayarlanmış bir klima gibidir.Çok sıcak veya soğuk hissedene kadar, dikkat etmezsiniz, bunun yerine mevcut görevlere odaklanırsınız veya sadece zamanınızın tadını çıkarırsınız.Web’i keşfeden kullanıcılar için Ajax otomatik bir AC gibidir.Web sitesini kullanımı daha pürüzsüz ve daha hızlı hale getirir, hoş bir deneyim üretir.Ve en önemlisi, sadece işe yarıyor!Videoları tercih ederseniz, şanslısınız!Ajax tam olarak ne?Ajax, eşzamanlı bir j avascript ve nd x ml anlamına gelen bir web geliştirme tekniğidir.Bu, etkileşimli ve eğlenceli bir dinamik web uygulaması oluşturmak için kullanılır.Ajax ile değişiklikleri görmek için bir web sayfasının yeniden yüklenmesini beklemenize gerek yoktur.Yaptığınız şeyi rahatsız etmeden her şey arka planda otomatik olarak işlenir, böylece kullanıcı deneyiminizi geliştirir.
Ajax çalışıyor! Ajax’ı web’de bulmuş olabilirsiniz. Google Arama Otomatik özellikleri belki de en popüler olanıdır. Google Haritalar başka bir şey. Doğrudan ferahlatıcı tweet, facebook yorumları, Reddit gönderisi YouTube gibi, tüm bu olağanüstü kullanıcı deneyimleri Ajax ve ilgili teknoloji sayesinde mümkündür. Bu yazıda size Ajax’a kısa bir giriş yapacağım, faydalar listesi, WordPress’te nasıl çalıştığını açıklayacağım ve sonra önce basit bir WordPress eklentisi yapmaya gideceğiz. Kulağa eğlenceli geliyor mu? Başlayalım. Ajax temelleri Ajax, HTML/CSS, JavaScript, XML/JSON ve sunucu tarafı komut dosyaları (PHP, ASP.NET, vb.) Gibi programlama dillerinin bir kombinasyonunu kullanır. Tarayıcıdan sunucuya veri göndererek çalışır ve bu da yanıtı geri gönderir. Bu yanıt, bir tarayıcı tarafından Web sayfalarını yeniden bağlamadan güncellemek için kullanılır.
Kullanıcı eylemi tarayıcıdaki olayları tetikler (tıklama düğmesi gibi).
XML/JSON kullanarak sunucuya bir istek gönderen Ajax’ın çağrısı etkinleştirilir.
Sunucu tarafı komut dosyası bu isteği işler. Gerekirse veritabanına da erişebilir.
Sunucu daha sonra tarayıcıya bir yanıt gönderir.
Dönüş işlevi olarak adlandırılan ikinci JavaScript işlevi bir yanıt alır ve web sayfalarını günceller.
Ajax’ın birçok avantajı
Kullanıcılar ve sunucular için zaman kaydet, çünkü kullanıcılar derhal sunucudan bir yanıt görebilir.
Performans iyileştirme. Gönderilen tek sayfa verisi olmadığından, Ajax, web sayfalarının/uygulamalarının performansını, hızını ve kullanımını artırır. Duyarlı gücü artırır. Bir tam sayfa yeniden yükleme kaldırarak, web sitesi daha hızlı ve çok duyarlı olacaktır, bu nedenle daha kullanıcı dostudur.
WordPress’te Ajax ile çalışmak için gereken beceriler
HTML, CSS ve JavaScript bilgisi (JQuery yeterlidir)
XML veya JSON Veri Değişimi biçimine temel aşinalık
Sunucu tarafı komut dosyaları için PHP bilgisi
JQuery veya PHP bilginiz dokunur ve giderse endişelenmeyin! Yine de öğretici mantığı takip edebilirsiniz. Kilitle yapılırsanız veya bir şeyle ilgili yardıma ihtiyacınız varsa yorumlar bölümüne girmekten çekinmeyin 🙂
Giriş Ajax WordPress’te WordPress’in çekirdeği zaten Ajax kullanıyor, ancak sadece yönetici ekranında. Örneğin, yorumları denetlediğinizde veya kategoriden veya yayından öğeleri eklediğinizde/sildiğinizde, Ajax sayesinde anında güncellemeleri görebilirsiniz. Bu aynı zamanda çok sevilen otomatik tasarruf işlevinin arkasındaki bir teknolojidir. Ajax çoğunlukla WordPress’teki jQuery işlevleri ile kullanılır, çünkü Vanillaj’lara kıyasla çok daha basittir. Buna ek olarak, çekirdek WordPress JQuery Kütüphanesi ile yüklenmiştir. Bu, WordPress’te Ajax kullanma sürecidir:
Kullanıcılar, WP-Admin klasöründeki admin-aajax.php dosyasına iletilen AJAX isteklerini tetikledi.
Ajax isteğinin verilerin en az bir bölümünü sağlaması gerekir (GET veya Post yöntemini kullanarak). Bu isteğe eylem denir.
Admin-ajax.php adresindeki kod iki kanca yapmak için eylem kullanır: wp_ajax_yuraction ve wp_ajax_nopriv_yourction. Burada, GET veya Post Eylem Değişkeninin değeridir. WP_AJAX_YOURCTIONT’un ilk kancası yalnızca giren kullanıcılar için gerçekleştirilirken, ikinci kanca WP_AJAX_NOPRIV_YOURCTION sadece kullanıcılara hizmet eder. Tüm kullanıcıları hedeflemek istiyorsanız, her ikisini de ayrı ayrı etkinleştirmelisiniz.
Zarif bozulma için kanca işlevini planlayın. Bu, kodunuzun JavaScript devre dışı bırakılmış bir tarayıcıda bile çalışmasını sağlar.
Ajax WordPress eklentisini her büyük yolculuk bir adımla başlar ve öğrenmemiz de yapalım. Aşağıdaki özelliklerle Post Likes Counter adlı temel bir WordPress eklentisi oluşturalım:
Giren kullanıcılar gönderileri beğenebilir.
Eklenti, toplam yayın sayısının hesaplanmasını saklar ve görüntüler. Sayım ön uçta anında güncellenmeyi sever.
Çıkan kullanıcılara sevkiyatı sevmeye çalışırlarsa bir hata mesajı gösterilir.
Başlamak için boş bir WP eklentisi yapın ve etkinleştirin. Bununla ilgili yardıma ihtiyacınız varsa, WordPress eklentisi geliştirme kılavuzumuza başvurabilirsiniz. WordPress Codex ayrıca WP eklentisinin yazılması hakkında ayrıntılı bir sayfaya sahiptir. Tema şablonunuzu bulun bundan sonra, temanızı tek bir.php gönderme şablonu bulmanız gerekir. Bu, bir gönderi sorulduğunda kullanılır, yayınlarımızı saymak istediğimiz yer burasıdır. Bu dosya etkin temanızın kök klasöründe bulunabilir. Düzenlemeye açık kalsın.
Ajax çağrıları için hazır bir yazı şablonu alın, burada kullanıcıların yayınları sevmesi için bir bağlantı yapalım. Kullanıcı JavaScript’i etkinleştirirse, daha sonra oluşturacağımız JavaScript dosyasını kullanır; Değilse, yalnızca doğrudan bağlantıyı takip edecektir. Aşağıda verilen kodu single.php dosyanıza yerleştirin. Çekirdeğin güçlendirilmesi 1379ac822720e8c8c1860209a2bfe323
Veya bu kodu şablonun single.php dosyanıza dahil edilen bir bölümüne ekleyebilirsiniz. Örneğin, resmi yirmi on dokuz temayı kullanırsanız, bu kodu content-single.php dosyanıza girebilirsiniz. Bu eklenti kodunu test etmek için, div.Entry-Content bölümünün sonunda bu dosyaya koydum.
Ajax çağrılarının üstesinden gelmek, yukarıda yapılan bağlantıyı tıklamak olmadan, sizi admin-ajax.php komut dosyasına götürür, ancak işlemlerinizi gerçekleştirmek için herhangi bir işlev yapmadığınız için yararlı bir çıktı görmezsiniz. Bunu yapmak için, eklenti dosyanızda bir işlev oluşturun ve WordPress tarafından sizin için yapılan iki kancaya ekleyin. Aşağıda gösterilen kodu izleyin:
Yükleme Çekirdeği 5B77823B65250637EEE4396D8ABCC5A0
Her şey çözülürse, giren kullanıcı bu yazı gibi bağlantıya tıkladığında, yukarıdaki hesaplama beğenileri otomatik olarak 1 artar. JavaScript’i devre dışı bırakan tarayıcılar için sayfa yenilenecek, ancak yine de güncellenmiş beğeni miktarını gösterecektir.
Çıkan kullanıcıları işleme işlevi, hata mesajlarını getirmek dışında burada çok yararlı değildir. Sadece bir örnek olması amaçlanmıştır. Tabii ki bunu oluşturabilir ve ziyaretçilerinize daha kullanışlı seçenekler sunabilirsiniz. Son olarak, JavaScript’e destek eklemek, JavaScript’e sonuna doğru destek eklemek için iyi bir uygulamadır, çünkü her şeyi daha net hale getirir. WordPress’te Ajax’ı kullanmak için, JQuery kitaplığınızı ve özel eklenti JavaScript dosyanızı sıralamanız gerekir. Bunun için eklentinizi açın ve aşağıdaki komut dosyasını ekleyin: Çekirdek C4BA96F5AC2997B294C70C90B82D43D3’ü sevmek
Bittiğinde, bir JavaScript Liker_script.js dosyası oluşturma zamanı. Ardından, bu dosyayı önceki koda atıfta bulunulan konuma yüklemeniz gerekir (Talimatlar: Bu kök eklenti klasörünüzdür). Liker_script.js için aşağıdaki kod:
Çekirdek 9d3183eeca419da10b9ff997ef236b87 içerir
Eklentide tanımlanan my_user_ye () işlevi, javascript nesneleri olarak da kullanılabilen JSON sonuçlarının sonuçları olarak tarayıcımıza bir yanıt göndermeliyiz. Bununla, Web sayfalarını yeniden doldurmadan benzer yayınların sayısını güncelleyebiliriz.
Ve hepsi bu! Hoorayyyy! Artık eklentiniz için AJAX işlevselliğini etkinleştirdiniz. Tabii ki, bunu genişletebilir ve beğeninize daha fazla özellik ekleyebilirsiniz. Lütfen, başarana kadar ayarlayın!
Counter gibi basit gönderilerimiz. Bunları geliştirmek için stiller, animasyonlar ve diğer komut dosyaları ekleyebilirsiniz.
Ajax kullanan önde gelen WordPress eklentisinin sizi heyecanlandırmak için Ajax ilhamına ihtiyacı var mı? Gelişmiş özellikler ve daha pürüzsüz kullanıcı deneyimleri oluşturmak için Ajax Power kullanan bu olağanüstü WordPress eklentisini görün. Tembel Yükleme Tembel yük eklentisi, başlangıç sayfasını yükleme süresini artırmak için kullanılan bir web geliştirme tekniğinidir. Bu, ViewPort tarayıcısındaki kullanıcılar tarafından görünmeyen ağır kaynak varlıklarının yüklenmesini geciktirerek yapılır. Bu varlık, kullanıcı web sayfasını indirdiğinde otomatik olarak yüklenir. Smush’ın ücretsiz versiyonu yavaş yüklemeyi destekler.
Anket, sınavı, ödeme seçenekleriyle formları sipariş etmeyi de destekleyen tamamen genişletilmiş bir form eklentisi oluşturmak, vb. Bu eklenti, Ajax ile formların teslimatını etkinleştirme seçeneğine sahiptir ve bu da onu kullanıcılar için sorunsuz bir deneyim haline getirir.
Ajax ile girin WordPress sitenizi giriş yaparak ve bu özellik zengin eklentisiyle sorunsuz bir kayıt efekti. Kullanıcınıza WordPress varsayılanından daha iyi bir giriş ve kayıt deneyimi vermek istiyorsanız, artık aramaya gerek yok.
Bu basit WP-Postration eklentisi, yayınlamak için bir AJAX sıralama sistemi ve WordPress site sayfalarınız ekler. Ayrıca sıralama için kısa kod desteği ekler, böylece istediğiniz yerde görüntüleyebilirsiniz.
Ajax tarafından desteklenen WordPress için duyarlı olan Ajax Search Lite eklentisi doğrudan arama. Bu aynı zamanda Google’ın otomatik bütünlüğü ve anahtar kelime önerilerini de içerir. Bu eklenti ile web sitenizde kullanıcınıza daha iyi bir arama deneyimi verin. Basit Ajax Jobs, doğrudan web sitesindeki diğer kullanıcılarla sohbet edip edemeyeceğinizi merak ettiniz mi? Bu Ajax -Güçlü eklenti cevap. Bu, hücresel için uyumludur ve isteklerinize göre çok ayarlanmıştır.
Daha parlak bir uygulama için wordpress.org eklenti deposunu açın.
Sakin olun ve Ajax devam edin! için iyi olan kullanıcılar ve sunucular için de iyidir, ancak dengelemeniz gerekir. Ajax, web sitelerinin performansını ve kullanıcı deneyimini artırmak için silahlarınızda güçlü bir araçtır. Ancak bunu sadece gerekli yerlerde kullanabilirsiniz. Her zaman kullanıcı deneyiminin yönlerine odaklanın. Bu ilk başta biraz zor olacak, ancak Ajax’ın temellerinde ustalaştıktan sonra hiçbir şey sizi durduramaz!
Daha önce WordPress için Ajax Powered eklentileri kullandınız mı veya yaptınız mı? Ajax için diğer harika kullanımları mı düşünün? Aşağıdaki yorumlarda bize fikrinizi anlatın.
Etiket:
Ajax
kodlamak
Bağımlı
WordPress
