Gelişmiş Özel Alanlarla Yapabileceğinizi Bilmediğiniz 7 Şey

Gelişmiş Özel Alanlar (ACF), WordPress geliştirme ile neredeyse eş anlamlıdır. 4,5 milyondan fazla siteye güç sağlayan bu eklenti, WordPress'in yeni zirvelere ulaşmasına yardımcı oldu. Eklentiyi biliyorsunuz. Muhtemelen eklenti ile oluşturmuşsunuzdur. Ama bundan tam olarak yararlanıyor musunuz?

Bu oturumda, şimdiye kadarki en dinamik, güçlü ve ilgi çekici WordPress deneyimlerinizi oluşturmak için ACF'den yararlanabileceğiniz daha az bilinen yollardan bazılarına hızlıca göz atacağız.

Konuşmacılar:

• Iain Poulson, WP Engine Kıdemli Ürün Müdürü
• Rob Stinson, WP Engine'de Ürün Pazarlama Müdürü

Oturum Slaytları:

Deşifre metni:

Iain Poulson: Merhaba, Gelişmiş Özel Alanlar eklentisiyle ilgili oturumumuza hoş geldiniz. Ben WP Engine'de ACF Ürün Müdürü Iain Poulson ve Ürün Pazarlama Müdürümüz Rob Stinson da burada. Bugün, Gelişmiş Özel Alanlar eklentisi ile yapabileceğinizi bilmediğiniz, oldukça yeni olan ve daha az bilinen bazı şeylerden oluşan yedi şeyi oldukça hızlı bir şekilde ele alacağız. Ve Rob'un tasarladığı hayali bir sitenin etrafında toplayacağımız işlevsellik, yani biz temelde soyut şeylerden ziyade gerçek örneklerin hayranlarıyız, ama aynı zamanda filmlerin de büyük hayranlarıyız.

Yani bu site sinemanın en iyi dönemini, muhtemelen 90'ların filmlerini kutlama amaçlıdır ve bu nedenle site 90'ların en popüler ve en sevilen filmlerini tanıma ve ödüllendirme üzerine kuruludur. Sitenin filmleri sergilemesi ve kullanıcıların favorileri için oy kullanmasına izin vermesi gerekiyor ve gerçek Rob tarzında site harika görünüyor. Öyleyse başlayalım ve en baştan başlayalım ve ACF'yi yükleyelim. Bana nasıl olduğunu söyle Rob.

ROB Stinson: Harika, teşekkürler, Iain. Evet, teşekkürler dostum. Oldukça iyi görünüyor, değil mi? Tasarlarken biraz zaman geçti, biraz eğlendim. Yani sözleşmeyi kazandık. Projeyi aldık ve işleri başlatıyoruz ve yaptığımız ilk şey, bunun ACF için öncelikle mantıklı olup olmadığını belirlemekti. Bazı özel gönderi türleri için bir sürü özel alan ayarlamamız ve bazı ilginç şablonlar ve bunun gibi şeyler yapmamız gerekecek. ACF, buradaki iş için bir araçtır. Tabii ki, önce ACF'yi kurmamız gerekiyor ve bu burada bir numara. Bu nedenle, genellikle eklentiyi bir zip dosyası olarak alıp WordPress yöneticisine güzel ve basit bir şekilde yükleyebileceğinizi biliyoruz.

Bir eklenti kurmanın standart yolu budur, ancak bugünlerde geliştiricilerin bağımlılıklarını biraz farklı şekilde yönetmeyi sevdiklerini de biliyoruz. Bunu genellikle kod içinde ve genellikle Composer ile yapılan PHP dünyasında yönetmeyi seviyorum. Artık Composer ile bir süredir WordPress.org deposundan WordPress eklentilerini oldukça kolay bir şekilde yükleyebiliyorsunuz, ancak ACF Pro gibi premium eklentilerle bunu yapmak biraz daha zor.

Ancak birkaç hafta önceki en son sürüm, aslında yaklaşık bir ay önce, ACL Pro'yu şimdi Composer aracılığıyla yükleme yeteneğini etkinleştirdik, bu harika, bu yüzden bunu hemen şimdi yapacağız. Bunu nasıl yapacağınız, bir numaralı adım, besteci.JSON dosyanıza ACF Pro Composer Repo URL'sini eklemeniz gerekir. İkinci adım, kimlik bilgileriniz için bir auth.JSON dosyası oluşturacaksınız ve bunu hem yerel olarak hem de dağıtım yaptığımız yere giderken projenizin kök dizinine yerleştireceksiniz. o dosya için ihtiyacınız olan kimlik bilgileri artık advancecustomfields.com'daki hesap alanınızda mevcuttur.

