WordPress Formlarına RGB Renk Seçici Nasıl Eklenir

Bir WordPress renk seçici, web sitesi tasarımınızın basit ama profesyonel bir parçası olabilir. Birkaç dakika içinde nasıl ekleyeceğinizi göstereceğiz!

Harika bir form tasarlamak her zaman kolay değildir. Yazı tiplerini, formatı ve hatta rengi seçmelisiniz. Bunların hepsini manuel olarak yaptıysanız, muhtemelen bunun uzun ve sinir bozucu bir süreç olabileceğini anlamışsınızdır. Ziyaretçileriniz de aynı duyguları paylaşabilir.

Neyse ki manuel form tek seçeneğiniz değil. Basit bir renk seçici, sonuçları görüntülemeyi ve tam olarak istediğiniz rengi bulmayı kolaylaştırabilir. Formunuza bir WordPress renk seçici ekleyerek, ziyaretçinizin web sitenizdeki deneyimlerini de düzenleyebilirsiniz.

Bu makalede, form tasarım öğelerinin neden bu kadar önemli olduğunun birkaç nedenini ele alacağız. Ardından, formlarınıza nasıl renk seçici ekleyeceğinizi göstereceğiz. Hemen dalalım!

WordPress renk seçici tasarım için neden önemli olabilir?

Kendinizi "WP renk seçici nasıl eklenir" diye ararken bulduysanız, bu aracın ne kadar yararlı olabileceğini zaten biliyorsunuzdur. Karmaşık hex kodlarını anlamanıza gerek yok. Bunun yerine, beğendiğiniz gölgeyi işaret edip tıklayabilirsiniz.

Ek olarak, bu tür bir özgürlük, parmaklarınızın ucunda çok çeşitli renk seçeneklerine sahip olduğunuz anlamına gelir. Önceden ayarlanmış bir palet sizi veya kullanıcılarınızı sınırlamaz. Bu, site tasarımınızı hızlı bir şekilde özelleştirebileceğiniz anlamına gelir.

Ancak, bu sadece belirli faydalarla ilgili değildir. Bir renk seçici, sitenizin daha profesyonel görünmesini de sağlayabilir. Bu araç yaygın olarak bilinmektedir. Bu nedenle, teklif vermek, mümkün olan en iyi kullanıcı deneyimini sağlamaya kararlı olduğunuzu gösterebilir.

Son olarak, bir renk seçici eklemek de kolay olabilir. Bir WordPress renk seçici eklentisine bile ihtiyacınız yok. Formidable Forms kullanıyorsanız, bu öğeyi formlarınızdan herhangi birine eklemenin kolay bir yolunu ekledik.

Formlarınıza bir WordPress renk seçici nasıl eklenir

WordPress formlarınıza nasıl renk seçici seçeneği ekleyeceğiniz aşağıda açıklanmıştır!

Adım 1: WordPress renk seçici kodunu yükleyin

İlk olarak, tema dosyalarınızı düzenlemeniz gerekecek. Bu dosyalar web sitenize içeriğinizi nasıl görüntüleyeceğinizi söyler. Bu nedenle, bir WordPress renk seçici oluşturmak için sitenizin kodunu değiştirmeniz gerekecektir.

WordPress kontrol panelinize giderek başlayabilirsiniz. Ardından Görünüm → Tema Düzenleyici'ye gidin:

WordPress'ten, düzenleme yaparken dikkatli olmanız konusunda sizi uyaran bir uyarı alırsınız. Sadece basit bir değişiklik yapacağız. Ancak, daha dikkatli olmak isterseniz, bunun yerine bir Dosya Aktarım Protokolü (FTP) istemcisi de kullanabilirsiniz.

Sağdaki Tema Dosyaları menüsünden functions.php dosyasını seçin. Sayfanın en altına gidin. Ardından, aşağıdaki kodu kopyalayıp yapıştırın:

 function custom_enqueue_color_picker() {
 wp_enqueue_style( 'wp-color-picker' );
 wp_enqueue_script( 'wp-color-picker' );
 }
 add_action( 'wp_enqueue_scripts', 'custom_enqueue_color_picker' );
 function add_default_custom_scripts( $scripts ){
 $scripts->add( 'iris', admin_url( 'js/iris.min.js' ), array( 'jquery-ui-draggable', 'jquery-ui-slider', 'jquery-touch-punch' ), '1.0.7', 1 );
 $scripts->add( 'wp-color-picker', admin_url( 'js/color-picker.min.js' ), array( 'iris' ), false, 1 );
 $scripts->set_translations( 'wp-color-picker' );
 }
 add_action( 'wp_default_scripts', 'add_default_custom_scripts' );

