Kendi kodunuz AutoSuggest, WordPress eklentisi için sürekli arama ile etkinleştirildi
Eklentilere veya üçüncü taraf temalarına bağlı olmadan daha fazla arama işlevi eklemek ister misiniz? Otomatik öneriler, özel yayın türleri, taksonomi, özel alanlar ve aşağıdan yukarıya önbellekleme için kendi gelişmiş WordPress arama eklentinizi oluşturun. Bu makalede, özel bir posta türü (CPT), özel taksonomi ve gelişmiş kontrol alanı kullanılarak yapılan özel meta veri kullanılarak filtrelenebilen kısa kod tabanlı bir arama formu eklemek için nesne yönelimli bir eklenti nasıl oluşturulacağını göstereceğim. (ACF). Arama formu ayrıca Ajax destekli otomatik öneriler gösterecek ve önbellek sonuçlarına WordPress geçici kuyusunu kullanacaktır.
Ücretsiz eklentiler daha fazla işlevsellik eklemenin popüler bir yolu olsa da, genellikle bir dizi kendi problemiyle gelirler. Ve doğru kombinasyonu alırken dikkate alınması gereken birçok faktör var. Bazen, daha iyi bir yaklaşım gerektiren alanlar için kendi eklentinizi geliştirmek, daha büyük bir şemada çok daha kullanışlı olabilir. Bu aynı zamanda kullanım, performans ve uygulama güvenliğinin daha fazla kontrolünü kontrol etmenizi sağlayacaktır. Not: Bu makale orta düzey WordPress geliştiricileri için tasarlanmıştır. Bu, PHP, JavaScript, WordPress döngüsü, geçici ve WordPress eklentisi API hakkında bilgiye sahip olduğunuzu varsayar. Yenilemek istiyorsanız, aşağıdakileri okumanızı öneririm:
WordPress’te Özel İçerik Oluşturma: Taksonomi ve Alan
Orta Kullanıcılar için WordPress Geliştirme: Eklentiler Oluşturma
Gelişmiş WordPress Geliştirme: Geçici ile Çalışma
Gelişmiş WordPress’in geliştirilmesi: Nesne Yönlendirilmiş Programlamaya Giriş Bu makale için, kısa bir kod kullanarak herhangi bir WordPress sayfasına otomatik olarak etkinleştirilen bir arama formu ekleyen özel bir WordPress eklentisi hazırladım. Bu aynı zamanda arama sonuçlarını bir veya birkaç özel yayın türüne mükemmelleştirmenize ve bunları Flexbox kutusunun düzeninde görüntülemenize olanak tanır. Makaleyi takip etmek için arama eklentimi buradan indirebilirsiniz.
Makalenin ilerleyen saatlerinde, aynı eklentiyi genişleteceğim ve hayali video kütüphaneleri için çeşitli taksonomi ve özel alanlarda filtreleme gibi karmaşık arama özellikleri ekleyeceğim, ancak örneğin ürün arama veya hatta arama yönleri gibi herhangi bir senaryoya kolayca genişletilebilir. CPT ve ACF, WordPress’e olağanüstü bir güç ve işlevsellik katar ve önce sipariş edilen her geliştirme projesinde oldukça yaygındır. Amacım, gerçek dünya uygulamalarında birlikte oynanacak bazı sofistike WordPress özelliklerini entegre etmenize yardımcı olmaktır. Haydi başlayalım!
Not: Makalenin geri kalanı ve kodun tamamı için, posta türü terimi, yayın ve sayfa varsayılan yayın türlerini ve kayıtlı tüm özel yayın türlerini ifade eder. Özel Arama Eklentisi Kontrol Grafiği Kod içine girmeden önce, eklentinin perde arkasında nasıl çalıştığına dair üst düzey bir ekran var. Eklenti arama motoru, kullanıcı arama çubuğuna anahtar kelimeyi girdikten sonra veya arama formu gönderildikten sonra çalışır. Ve sonra, çok fazla geçici duruma bağlıdır.
Özel Arama Eklentisi Kontrol Grafiği
Uygulama arama gibi hassas kaynak alanları için, uygulamamı aşağıdaki fikirlere odaklıyorum: Önbellek sadece geçici olarak ihtiyaç duyulan şeydir ve tüm wp_query nesneleri değildir
Otomatik öneriler için bazı Ajax çağrılarının yapıldığından emin olun
Geçici bilgileri saklamadığından emin olun
Aramaya hangi tür yayınların dahil edileceğini kontrol etmek için ayarlar verin
Doğal olarak, bir boyut herkes için uygun olmayacak ve uygulamanızın karmaşıklığına göre bir dizi ayarlama yapılması gerekecektir. Ne olduğunu öğrenmek için eklentinin yapısını kontrol edelim.
Arama eklentisi Advanced Search eklentisinin yapısı, orijinal WordPress eklentisi Bolarplate projesinin bir çatalı olan kendi eklenti şablonuma dayanıyor. İşte arka uçtaki yapı:
Inc/Core/* – Eklentinin temel işlevselliği
Inc/Core/class-init.php-the Hooks için Yönetici menüsü, kısa kod, AJAX işleyicisi, yönetici bildirimi, komut dosyası ve stil için
Admin kontrol panelindeki eklenti ayar alanı için inc/admin/class-admin.php-fonksiyonellik
Kısa Kod Tabanlı Arama ve Otomatik Ajax Öneri İşlemesi sağlamak için Inc/Common/Class-common.php-Fonksiyonellik
Inc/Common/Views/* – Arama Formu ve Arama Sonuçları
Inc/Common/JS/* – Otomatik
Inc/Common/CSS/* – Arama formları için CSS
Etkinleştirme sırasında eklenti, Ayarlar Yönetim menüsüne alt seviye menü öğesi olarak seçenekler sayfasını ekler. Bu, özel yayınlarla birlikte kaydedilmiş özel yayın türleri ve daha fazla aramaya dahil edilecek seçenekler olarak varsayılan sayfalar içerir.
Ayrıntıları tartışmayacağım, ancak Yönetici sayfasını nasıl eklediğimi görmek için, Inc/Core/class-init.php’den define_admin_hooks () yöntemine ve add_plugin_admin_menu () yönteminden Inc/admin/class-admin.php’den bakın. Ayarlar için İşaretleme sayfası Inc/Admin/Views/HTML-NDS-NDS-SAVED-SEART-ADMIN-OPPHP’de bulunabilir. İşlerin ilginç başladığı yer Inc/Common/Class-common.php. Giriş noktası, Inc/Core/class-init.php’deki define_common_hooks () yöntemi üzerinden geçer.
Yükleme Intisari 0E584AE9450B1AB1B9B3C1D7D61C8B01 Öyleyse kısa bir kodla başlayalım.
Kısa Kod Inc/common/class-common.php adresinden Register_ShortCodes () yöntemi için özel bir arama formu içerecek özel bir arama formu girmek için kullanılan kısa kodlar [nds-danced-search] ekler.
Çekirdek yükleme 5E52011542082b940ae71b6eb0f500b8
Yukarıdaki çekirdeği görünce, kısa kodun içeriğinin (yani arama formu) brifcode_nds_advanced_search () ‘nin dönüm işlevi ile döndürüldüğünü göreceksiniz. Bunun gibi bir şey yapabilirim:
D41849A407C0DC49C79B25034A67F4D1’in özünü içerir
Ancak, biraz farklı bir yaklaşım benimsedim. Kısa bir kod geri kodunda arama formu işaretlemesini doğrudan görüntülemek yerine, bir arama formu içerecek şekilde get_search_form filtresini ve get_search_form () işlevini kullanıyorum.
Çekirdek Yükleme 9ECD1B55FA3A31FA22379BDFE271DE10
Bunu arama formunun oluşturulmasını daha fazla kontrol etmenizi sağlamak için yaptım. Nasıl çalıştığına bakalım. Kanca filtresi get_search_form ve etiket şablonu şablonu Get_search_form (), WordPress aramasının görüntüsünü kontrol etmenin iyi bir yoludur. Her şeyden önce, temanın searchform.php içerip içermediğini ve kendisi tarafından belirlenen işaretlemeyi içerip içermediğini görebilir; Değilse, WordPress tarafından sağlanan varsayılan arama formunu içerir. Veya get_search_form filtre kancasını kullanarak arama formunu tam olarak değiştirebilirsiniz, bu durumda get_search_form () geri arama filtresi tarafından belirlenen işaretlemeyi döndürür. Varsayılan arama formunu gönderirken, WordPress Search.php’yi kullanarak arama sonuçlarını devralır ve oluşturur. Şablon, aşağıdaki koşullar yerine getirildiği sürece:
Site ana sayfasına ulaşmak için arama formları
S adlı giriş metninin adının adı
Örneğimde, WordPress’in aramayı işlemesini istemiyorum ve filtre kancasını kullanarak varsayılan formu değiştirdim: add_filter (‘get_search_form’, dizi ($ this, ‘advanced_search_form_markup’))
Get_search_form filtresi uygulanmadan önce $ formunu doldurun
Burada, filtre tarafından iletilen $ form değişkenini kontrol etmek için yürütmeyi duraklattım. Bu, Inc/Common/Views/HTML-NDS-ACCEDCED-SEATE-FORM.php’deki arama formumun yerini alacak yirmi on altı temadan searchform.php tarafından sağlanan HTML formunu tutar.
E77C3DF9FDC9F9F503AFF73E3839C5’in özünü içerir
Giriş özniteliğinin formunun veya adının eylemiyle ilgili yukarıdaki kurallara uymadığım için, WordPress hiçbir şey yapmayacaktır. Bu iyi çünkü arama sonuçları üzerinde tam kontrol almak istiyorum ve ayrıca kısa bir kodla aynı sayfada içeriyor. Get_search_form ile özel bir form kullanılması tamamen bir tasarım kararıdır ve farklı bir görüşe sahip olabilirsiniz. Varsayılan arama formunu kasten ayırdım ve eklenti tarafından sağlandım. Ayrıca, yan bıçaklarda, başlıklarda vb. Temalar tarafından kullanılan arama formunun da sağlar. Özel bir arama formundan etkilenmez. Eklenti arama formunun sunulması, kısa kodla aynı sayfaya gönderilir ve bu nedenle kısa kodun arkası da formun dağıtımını işler.
Fb8729a02e6a536685b707b9254db726’nın çekirdeğini içerir
Bir nedenden dolayı, başka bir sayfada form verilerini işlemek istiyorsanız, WordPress’te formların sunulması ile ilgili makaleme bakın. Şimdi eklentilerin arama sonuçları nasıl yaptığını görelim. Gönderi ve İfade Arama Sonuçları Türünde yayınlar istemek için WP_QUERY kullanma Özel bir WP_QUERY kullanılarak toplanan ve Inc/Common/Views/HTML-NDS-ADVANDED-SEATRECH-REECH-Research.php aracılığıyla oluşturulan arama sonuçları. WP_QUERY Custom Ben aşağıdaki argümanı aldım:
‘S’ => $ search_term – burada $ search_term aranacak anahtar kelime ‘Cümle’ => true – tam bir ifade araması yapın
‘Post_type’ => $ Post_types – Eklenti ayarlarında belirtilen yazı türlerini depolayan $ Post_Types’e ait yayınları ekleyin
‘Post__in’ => $ cached_post_ids – sadece $ cached_post_ids’no_found_row ‘=> true adresinden mevcut bir gönderim kimliği arıyorum – sorgunun yürütülmesini hızlandırın.
Cümle parametreleri WP_Query’nin terimin tamamlandığı yerleri geri yüklemesine neden olur. Bu katı bir arama gibidir ve sonuçların toplanmasını azaltabilir. Bu, isteklerinize göre çalışabilir veya olmayabilir ve ihtiyaçlarınıza göre değiştirmelisiniz. No_found_rows, döngümde sayfalanmaya ihtiyacım olmadığı için benim için işlev gören başka bir parametredir. Ayrıca, belirli yayınların gönderilmesiyle daha fazla arama sınırlamak için post__in parametrelerini de kullanıyorum. Posta kimliği, seçilen gönderi türüne göre ve yeni yayın oluşturulduğunda veya eskisi silindiğinde değişir.
FD6A0AB49C878C07231DD15EB9325CEA’nın özünü içerir
Makalenin başında akış diyagramını görürseniz, yukarıdaki özde geçici olarak önbelleği kontrol etmek için koşullu mantık göreceksiniz. Önbellek yayınları için geçici WordPress kullanma Get_transient function () Geçici durumunu geri yükleyin. Varsa, önbellek posta kimliğini içeren diziyi ve gerekli gönderi türü için posta başlığını döndürür. Geçici süresi dolmuş veya gönderim veya güncelleme ayarları sırasında mevcutsa veya silinmezse, false döndürür ve get_posts () cache_posts_in_in_types () yönteminden çağrılır.
Core 5183A85C67FC40917F1D416686B59CE3’ü içerir
Bağımsız değişkeni ihtiyaçlarınıza göre Get_posts () olarak ayarlamanız gerekebilir, çünkü hangi kimliğin önbellek olduğunu kontrol eder. Cache_posts_in_post_types () yöntemi, post başlıklarını depolamak için kontrol eden otomatik önerilerle de kullanılır. Otomatik öneriler kullanmak istemiyorsanız, yalnızca Return Fields parametresini kullanarak kimlik alarak get_posts () hızlandırabilirsiniz.
Şimdi bulmaca-otomatik arama önerisinin son bölümüne bakalım.
Arama formuna otomatik öneriler eklemek, WordPress’e dahil edildiğinden arama önerileri sağlamak için JQuery UI Otomatik Tamamlama Widget’ı kullandım. Bununla birlikte, kullanabileceğiniz başka birçok harici kütüphane vardır. Enqueue_scripts Yöntemi Inc/common/classcommon.php, gerekli komut dosyasının yüklenmesini işler.
B8172AA19D803B36A3023612CFF3DE2’nin özünü içerir
Önbellek yayın başlığı geçici olarak mevcutsa, WP_LOCALICH_SCRIPT işlevi aracılığıyla otomatik JavaScript için de kullanılabilir. Bu, arama önerileri için WordPress’e yapılan Ajax çağrılarının sayısını en aza indirmeye yardımcı olur. Aşağıdaki kod oldukça basittir, ancak otomatik önerileri ele almaya hizmet eder.
Yükleme Çekirdeği 38B541BF057403BF1C72AA3C3489995F
İşte AutoSugest betiğinin bazı önemli yönleri: Gönderi başlığını filtrelemek için jQuery.grep () kullanır. Normal bir ifade kullanarak maçı daha da mükemmelleştirebilirsiniz
Arama anahtarı, GREP çağrılarını azaltmak için yerel nesnelerde tekrar önbellektir, ancak önbelleğin kalmasını sağlamak için html web depolama ateşini de kullanabilirsiniz
Ajax isteği yalnızca WP_LOCALICH_SCRIPT POST başlığı için boş değeri aştığında yapılır. Ajax’ın nasıl ele alındığına bakalım. Otomatik Öneri Ajax Handler Eylem: “NDS_ADVANDED_SEARCH_AUTOSUGGAT” Action özelliği: “NDS_ADVANDED_SEACH_AUTOSUGGAT” “WordPress WP_AJAX_ {Action} WordPress WP_AJAX_ {Action} yürütülecek ve sunucu tarafında Ajax taleplerinin işlenmesine izin verecek.
Core 344ACC1900825B234D40116BC1BC8A3’ü içerir
İşleyici, daha önce gördüğünüz cache_posts_in_post_types () aracılığıyla Get_posts () ‘nı dolaylı olarak çağırır ve ardından WP_SEND_JSON () () () () kullanarak yayın başlığını Ajax yanıtı olarak gönderir.
Özel arama için otomatik öneriler.
Geçici verilerin süresinin dolmamasını sağlamak, gerekli posta türüne ait yayınlar yapıldığında, güncellendiğinde, vb. Geçici olarak silinmesi önemlidir. Class-admin.php’den delete_post_cache_for_post_type () yöntemi bunu işler ve class-init.php’den define_common_hooks () içindeki transition_post_status eyleminin kancasını kullanarak çağrılır.
92ff6b323382349eef6c814e662736’nın özünü içerir
Ayrıca, son kullanma işleminin veritabanını bozmayacağına dikkat edin, çünkü WordPress referans için her yapıldığında onu silecektir. Büyük! Bu aşamada, tam işlevli bir arama eklentimiz var. Özel taksonomi ve özel alanlara sahip bir arama sayfası uygulayarak bunu bir sonraki seviyeye getirelim. Vaka çalışması: Daha gelişmiş bir arama filtresi ile özel video araması uygulamak genellikle kullanıcıların filtreler kullanarak aramayı filtrelemelerini sağlar. Bunu, taksonomi terimi ve arama filtresi için özel alanlar gibi yayınların bir gönderisini kullanarak kolayca yapabilirsiniz. Demek istediğim budur: Özel taksonomi ve özel alanlar kullanarak bir arama filtresi ile daha fazla arama
Özel video sevkıyatına özel meta veriler eklemek için özel bir gelişmiş seviye alanı kullandım. Bazıları yukarıda gösterildiği gibi bir arama filtresi olarak görünür ve geri kalanı arama sonuçları ekranında kullanılır.
Gelişmiş özel alanlarla yapılan özel video gönderileri için özel meta
Ayrıca bazı özel taksonomi ekledim: özel bir sevkiyat türüne video ve video konumu türü. Taksonomi terimi arama filtresinde onay kutusu olarak kullanılır.
Özel video yayın türü için özel taksonomi
Bu tamamen bir kodlama tercihidir, çünkü giriş formlarını kolayca tekrarlayabileceğim daha az değişkene yakalamamı sağlar, ancak bu HTML’nin daha karmaşık hale getirilmesini sağlar. Arama filtresi olarak özel taksonomi eklemek için Inc/Common/Views/HTML-NDS-NDS-Adved-Search-form.php’deki arama formunu değiştirerek başlayalım. Arama filtreleri için özel taksonomi kullanarak bir onay kutularının dinamik bir listesi yapın Video yayınının türü ile ilgili taksonomi almak için, get_object_taxonomies () işlevini nesnelere ayarlanmış ikinci parametre ile kullanıyorum. Bu, daha sonra aşağıda gösterildiği gibi Get_terms () işleviyle ilgili terimlerini toplamak için kullandığım sümüklü böceklere, isimlere ve taksonomi etiketlerine erişim sağlıyor:
Yükleme Çekirdeği 9B2256EA5B63F9AF05519F137244B1C0
Özel taksonomi miktarına ve döndürülen terime dayanarak, onay kutusu için HTML işaretlemesi For döngü içinde dinamik olarak yapılır. Taksonomi kullanarak Tax_query gönderimi, WP_QUERY’den Tax_query parametresini ayarlamanızı gerektirir. Taksonomi kullanarak sorgu gönderimi için dinamik Tax_query yapın Tax_query parametre taksonomisi, taksonomiyi temsil eden her dizinin bulunduğu bir çizgi alır. Burada, kullanıcı tarafından seçilen terime dayanarak dinamik bir Tax_query yapıyorum. Kullanıcı, arama filtresinde birkaç taksonomiden terimi seçerse, harici dizide ‘veya’ olarak ayarlanan ilişkiler parametreleri ile birlikte bazı taksonomi dizileri üretilir. Ayrıca, WP_Query bağımsız değişkenine Tax_query eklenir, yalnızca kullanıcı arama filtresi onay kutusundaki terimi seçerse. Aynı şekilde, özel alanların özel aramayı daha da daraltmak için bir arama filtresi olarak nasıl kullanılabileceğini görelim. Yukarıda gördüğünüz video yayın türü için özel alanda gelişmiş bir özel alanla yapılan özel bir meta veri kullanarak bir arama filtresi oluşturma, premium ACF sürümü ile sağlanan grup alanı türü kullanılarak yapılır. Özel bir dil ve süreyi gerilimin bir listesi olarak kullanmak için, her şeyden önce benzersiz değerlerini ayıklamak zorundayım. Bunu başarmak için, benzersiz diziyi özel alan türlerine göre geri yükleyen ACF get_field_object () işlevini kullanıyorum.
ACF’den get_field_object () işlevi tarafından döndürülen veri nesnesini kontrol edin Hata ayıklayıcı burada çok yararlı olacaktır, çünkü büyük bir dizide gereken alanların tanımlanması sıkıcı olabilir. İhtiyacım olan bilgilerin dizi seçeneklerinde mevcut olduğunu belirledikten sonra, SELECT HTML öğesi için işaretleme yapabilirim. Çekirdek 42E915395DFFCEA55936557DA861F331
Tarih aralığı için arama filtresi JQuery UI DatePicker kullanılarak yapıldı. Ayrıntıları tartışmayacağım, ancak burada arama filtresi için tüm kodlara başvurabilirsiniz. Özel bir alan kullanarak meta_query gönderimi, Meta_Query parametresini wp_query’den ayarlamanızı gerektirir. Tax_query’ye benzer özel bir düzlem kullanarak göndermek için dinamik bir meta_query yapmak, meta_query parametreleri de dizileri alabilir, burada meta verileri temsil eden her dizinin anahtar çiftler/değerler biçiminde. Burada, kullanıcı tarafından seçilen özel alan türüne dayanarak, bir meta_query hattı yaparım. 19Ab4bcf48e8aa44aaba35cc80fd0fb5’in çekirdeğini içerir
Yukarıdaki özde, operatörü Menguii ile tarih aralığı arasında karşılaştırın. Bu çalışır şekilde, tarih YYYY-MM-DD’de saklanmalı ve ayrıca karşılaştırma çalışması için JQuery UI DatePicker tarafından aynı formata döndürülen bir tarih dönüşümü gerektirir. Not: Örneğimde, taksonomi ve özel alanlar her türlü gönderide paylaşılmadığından, yalnızca arama filtresi kullanılırsa iade edilecek video gönderi türüne göre gönderilir. Filtre düğmesini Arama Sonuçlarına Ekleyin Arama Formu Kullanıcısının kullanımını ve deneyimini artırmak için, Sıralama düğmesi ve filtre gibi özellikler genellikle uygulamada kullanılır. DOM’u çok iyi sıralama ve filtreleme işini yapan popüler izotop.js kütüphanesini görmenizi öneririm. Aşağıda, jQuery ile görüntülenen diğer arama sonuçlarını filtrelemek için HTML düğmesini kullanan kaba bir örnek verilmiştir. Alt filtre düğmesini arama sonuçlarına ekleyin Bu işlevi yapmak için, seçilen taksonomi terimine göre HTML düğmesini eklediğim WordPress döngüsünü ve ayrıca öğeler listesinden sınıf özniteliğine taksonomiyi kullanıyorum.
Çekirdek yükleme FE39C11FEA5DA4380FA8278247069231
Filtre düğmesi ile arama sonuçlarını oluşturacak tüm kodlar referanslar için burada bulunur. Bonus Kodu: LightBox Capital’de Arama Sonuçları İçerme Video arama için vaka çalışmam, arama sonuçlarında döndürülen videoyu yüklemek için bir mekanizma olmadan tamamlanmayacaktır. Burada, sermaye iletişim kutusundaki arama tarafından döndürülen videoları yüklemek için jQuery ColorBox kitaplığını kullanıyorum.
Sermaye iletişim kutusundaki arama sonuçlarından video yükleme ColorBoxUrl ve yukarıda gördüğünüz özel alanlardan çıkarılan video kredileri.
Yükleme Çekirdeği 9268620A803F9868E94916025756e91
Sermayede kredi görüntülemek için HTML veri öznitelik verilerini kullandım, ancak bu yaklaşımla istediğiniz her şeyi yükleyebilirsiniz. 7f314fb6c6bc8ef1df1d255f8a7c0441’in özünü içerir
Burada birçok şeyi tartıştık ve umarım bu makale sizin için yararlıdır.İnanılmaz bir gelişmiş arama sayfası oluşturmak için arama eklentimi ve vaka çalışmaları örneklerini kullanmaktan çekinmeyin.
Sitenizde özel bir arama kullanıyor musunuz?Bize aşağıdaki yorumlarda anlatın.
Etiket:
Özel Taksonomi Arama
Özel Gönderi Türleri Bulun WordPress Devam Etme