Yani oturum açarsanız, bir lisanslar alanı göreceksiniz ve birkaç ekstra sekme ve bunun gibi şeyler var, aslında tüm kod yığınını alabilir, her şeyi kopyalayıp yapıştırabilir veya bireysel kullanıcı adını alabilir ve parolayı girin ve oluşturduğunuz auth.JSON dosyasına getirin.

Ve üçüncü adımda, Composer komutunu çalıştırıyoruz, yani bu güzel ve kolay, 3 adımlı bir süreç, ama harika çünkü bu, dediğim gibi, nasıl yapılacağı üzerinde biraz daha ince ayarlı kontrole sahip olmayı seven geliştiricilerin olduğu anlamına geliyor. projelerinin bağımlılıklarını yönetiyorlar, şimdi bunu ACF Pro ile yapabilirsiniz, ki bu harika. Elbette bununla ilgili daha fazla belge var, bu yüzden daha derine inmek ve paketlerinin nasıl açıldığını görmek için web sitesindeki belgelere atlayın ve hazır olmalısınız. Harika, iki numara için Iain'e kusacağım.

Iain Poulson: Pekala, şimdi site için verileri ayarlama hakkında konuşalım. Özel gönderi türleri, yalnızca gönderiler veya sayfalarla ilgili olmayan bir siteyi nasıl oluşturacağınız konusunda WordPress'te oldukça temeldir. WordPress sürümü ne olursa olsun gelen özel yazı tipi özelliği, onu uygun bir CMS'ye dönüştürür ve genellikle geliştiricilerin siteleri oluştururken yaptıkları ilk adımdır. Ve bu her zaman ACF dışında olan bir şey olmuştur. Tarihsel olarak, ya bir gönderi türünü kodla kaydedersiniz ya da bunu yapmak için başka bir eklenti kullanırsınız, ancak bu, yolculuğun ACF ile oldukça iyi bağlanan kısmıdır. ACF 6.1'in bir parçası olarak, bu işlevsellik eklentiye geliyor, yani bu, yolculuğun doğal başlangıç ​​noktası.

Veri yapısı verileriyle bir site oluşturmak istiyorsunuz, bir gönderi türü oluşturacaksınız. Ona alanlar ekleyeceksiniz ve ardından bazı taksonomiler ekleyebilir ve ardından bu verileri düzenlemeye başlayabilirsiniz. Yani evet, bu 6.1'e koyduğumuz bir şey ve CMS'de bu tam bina akışına sahip olmak oldukça heyecan verici. Öyleyse VHS ödül sitesini arayalım. Verilerimizi yapılandırmamız ve WordPress'in ihtiyacımız olanı yapmasını sağlamamız gerekecek, bu nedenle gönderi türü açısından, gönderileri ve sayfaları kullanmak istemediğimiz için özel bir gönderi oluşturacağız. film verilerini, veri nesnesini veya veri modelini depolamak için film için yazın, ancak açıkçası WordPress açısından, bu özel bir gönderi türüdür.

Kullanıcıların bir türdeki filmleri kolayca görmelerini sağlamak için filmleri bir taksonomiye göre sınıflandırmak istiyoruz ve ardından kolay ön uç görüntülemeye, belirli türdeki filmlere erişmenizi sağlayan basit URL'lere sahip olacaksınız. türler Yapılandırılmış verileri bir film etrafında depolamak için bazı fazladan alanlara ihtiyacımız olacak, bu nedenle, örneğin, yönetmenin bir metin alanı olmasını istiyoruz. Bir sayı olarak filmin çıktığı yıla ihtiyacımız olacak ve filmleri birbiriyle ilişkilendirmek için bir tür ilişkiye ihtiyacımız olacak ve tabii ki alacağı oy sayısını saklamamız gerekiyor. ve bu sayı alanıdır.

Öyleyse ACF 6.1'de bunu nasıl yapacağımıza hızlıca bir göz atalım. Bu ACF 6.1 ekranı ve biraz farklı olduğunu fark edeceksiniz, kenar çubuğunda menü var. Artık ACF, sadece özel alanlar değil ve bu yazı tipi ekranı. Yani bu sadece film gönderi türünü ayarlıyorum. Buradaki en basit iş akışı, yazı tipi için film, çoğul etiket olan tekil bir etiket eklemek ve otomatik olarak yazı tipi anahtarını oluşturuyor. Genel ayar varsayılan olarak ayarlanmıştır çünkü ön uçta, yazı tipinde görünmesini istiyorum ve bunu yöneticide düzenleyebilmek istiyorum.