Çalışmanızı kaydetmek için Dosyayı Güncelle'ye tıklayın. Yapmanız gereken tek şey bu olmalı. Yine de, bu değişikliklerin yalnızca mevcut temanız için geçerli olacağını unutmayın.

Temanızı değiştirirseniz, bu adımı tekrarlamanız gerekir. Bunun yerine bu işlem için bir alt tema da kullanabilirsiniz.

2. Adım: Formunuzu oluşturun

Sırada, formunuzu oluşturacaksınız. Mevcut olanı da düzenleyebilirsiniz, ancak bu izlenecek yol için sıfırdan başlayacağız.

Müthiş → Formlar → Yeni Ekle'ye gidin:

Buradan formunuzu oluşturmak için alanlar ekleyebilirsiniz. Basit bir iletişim formundan eğlenceli bir WordPress testine kadar her şeyi yaparak istediğiniz kadar yaratıcı olabilirsiniz. İhtiyacınız olduğu kadar çok veya az alan ekleyin. Bu izlenecek yol için tek bir metin alanıyla çalışmayı seçtik.

Çalışmanızı kaydetmek için Güncelle'ye tıklayın. Artık metninizi ön uçta görüntüleyen bir form alanınız olmalıdır. Üzerine tıklayan kullanıcılar, diğer herhangi bir metin alanı gibi kullanabilir.

Referans olarak, bu noktada bizimki şöyle görünüyor:

Alanlarınızda gerekli değişiklikleri yapın. Hazır olduğunuzda son adıma geçebilirsiniz.

3. Adım: Özel CSS sınıfını ekleyin ve yayınlayın

Son olarak, renk seçici CSS kodunu ekleyebilirsiniz. CSS, web sitenizin verilerini görsel bir biçime dönüştürür. Böylece, kolayca bir renk seçici oluşturmak için bu kodu kullanabilirsiniz.

Düzenlemek istediğiniz alanı seçerek başlayın. Ardından, Alan Seçenekleri sekmesine tıklayın. CSS Düzen Sınıfları bölümünü bulun ve "renk" girin. Bu, daha önce eklediğimiz JavaScript kodunu etkinleştirecektir.

Daha sonra çalışmanızı kaydedin. Alanınız şimdi şöyle görünmelidir:

Formunuz artık çok çeşitli olası renkleri görüntüleyebilir. WordPress renk seçici eklemek istediğiniz her alan için bu işlemi tekrarlamanız gerekeceğini unutmayın.

Renk seçici eklemeyi tamamladığınızda, formlarınızı iyileştirmenin başka yollarını da düşünmek isteyebilirsiniz. Örneğin, daha uzun bir formu birden çok adıma bölerek daha eğlenceli hale getirmeyi seçebilirsiniz.

Son olarak formunuzu istediğiniz sayfada yayınlayın. Kullanıcılarınız artık ona erişebilecek ve bilgilerini gönderebilecek.

Çözüm

Bir renk seçici kullanışlı bir araç olabilir. Ancak, bir tane eklemek her zaman basit değildir. Neyse ki, Formidable Forms'da durum böyle değil. Birkaç satır kod ekleyerek ziyaretçilerinize kolay bir tasarım seçeneği sunmaya başlayabilirsiniz.

Bu makalede, üç adımda bir WordPress renk seçiciyi nasıl ekleyeceğinizi gösterdik:

1. Renk seçici kodunu tema dosyalarınıza ekleyin.
2. Formunuzu oluşturun veya mevcut bir formu düzenleyin.
3. Özel CSS'yi tercih ettiğiniz alana ekleyin.

Renk seçiciler, daha iyi bir kullanıcı deneyimi sağlamanın yolu değildir. Formidable Forms eklentimizin sitenizi bugün iyileştirmeye yardımcı olabileceği diğer yollara göz atın!

Daha iyi bir kullanıcı deneyimi oluşturmanın daha fazla yolunu bulun

• Şimdi Yükleyebileceğiniz En İyi 5 WordPress Popup Eklentisi
  Daha fazla oku

  WordPress Formlarında Sayı Aralığı Kaydırıcısı Nasıl Oluşturulur
  Daha fazla oku

  WordPress Formlarında Radyo Düğmeleri Görüntülerle Nasıl Değiştirilir
  Daha fazla oku