WP Simple Pay'e Özel CSS Ekleme

WP Simple Pay ödeme formlarınızı özel CSS ile mi stilize etmeniz gerekiyor? Formlarınız ve diğer sayfa öğeleri için özel CSS'yi WordPress sitenize eklemenin birkaç yolu vardır.

Simple Pay Pro → Ayarlar → Genel → Gelişmiş bölümünü ziyaret ederek WP Simple Pay'in "fikirli stillerini" devre dışı bırakabilir ve temanızın stillerini devralabilirsiniz.

1. Temanızın stil sayfası dosyasını doğrudan düzenleyin (genellikle style.css). Ancak tema güncellemelerinin değişikliklerinizi üzerine yazabileceği konusunda dikkatli olun, bu nedenle #2 veya #3'ü öneririz.
2. Temanıza ayrı bir CSS dosyası ekleyin ve functions.php dosyanızda veya ayrı bir özel eklentide başvurmak için wp_enqueue_style işlevini kullanın.
3. Ücretsiz WP Code eklentisini kullanarak temanızın üstbilgisine CSS ekleyin. Kod Parçacıkları → Üstbilgi ve Altbilgi bölümüne gidin ve aşağıda gösterildiği gibi CSS'nizi ekleyin.

Eklenti stillerini bazı sayfalardan kaldırmanız gerekirse, kod parçacığı kitaplığımızdaki bu parçacığa bakın.

Özelleştirme İpuçları

Şu anda WP Simple Pay ödeme formları için bir CSS stil kılavuzumuz bulunmamaktadır. Değiştirmeniz gereken sınıf ve kimlik adlarını bulmanın en iyi yolu, tarayıcınızın geliştirici araçlarını kullanarak sayfa öğelerini incelemektir.

Bu yöntemi kullanmaya başlamak için harika bir kılavuz: İncele Öğesi Temelleri: WordPress'i Kendin Yap Kullanıcıları İçin Özelleştirme

WP Simple Pay form öğesi CSS sınıfları ve kimlikleri genellikle simpay- ile başlar.

Form kimliğinin 83 ve metin alanı kimliğinin 4 olduğu bir örnek:

<style>
#simpay-form-83 #simpay-text-4 { display: none; }
</style>

Gömülü veya Açılır pencere form görüntüleme seçeneklerini kullanırken ödeme düğmesi rengini yeşilden maviye değiştirme örneği.

<style>
.simpay-checkout-btn { background-color: #428bca !important; }
.simpay-checkout-btn:hover { background-color: #037ad0 !important; }
</style>