Bu bir kez kaydedilip eklendikten sonra, buradaki ACF ile bağlantının güzel yanı, yolculuktaki bir sonraki adımın, gönderi türünü oluşturduğumuz gerçeğidir, gönderi türüne alan eklemek istiyor muyuz, yoksa istiyor muyuz? mevcut alanları gönderi türüne bağlamak veya bir taksonomi oluşturmak için? Yani hepsini buradan itibaren yapabiliriz, bu yüzden ve açıkçası gidip bu alanları eklememiz gerekiyor. Tamam, film gönderi türüne yeni alanlar eklemek için bu bildirime tıkladığınızda, Alan Grubu Düzenleyicisini alırız ve ayarlar Meta kutusunun alt kısmında önceden doldurulmuştur.

Böylece konum kuralları, filmin gönderi türünü düzenlerken bu alanları gösterecek şekilde zaten ayarlanmıştır ve ardından devam edip alanlarınızı ekleyebilirsiniz, burada ekran görüntüsünde zaten yaptım. Yani elimizde yönetmen, yıl, oylar ve ilgili filmler var. Sonra tabii ki bahsettiğimiz özel taksonomiyi tür ekleyerek ve tür taksonomisini filmlerin post tipine bağlayarak kaydedebiliriz. Ancak bunlar, film nesnesine iliştirilmiş olarak eklediğimiz alanlardır, ancak daha genel veya site çapında olabilecek verileri depolamak için ihtiyaç duyduğumuz alanlar ne olacak? Rob, bunun için elimizde ne var?

Rob Stinson: Harika, bunun için teşekkürler Iain, iyi görünüyorsun. İçerik modelimiz güzel bir şekilde ilerliyor, ancak henüz işimiz bitmedi. Şimdi ACF Pro'yu Composer aracılığıyla yüklemeyi zaten ele aldık ve ACF'deki özel gönderi türlerine ve özel taksonomilere baktık. Şimdi bu iki şey çok, çok taze, ama şimdi ele almak istediğim üçüncü şey, bu eski ama güzel bir şey. Ve bu, oldukça uzun yıllardır eklentide bulunuyor, ancak herkes bunu bilmiyor ve herkes bunun değerini tam olarak anlamıyor, bu yüzden şimdi seçenekler sayfasıyla küresel alanlara bakacağız.

Artık tipik olarak, özel bir alan ve bunun belirli bir gönderi, sayfa veya özel gönderi türü için verileri nasıl depoladığını düşünürsünüz. Ancak bazen site çapında ilişkili verileri depolamamız gerekir ve harika VHS ödülleri sitemizde bu tür bir üst bildirim veya promosyon çubuğu buna harika bir örnektir. Ve bu, sitenin Ana sayfasının her bir sayfasında kalıcı olmasını istediğimiz bir çubuktur, bir film sayfasına gidersiniz, oradadır. Hakkında sayfasına veya bir İletişim sayfasına veya bir Blog sayfasına gidersiniz, bu küçük çubuk, kullanıcı nereye giderse gitsin tüm site boyunca oturur, bu nedenle ilgili verileri bir gönderi veya bir gönderiyle ilişkilendirmek mantıklı değildir. film.

Bu, siteyle ilişkilendirilmesi gereken bir şeydir. Bu çubuğu açıp kapatabilmek istiyoruz çünkü bir şeyler ayarlamak istiyoruz, ama belki de bunu yılın belirli zamanlarında açmak isteyeceğiz. Belirli bir promosyonumuz veya kampanyamız olabilir, bu yüzden bir Boole alanına sahip olmak istiyoruz, böylece bu şeyi açıp kapatabiliriz. Ayrıca, çağrılan eylemin metnini veya düğmedeki metni güncelleyebilmek istiyoruz, bu nedenle elbette özel alanlar bunun için çok anlamlıdır.

Şimdi bir seçenekler sayfası kurmak için, ACF içinde bunu yapmamızı sağlayan özellik budur, bir numaralı adım, tipik olarak işlevlerinizde, .PHP dosyasıdır veya tabii ki onu başka bir yere, belki bir yere kaydedebilirsiniz. geliştirmekte olduğunuz eklenti. Ancak seçenekler sayfasının kendisini kaydedeceksiniz ve oradaki ayarlarda yapabileceğiniz birkaç küçük yapılandırma var. Tek bir seçenekler sayfanız olabilir, ancak aslında birden çok sayfanız da olabilir ve onları bir şekilde iç içe geçirmiş olursunuz, yani alt sayfalar veya üst sayfalar ve bunun gibi şeyler, böylece ilginç şeyler yapabilirsiniz.

