Diğer Düğmelerden veya Bağlantılardan Overlay Başlatma

Bu makale, özel kodun WordPress sitenize nasıl ekleneceğini ayrıntılı olarak anlatır ve geliştiricilere yöneliktir. Kendi özel geliştirme hizmetlerimizi sunmasak da, yardıma ihtiyacınız olursa, Seahawk Media'yı şiddetle tavsiye ederiz.

Özel kod parçacıkları olduğu gibi sağlanır ve WP Simple Pay'in birden çok sürümünde çalışmaya devam edeceğine dair bir garanti yoktur.

Adım 1: Düğme URL'sini Güncelleyin

Bir Stripe Checkout veya açılır pencere ödeme formunu özel bir düğme bağlantısı aracılığıyla başlatmak için düğme bağlantı URL'sini değiştirmeniz gerekir. Düğme bağlantısının URL'sini ayarlamak, içeriğinizi nasıl düzenlediğinize bağlı olacaktır. URL'yi şuna güncelleyin:

#form-176

176'yı başlatmak istediğiniz ödeme formunun kimliğiyle değiştirin. Ödeme formunuzun kimliğini form düzenleme ekranında bulabilirsiniz. Form kimliği, aşağıdaki gibi Simple Pay kısa kodunun sayısal bölümüdür.

Ardından, WP Simple Pay ödeme formu kısa kodunu normalde yaptığınız gibi sayfanıza yerleştirin: . Bu, ödeme formunun sayfada görüntülenmesine neden olacak, ancak yalnızca özel düğme bağlantısının görünür olmasını sağlamak için sonraki adımlarda onu gizleyeceğiz.

Adım 2: Özel JavaScript Ekleyin

WordPress web sitenize özel JavaScript kodu eklemenin birçok yolu vardır. Kod parçacıkları eklemek için önerilen kılavuzumuza bakın. JavaScript'i ücretsiz eklenti WP Code kullanarak temanızın altbilgisine eklemenizi öneririz. Kod Parçacıkları → Üstbilgi ve Altbilgi'ye gidin, ardından aşağıdaki gibi özel Javascript'i Altbilgi bölümüne ekleyin.

<script>
( function( $ ) {
	// Update comma separated list with payment form ID(s) to launch.
	var ids = [ '123' ];

	// Do not modify.
	ids.forEach( function( id ) { 
		$( 'a[href~="#form-' + id + '"]' ).click( function( e ) {
			e.preventDefault(); 
			$( '.simpay-form-' + id + ' .simpay-payment-btn' ).click();
			$( '#simpay-modal-control-' + id ).click(); 
		}); 
	});
})( jQuery );
</script>

4. satırdaki 123'ü ödeme formunuzun kimliğiyle değiştirin. Sayfada birden fazla düğme oluşturuyorsanız, başlatmak istediğiniz ödeme formu kimliklerinin virgülle ayrılmış bir listesini ekleyebilirsiniz.

Adım 3: Özel CSS Ekleyin

WordPress web sitenize özel CSS kodu eklemenin birçok yolu vardır. Belgelerimizde birkaç yol belirledik. CSS'yi ücretsiz eklenti WP Code kullanarak temanızın üstbilgisine eklemenizi öneririz. Kod Parçacıkları → Üstbilgi ve Altbilgi'ye gidin, ardından CSS'nizi Üstbilgi bölümüne ekleyin:

<style>
body:not(.simpay-form-preview) .simpay-form-wrap {
  display: none;
} 
</style>

Bu, varsayılan kısa kod çıktısını gizleyecek, böylece yalnızca özel düğme bağlantısı görünecektir.