Bizim için, bizimki oldukça basit. Burada sadece bir bildirim çubuğu kuruyoruz, bu yüzden sadece tek bir sayfaya ihtiyacımız var, bu yüzden birinci adım o Seçenekler sayfasını kaydetmek. İkinci adım, normalde yapacağımız gibi, bir alan grubu oluşturacağız. Promosyon çubuğu alanları veya buna benzer bir şey veya bildirim çubuğu alanları olarak adlandırırdık ve burada benim Boole alanım olduğunu görebilirsiniz, yani promosyon çubuğu etkin veya doğru. Ve sonra mesaj için bir metin alanım, buton metni için bir metin alanım, buton bağlantısı için bir URL alanım var ve sonra bir bildirim tipimiz de olabilir, ancak belki de uyarılar veya promosyon tarzı olmasını istiyoruz. bildirimler ve belki de orada seçilene göre bazı ilginç koşullu stiller yaparız.

Böylece alan grubumuzu ekliyoruz ve alanlarımızı ekliyoruz ve üçüncü adım bunun hemen altında. Bildiğiniz gibi, konum kurallarında artık Seçenekler sayfasının eşit olduğunu seçebiliyoruz – ve orada sahip olduğum site ayarlarını görüyorsunuz – bu, bir numaralı adımda kaydettiğim Seçenekler sayfası. Ve tüm bunları yaptıktan sonra, WordPress yöneticisinde artık sol tarafta görüyoruz, yönetici çubuğumuzda Site Ayarları var ve buna tıklıyoruz ve beklediğimiz gibi tüm alanları görüyoruz.

Ve bildirim çubuğunu açıp kapatabiliriz. Metni güncelleyebilir, düğmeyi güncelleyebiliriz ve ardından bu veriler şablonlamamız için kullanılabilir hale gelir ve bu nedenle, bir seçenekler sayfasındaki veri alanlarıyla şablon oluşturma deneyimi, normalde yapacağınızla büyük ölçüde aynıdır. Bunun bir gönderi değil, bir Seçenekler sayfası olduğu gerçeğini özellikle nasıl hedeflediğinizle ilgili birkaç küçük nüans var, ancak advancecustomfields.com'daki belgelere atlayın ve bununla nasıl başa çıkacağınız konusunda size yol gösteriyor. Dört numara, sana geri göndereceğim, Iain.

Iain Poulson: Teşekkürler Rob, evet. Şimdi alanları programlı olarak ACF'ye nasıl kaydettiğimiz hakkında konuşmak istiyorum. Dolayısıyla, ACF'de alanlar oluşturmak, daha önce gördüğümüz ve sevdiğimiz türden bir şey olan Field Editor kullanıcı arabirimi ile çok kolaydır, ancak alanları tanımlamanın başka yolları da vardır. ACF, hem JSON hem de PHP dosyalarını alan tanımlarıyla dışa aktarmamıza izin verir ve bu, alanlar oluşturmak için kullanılabilir.

Ama aslında, ACF topluluğunda ACF oluşturucu adlı bir paketin olduğunu biliyor muydunuz? Bu aslında bir üçüncü taraf paketidir ve adı StoutLogic'ten ACF Builder Paketi'dir. Evet, GitHub bağlantısı orada. Temel olarak, ACF'nin PHP'deki alan verilerine nasıl ihtiyaç duyduğunun inceliklerini bilmeden doğrudan koddan alanlar oluşturmanıza olanak tanır. Bunu yapmanın gerçekten bir tür ifade edici yolunu kullanıyor. Yeniden kullanılabilir ve taşınabilir hale getirir.

Alan tanımlarını teslim edebilirsiniz çünkü sürüm kontrolünüzdeki PHP dosyalarıyla işbirliği yapmak kolaydır. Dağıtım mekanizmanıza göndermek kolaydır ve ayrıca Alan Grubu düzenleyici kullanıcı arayüzünü de ortadan kaldırırsınız, böylece bu alanları kodda tanımlarsınız ve böylece istemcilerin kullanıcı arayüzüne dokunmak zorunda kalmazlar, bu yüzden nasıl yaptığımıza hızlıca bir göz atalım yap. Kurmak için, çünkü bu bir paket – Composer hakkında daha önce konuşmuştuk. Bu, aşağıdaki komutla kurabileceğiniz bir Composer paketidir: Composer StartLogic'i, satıcıyı, ACF Builder'ı edinir ve ardından kod böyle görünür.

Fields Builder'ın bir örneğini oluşturuyorsunuz ve ona saha grubunun ne olacağı konusunda bilgi veriyorsunuz. Ve sonra, bu alan grubuna, Direktör adında bir metin alanı ekleyelim diyorsunuz. Yıl adında bir sayı alanı ekleyelim ve daha da önemlisi, alan grubunun filmin yazı tipinde görüneceği konumu ayarlayacağız.

Ve tüm bunlar, siz düşünmenize gerek kalmadan sizin için çok şey yapar, bu yüzden ona saha etiketi için yönetmen adını verirsiniz ve o devam eder ve açıkçası, siz olmadan saha için sümüklü böcek veya anahtar yaratır. bunu eklemek, çok fazla yazmayı, çok fazla düşünmeyi ve birçok hataya açık oluşturmayı ortadan kaldırır. Ve ikinci kısım, bu alan tanımını ACF'ye yüklediğiniz yerdir ve alan grubunu sizin için oluşturur.

Rob Stinson: Pekala, burada 5 numara, çift yönlü ilişkiler. Şimdi, bu ilginç. Sanırım ajans günlerimde üzerinde çalıştığım ve bunu gerçekten anladığım bu özel projeyi hatırlıyorum ve bu bir tür ezber bozan şeydi. Bu, ACF ile daha önce yaptığınız bir şey değilse, dikkat edin, çünkü bu gerçekten yararlı bir şey, o yüzden bir örneğe bakalım. Elbette VHS ödülleri sitemize baktığımızda, 100 filmden oluşan bir listemiz var ve açıkçası bunları birbirine bağlamanın farklı yolları var.

Daha önce türe özel taksonomimiz vardı. Etiketler veya gruplandırma gibi şeyleri ele alan birkaç farklı alanımız olabilir, bu nedenle iki gönderi veya bizim durumumuzda iki film arasında belirli bir tür iki yönlü bağlantı oluşturmak istediğinizde çift yönlü ilişkiler kullanışlıdır. Örneğimiz için, diyelim ki veritabanımızda bu üç film var ve hepsi animasyon, bu yüzden onlarla çift yönlü bir ilişki oluşturmak istiyoruz.

Şimdi bunun anlamı, diyelim ki ilk filmimiz "Oyuncak Hikayesi" harika filmimiz ve bununla ilişkilendirmek istediğimiz ilgili iki film daha olduğunu belirledik. Böylece, özel yazı tipimiz olan filmler için bir İlişki Alanı oluşturabiliriz ve orada bir İlişki Alanımız olur ve "Aslan Kral" filmini ve Princes Monon'u seçerdik. Çok üzgünüm. Bu kelime üzerinde tökezlemeye devam ediyorum. Onu kesiyorum ama filmin adı "Prenses Mononoke". Ha, ha, ha. Lütfen benden nefret etme. Nedense bu kelimeyi telaffuz etmekte zorlanıyorum.

Ve bu iki filmin birbiriyle ilişkili olduğunu tespit edip, İlişki Alanından onları seçiyoruz. Şimdi bu örnekte, evet, örneğin "Aslan Kral"ın "Oyuncak Hikayesi" ile ve dolayısıyla "Oyuncak Hikayesi"nin "Aslan Kral" ile ilişkili olması mantıklı olacaktır. Yani normalde "Aslan Kral" düzenleme ekranına giderdik ve sonra "Oyuncak Hikayesi"ni bulurduk ve onu oraya eklerdik ama orada işimizi ikiye katlıyoruz. Yani çift yönlü bir ilişkinin yaptığı şey, bizim için o bağlantıyı otomatik olarak oluşturmasıdır ki bu gerçekten çok faydalıdır.

Örneğin, "Oyuncak Hikayesi"ne "Aslan Kral"ı eklediğimizde, "Oyuncak Hikayesi" otomatik olarak "Aslan Kral"a eklenir ve bu gerçekten çok faydalıdır. İçerik oluşturucular ve içerik yöneticileri için çok zaman kazandırır. Unutma riskini azaltır veya belki bir gönderiden birini kaldırırken diğerinden kaldırmayı unutabilirsiniz. İçerik düzenleme deneyimini gerçekten çok basitleştiriyor, yani özellikle bunun gibi ilginç sitelerde kullanılabilecek gerçekten yararlı bir şey. Peki bunu nasıl yapacağız? Pekala, şu anda bunu yapmanın iki yolu var ve üçüncü bir şeyden bahsedeceğim, belki bu, bu yıl daha sonra raydan çıkacak.

Nasıl yapılır, birincisi, bunu kodla yapabilirsiniz. ACF Pro eklentisi yüklendiğinde, bunu yapmak için kod yazabilirsiniz. Ve ACF Güncelleme Değeri Filtresine bağlanan bir işlev yazabilirsiniz ve bu filtre bir değer kaydedilmeden önce çalışır ve temel olarak yaptığı şey, düzenlemekte olduğunuz mevcut gönderiyi kapar ve gönderinin gönderi kimliğini tanımlar. bu eklendi ve ardından diğer gönderiyi güncelliyor ve arka planda bu tür bir eşleştirmeyi sizin için yapıyor, bu çok yararlı.

Biraz kod, bu konuda rahat olduğunuz sürece, çok ağır bir şey değil. Ancak yine de, bunu nasıl yapabileceğinizi görmek için Gelişmiş Özel Alanlar belgelerinde kontrol edebileceğiniz bir bağlantı veya bir URL var. Yine de ikinci seçenek, kod olmamasıdır, ki bu bazen hoş bir şeydir. Yani bu aslında ACF Extended adlı bir ekosistem eklentisidir. WordPress.org'da mevcuttur ve yaptığı şey, bu özelliği ACF kullanıcı arayüzünün kendisine getirmektir.

Bu nedenle, ACF Extended adlı bu uzantıyı yüklediyseniz ve ACF Pro'yu yüklediyseniz, bir İlişki Alanı oluşturduğunuzda, açabileceğiniz çift yönlü bir düğmenin olduğu bir seçenek göreceksiniz ve ardından şunları yapabilirsiniz: bunu, oldukça kullanışlı olan kullanıcı arayüzü içinden bir koleksiyona kurun. Şimdi bu projede işler gerçekten ilginç bir şekilde ilerliyor, ama bununla kafamızı kaybetmeyelim, yoksa yapmalı mıyız? Iain, sana kalmış.

Iain Poulson: Evet, teşekkürler Rob. ACF söz konusu olduğunda başsız demeye değer. ACF'nin başsız desteği var, yani evet, başsız sitelerin altında, sitelerin ayrıştırılmış doğası var. Devam eden çok sayıda API iletişimi var ve ACF'nin API desteği var. 5.11 veya 5.11'den itibaren yerel olarak ACF'ye eklediğimiz REST API ve WP GraphQL için bir ACF eklentisine sahip olan WP GraphQL eklentisi ile GraphQL'yi destekliyoruz, bu nedenle ACF başsız siteleri destekliyor. Uygun başsız WordPress siteleri için WP Engine Atlas programı ile entegrasyona sahiptir, ancak VHS WordPress sitemizdeki verileri nasıl alacağınıza ve onu ayrıştırılmış bir şekilde nasıl kullanacağınıza dair gerçek bir dünya örneği hakkında konuşalım.

Örneğin – beni dinleyin – insanlar temelde VHS ödül sitesinde oy veriyorlar ve onlar – sanırım keyfi bir tarih koyduk – belirli bir tarihin sonuna kadar oy vermeleri gerekiyor ve biz En popüler olanı görelim. Yerel sinemamız var ve en çok oylanan 90'ların filmlerinin çift faturasını yapıyor. Yani sinemada kendi reklam panoları var ve bu internette. Web'e bağlı ve o reklam panosunda gösterilenleri dinamik olarak çalıştırabiliyoruz, bu yüzden WordPress sitemize bağlanmamız gerekiyor.

Örneğin, reklam panosu basit bir düğüm uygulamasıdır, verileri VHS sitesinden almamız gerekir, bu yüzden bunu özel bir REST API uç noktasıyla nasıl yapabileceğimize hızlıca bir göz atalım ve daha önce de söylediğim gibi, GraphQL desteği var. Her iki şekilde de yapılabilir, ancak bu muhtemelen gösterilmesi daha basit bir örnektir. Her şeyden önce, temel olarak ihtiyacımız olan verileri alan bir işlev yaratacağız, bu yüzden sadece bunun üzerinden geçerek, bu bir WP sorgusu, yani filmler istiyorum veya bir tür film türü yayınlıyorum, ama ben sadece iki tane istiyorum Ama aynı zamanda ACF Alanına göre sıralamak istiyorum, bu alan adı oylardır ve onu azalan bir düzende sıralıyoruz, bu yüzden en tepeye çıkacağız ve en tepeye çıkacağız. iki.

Ardından, önceki slaytta oluşturduğumuz geri arama işlevini kullanan özel bir REST uç noktası oluşturacağız ve bu bize gidip iki filmi almak için vurabileceğimiz bir uç nokta verecek. Yani bu gerçekte nasıl görünüyor – ve bu sadece test – yani URL vhsawards.com, WP-JSON ve sonra API'yi değiştirmek istememiz ihtimaline karşı ona VHS Sürüm 1'in bir ad alanını verdik ve çok basit bir popüler URL yapısına sahibiz.

Ve bu sadece iki öğeli bir JSON nesnesi döndürmek, en çok oy alan iki tanesi, ki bu da oldukça iyi olan "Dövüş Kulübü" ve "Goodfellas" oldu, yani evet. Bu, ACF'nin ayrık ve kafasız sitelere nasıl güç verdiğini göstermek için kesinlikle iyi, ancak şu anda bloklardan bahsetmeden WordPress hakkında konuşmak oldukça zor. Bloklardan bahsetmeden bu kadar yol kat ettiğimize inanamıyorum. Bunu değiştirmek için elimizde ne var Rob?

Rob Stinson: Kesinlikle bloklar hakkında konuşmamız gerekiyor. Bunu yapmadan önce, çift yönlü ilişkiler etrafında beş numaraya bakarken, bunu yapmanın üçüncü bir yolunu ima ettiğimi fark ettim. Bunu ele almadım, bu yüzden tek söylemek istediğim bu alanı izlemek çünkü eklentinin kendisine yerel olarak daha iyi çift yönlü ilişki desteği eklemeyi planlıyoruz, yol haritamız var, böylece bu şeyleri kolaylaştırabilirsiniz. ACF eklentisi içinde üçüncü taraf öğelerine ihtiyaç duymadan, bu yüzden zamanlama taahhüdü olmadan sadece bu alanı izleyin. Bu, baktığımız bir şey.

Yani yedi numara, evet. ACF ile özel bir blok oluşturmaya bakalım. Artık çoğu insan bunu şimdi ACF'de yapabileceğinizi biliyor, ancak herkesin denemesi gerekmez. Dolayısıyla, o kamptaysanız ve uzun süredir ACF kullanıcısıysanız ve şu anda özel blok işlevini kullanmadıysanız, bunu izleyin, çünkü bu özellikteki değeri görmenizi isteyebilir. Peki bunu VHS Ödülleri için nasıl kullanacağız? Belki de sitemiz için çeşitli yerler ekleyebileceğimiz bir blok bileşenine sahip olmak istiyoruz ve bu, özel bir bloğun veya herhangi bir bloğun güzelliği, kullanılabilmesi ve sitedeki sayfalara ve gönderilere yerleştirilebilmesi ve istiyoruz. özel bir harekete geçirici mesaj bloğu oluşturmak için.

Şimdi bu oldukça basit bir blok ve özel bloklarla kesinlikle daha ilginç şeyler yapabilirsiniz. Şimdi basit tutacağız. Ancak bu mavi banner, Action Block'a çağrı, Ana sayfaya veya belki bazı blog gönderilerine ve bunun gibi şeylere yerleştirebilmek istiyoruz, okuyucuları ve site ziyaretçilerini bu düğmeyi tıklamaya ve devam etmeye teşvik etmek istiyoruz. en sevdikleri 90'lar filmi için oy verin. Peki bu özel bloğu ACF ile nasıl oluşturacağız? Ve bunu özel bir blok olarak yapmamızın nedeni, benzersiz bir tasarıma sahip olmasıdır.

Bu yinelenen nokta deseni için devam eden ilginç bir arka plan gradyanı var ve bunu bize veren o ince ayarlı kontrolle özel blok olarak oluşturmanın, belki de kapalı olan bloklarla yapabileceklerimize kıyasla bizim için daha kolay olduğunu fark ettik. WordPress çekirdekli raf. Peki bunu nasıl yaparız? Birinci adım, özel bloğumuzu, tipik olarak functions.PHP'de veya bu tür bir kodu yazdığınız her yerde kaydettirmektir. Güzel ve basit ve şablon dosyalarının nihai olarak özel bloğumuz için olacağı dizine işaret ediyoruz, yani bu bir numaralı adım.

İkinci adım, alan grubumuzu oluşturuyoruz ve alanlarımızı ekliyoruz. Dolayısıyla, Çağrılan Eylem bloğumuz için metin, düğme metni, düğme bağlantısı ve arka plan rengine de sahip olmak istiyoruz. Belki de bunun için stilde bazı varyasyonlar seçeneği vermek istiyoruz. Üçüncüsü, konum kurallarında bloğu seçeceğiz ve eşittir diyeceğiz ve CTA bloğunu daha önce kaydettik ve bu yüzden kullanılabilir. o açılır listede bizi orada. Şimdi şablon dosyamıza geçiyoruz, böylece tüm alanlar ve her şey ayarlandı ve şimdi şablonlamamızın bir kısmını yapacağız. Şimdi, şablon oluşturma, belki de geleneksel olarak ACF ile şablon oluşturma yönteminizden bazı açılardan farklıdır.

Ancak diğer birçok yönden, çok, çok benzer, bu nedenle geliştirmeniz için tipik olarak kullandığınız kalıpların çoğu, özel bloklarınızı oluştururken kullanacaksınız ki bu harika. Bu yüzden projemizde bunun bizim özel temamız olduğunu söyleyeceğiz. Bir blok dizinimiz var, sonra kaydettiğimiz blokla eşleşen bir CTA dizinimiz var ve sonra tipik olarak üç şablon dosyanız olur, bizim HTML işaretlememiz olan block.JSONsomething.PHP ve ardından bizim için nokta CSS. stil.

Bu, JSON blok tipidir ve bu, bloğu bir şekilde kaydettiğimiz yerdir, ancak bu şekilde işleri biraz daha anlayabiliriz ve burada yapılandırma ve çeşitli yerel Çekirdek özellikleri hakkında yapabileceğiniz çok şey vardır. açıp kapatabilir, özel bloğunuz için kullanılabilir hale getirebilirsiniz. Bu nedenle, kesinlikle bununla ilgili belgelere bakın ve ne yapılabileceğini anlayın, çünkü burası gerçekten, dediğim gibi, bu bloğun nasıl kullanılabilir hale getirileceğini ve görüntüleyebileceğiniz ve geçebileceğiniz temel özellikleri, özellikleri yapılandırabileceğiniz yerdir. özel bloğunuza.

Daha sonra şablon dosyamız, PHP dosyamız var ve burada gördüğünüz gibi, Get alanıyla etkileşime giren, oradaki alan verilerimizle etkileşime giren değişkenleri ayarlıyorum, oradaki stilimizde biraz çok basit koşullu mantık, ve sonra bloğumuzun kendisi için HTML'miz. Ve sonra CSS'den geçmeyeceğim. CSS'nin ne olduğunu biliyorsunuz ve eminim burada yazdıklarımdan daha iyi CSS yazabilirsiniz, ama fikri anladınız. Bloğunuzun stili için bir CSS dosyanız var ve yazı tipleriyle ilgili bazı ilginç şeylerimiz olduğunu ve bu tür nokta arka planı için radyal, gradyan arka planımız olduğunu görebilirsiniz, ki bu oldukça eğlenceli.

Ancak yine, bu özel bloğu oluşturmamızın nedeni, CSS'imize, stilimize gerçekten ince ayar yapmasını istememizdir, böylece üzerinde çalıştığımız tasarımı gerçekten uygulayabiliriz. Ve bunun Editör'de nasıl göründüğünü size göstermek için, görebilirsiniz, Called Action bloğumuzu seçebiliriz, geniş ışık açabilirsiniz. Alanlarımızla etkileşim kurabiliyoruz, metin ve düğme için metin ekleyebiliyoruz ve düğme için bir bağlantı da ekleyebiliyoruz ve bu, içerik editörlerimize geçebileceğimiz çok hoş görünümlü bir özel blok.

Iain Poulson: Evet, teşekkürler, Rob. Ne güzel bir manzara. Bunu gerçekten hayata geçirmemiz gerekiyor. Bu harika. Tamam, bugün konuştuklarımızın üzerinden geçelim. ACF Pro'yu Composer ile nasıl kuracağımızı inceledik. ACF'de özel gönderi türlerinin ve taksonomilerin nasıl kaydedileceğinden bahsettik. Bir seçenekler sayfasıyla küresel veya site genelindeki alanları kaydetmeye baktık ve alanları bir paketle programlı olarak kaydetmenin farklı bir yolunu inceledik.

Rob, ilişkileri ve çift yönlü ilişkilerin nasıl yaratılacağını derinlemesine inceledi. ACF ile başsız konusuna değindik ve Rob şimdi biraz PHP, HTML ve CSS dışında neredeyse hiçbir şey içermeyen ve hiç tepki vermeyen ACF ile özel bir blok yaratmanın harika bir örneğini yaptı, yani bu gerçekten iyi. Bu harikaydı, Rob. Oylar nedir? Ne olarak çıktık?

Rob Stinson: Bak, benim için mesele şu: 90'ların en iyi filmi tartışmasız Robin Williams'ın “Hook”u. Bunda benim için çok fazla nostalji vardı, o filmi seviyorum. Ya sen, Iain?

Iain Poulson: Benim için Kevin Costner'ın “Robin Hood, Prince of Thieves” filmi olmalı. Bu bir klasik. Kötü saçları, kefalleri, İngiliz aksanı bile olmayan tehlikeli İngiliz aksanını unutun. Bu, tüm zamanların en iyi Robin Hood filmi ve bu, üzerinde ölmeye hazır olduğum bir tepe.

Rob Stinson: Ha, ha, hayır, yeterince adil. Bakın, takıldığınız için teşekkürler millet. Umarım bir şeyler öğrenmişsinizdir ve ACF ile neler inşa ettiğinizi görmek için gerçekten sabırsızlanıyoruz, şerefe.