Ücretsiz Divi Yoga Düzen Paketine Üyelikler Nasıl Eklenir

Düzen Paketi Kullanım Durumlarımızla amacımız, belirli bir paket üzerine kurulmuş bir web sitesinin olması gereken her şeyi yansıtan, işleyen bir web sitesine bir tasarım almanıza yardımcı olmaktır. Bu örnekte, işlevsel hale getirmek istediğimiz güzel, ilham verici bir yoga stüdyosu yerleşim paketimiz var. Tasarım ekibimiz Divi için ücretsiz Yoga Layout Pack'i tasarlarken, tam olarak bunları akıllarında tuttular. Yoga stüdyosu web sitenizi biraz daha ileriye götürmenize yardımcı olmak için size web sitenize nasıl üyelik ekleyeceğinizi göstereceğiz. Somut olarak, bu araçlar nasıl Ücretli Üye Abonelik eklentisi ve nasıl web sitenizde ayrı bir sayfaya kayıt formu eklemek için kullanmak göstereceğiz. Bu sayfanın ve formun stili, web sitenizin geri kalanının stiliyle tamamen uyumlu olacaktır.

Case Sneak Peek'i kullanın

Öğreticiye dalmadan önce, sonuca bir göz atalım.

Kurulum

1. Divi Temasını kurun ve etkinleştirin
2. Eklentileri Yükleyin
3. Düzen Paketini indirin ve Yoga_All.json dosyasını Divi Tema Kitaplığınıza aktarın.
4. Her düzen için yeni sayfalar oluşturun.
5. Birincil menünüzü oluşturun.

Yukarıda listelenen kurulum konusunda kafanız karıştıysa, yeni projeniz için bir yerleşim paketi kullanmak için bu 10 adımı kontrol ederek yerleşiminizi nasıl düzgün bir şekilde kuracağınız konusunda daha ayrıntılı talimatlar bulabilirsiniz.

Bölüm 1: Ücretli Üye Abonelikleri Eklentisini İndirin ve Yükleyin

1. Adım: Eklentiyi İndirin

Ücretsiz Divi Yoga Layout Pack'i yükledikten sonra yapmanız gereken ilk şey, aşağıdaki sayfada bulabileceğiniz ücretsiz Ücretli Üye Abonelikleri eklentisini indirmektir.

2. Adım: Eklentiyi Yükleyin ve Etkinleştirin

Eklentiyi indirdikten sonra WordPress web siteniz > Eklentiler > Yeni Ekle'ye gidin ve eklentiyi yükleyin . Yüklendikten sonra, onu da etkinleştirdiğinizden emin olun.

Bölüm 2: Eklenti Ayarlarını Değiştirin

1. Adım: Herkes İçin Üyeliği Etkinleştirin

Kayıt formunuzun tüm ziyaretçilerinize görünmesini istiyorsanız, ayarlarınızda bir seçeneği etkinleştirmeniz gerekir. Bunu yapmak için WordPress web sitenize gidin > Ayarlar > Genel > 'Herkes kayıt olabilir' üyelik seçeneğini etkinleştirin .

2. Adım: Para Birimi Seçin

Ardından, Ücretli Üye Abonelikleri > Ayarlar > Ödemeler > Para birimi seçimi bölümüne giderek kullandığınız para birimini seçmelisiniz .

3. Adım: PayPal E-posta Adresi Ekleyin

PayPal e-posta adresinizi de eklemek için Ödemeler sekmesini aşağı kaydırın. Bu ücretsiz eklenti, yalnızca PayPal üzerinden veya manuel/çevrimdışı ödeme almanızı sağlar. PayPal e-posta adresinizi ayarlarınıza ekledikten sonra, kaydolan kişiler satın alma işlemi yapmak için PayPal sayfasına yönlendirilecektir.

3. Bölüm: Abonelik Planları Ekleyin

1. Adım: Yeni Abonelik Planı Ekle

Ayarlarınızı değiştirdikten sonra eklentinize abonelik planları ekleyebilirsiniz. Bunu yapmak için Ücretli Üye Abonelikleri > Abonelik Planları > Yeni Ekle'ye gidin .

2. Adım: Kopyala ve Ayarları Seçin

Abonelik planınıza kendi yoga stüdyosu abonelik planlarınızla eşleşecek bir başlık, açıklama, süre, fiyat durumu ve kullanıcı rolü ekleyebilirsiniz. İhtiyaç duyduğunuz kadar abonelik planı oluşturun. Durumlarının aktif olup olmamasına bağlı olarak bunlar kayıt formunda görünecektir.

4. Bölüm: Üye Kayıt Sayfası Oluşturun

1. Adım: Yeni Sayfa Ekleyin ve Visual Builder'a Geçin

Bu sonraki bölümde, ücretsiz Divi Düzen Paketini kullanarak nasıl kayıt sayfası oluşturacağınızı göstereceğiz. Yapmanız gereken ilk şey, yeni bir sayfa oluşturmak ve ona uygun bir başlık vermek. Ardından Divi Builder'ı etkinleştirin ve hemen Visual Builder'a geçin.

2. Adım: Ekip Düzenini Yükleyin

Bu sayfa için Yoga Düzen Paketimizin Takım Düzenini yükleyeceğiz ve üzerinde değişiklikler yapacağız.

3. Adım: Son Bölümü Kaldır

Yapmanız gereken ilk şey, üye olmak için bir harekete geçirici mesaj içerdiğinden son bölümü kaldırmaktır. Zaten kayıt sayfasında olduğumuz için bu gerçekten gerekli değil.

Adım 4: Birinci Bölümü Klonlayın (Üye Kayıt Bölümü Oluşturmak İçin)

Ardından, sayfanın ilk bölümünü bir kez klonlayın. Kayıt formunu eklemek için bu klonlanmış bölümü kullanacağız. Bu arada, kayıt formumuza ve ekip bölümümüze doğru başlığı vermek için Metin Modülünü de yeniden kullanacağız.

Adım 5: Yeni Bölümün Degrade Arka Plan Rengini Kaldırın ve Arka Plan Rengi Ekleyin

İlk bölümü klonladıktan sonra devam edin ve degrade arka planını kaldırın. Ardından, bunun yerine arka plan rengi olarak '#fafbfc' ekleyebilirsiniz.

Adım 6: Üye Kayıt Bölümünde Metin Modülünü Değiştirin

Ayrıca Metin Modülünde de bazı değişiklikler yapmamız gerekecek. İçeriği değiştirmenin yanı sıra, Metin alt kategorisinde aşağıdaki değişiklikleri yapın:

• Metin Rengi: #666666
• Metin Yönü: Merkez

Ve Başlık Metni alt kategorisindeki Başlık Metni Rengi '#486066'.

Son olarak, Boyutlandırma alt kategorisindeki Modül Hizalamasını orta olarak değiştirin.

Adım 7: Üye Kayıt Bölümünün Klon Satırı ve Takım Bölümündeki Yeri

Ardından, Metin Modülü ile satırı klonlayın ve onu da ekip bölümüne yerleştirin. Elbette, kopyayı o bölümle eşleşecek şekilde değiştirdiğinizden emin olun.

Adım 8: Mevcut Üye Kayıt Bölümü Satırına Kayıt Kısa Koduyla Yeni Metin Modülü Ekleme

Şimdi sıra üye kayıt formunu sayfanıza eklemeye geldi. Bunu yapmak için kayıt bölümündeki mevcut satıra yeni bir Metin Modülü ekleyin. Kısa kodu eklemeden önce Metin Modülünün Tasarım sekmesine gidin ve Boyutlandırma alt kategorisinde aşağıdaki değişiklikleri yapın:

• Genişlik: %61
• Modül Hizalaması: Merkez

Ardından, İçerik sekmesinin İçerik Kutusuna '[pms-register]' kısa kodunu ekleyin.

9. Adım: Ücretli Üyelerin Abonelik Eklentisinin Kayıt Formunu CSS Koduyla Değiştirin

Herhangi bir değişiklik yapılmadığında, kayıt formu yoga düzeni paketiyle eşleşmez. Ücretli Üye Abonelikleri eklentisi, ne yazık ki, formu biçimlendirmek için Divi Builder'ı kullanmayı mümkün kılmayan bir üçüncü taraf eklentisidir. Ancak, kayıt formunu yerleşim paketiyle eşleştirmek için bazı CSS kod satırlarını kullanabiliriz. Ve biz de tam olarak bunu yaptık. Aşağıdaki CSS kodunu kopyalayabilir ve Tema Özelleştirici > Ek CSS'ye yerleştirebilirsiniz:

#pms_register-form input[name="pms_register"] {
background: none;
border-radius: 50px;
padding-top: 12px;
padding-left: 36px;
padding-right: 36px;
padding-bottom: 12px;
border: 2px solid #44D89E;
color: #44D89E;
font-family: poppins;
font-weight: 600;
text-transform: uppercase;
font-size: 14px;
}

.et_pb_text ul {
list-style-type: none;
}

#pms_register-form input[type="text"] {
border-radius: 6px;
-webkit-box-shadow: 0px 10px 24px 6px rgba(0,0,0,0.16);
-moz-box-shadow: 0px 10px 24px 6px rgba(0,0,0,0.16);
box-shadow: 0px 10px 24px 6px rgba(0,0,0,0.16);
border: none;
padding-top: 12px;
padding-bottom: 12px;
margin-top: 10px;
}

#pms_register-form input[type="password"] {
border-radius: 6px;
-webkit-box-shadow: 0px 10px 24px 6px rgba(0,0,0,0.16);
-moz-box-shadow: 0px 10px 24px 6px rgba(0,0,0,0.16);
box-shadow: 0px 10px 24px 6px rgba(0,0,0,0.16);
border: none;
padding-top: 12px;
padding-bottom: 12px;
margin-top: 10px;
}

div.et_pb_text_inner #pms_register-form {
text-align: center;
}

form#pms_register-form label{
font-family: poppins;
font-weight: normal;
}

Adım 10: Kayıt Sayfasını Harekete Geçirici Mesajlarınıza Bağlayın

Kayıt sayfasını web sitenize eklemenin son kısmı, tüm harekete geçirici mesajları o sayfaya bağlamaktır. Düğme Modüllerini açmanız ve İçerik sekmesindeki Bağlantı alt kategorisine kayıt sayfası bağlantısını eklemeniz yeterlidir:

4. Bölüm: Üyeleri Yönetin

1. Adım: Üyelerin Tam Listesini Görüntüleyin

Web sitenizde üyeleri görebileceğiniz iki yer var. İlk yer, WordPress kontrol panelinizdeki kullanıcı bölümüdür.

Ancak, kullanıcıları Ücretli Üye Abonelikleri eklentinizde de görebilirsiniz.

2. Adım: Ödeme Durumunu Görüntüle

WordPress panonuzdaki kullanıcı bölümünde göremediğiniz eklenti içerisinde görebileceğiniz şeylerden biri de ödeme durumudur.

Bölüm 5: İhtiyaçlarınıza Göre Diğer Kısa Kodları Kullanın

Ücretli Üye Aboneliği eklentisi size başka seçenekler de sunar. İstediğiniz herhangi bir sayfaya bir hesap, abonelikler ekleyebilir, giriş yapabilir veya şifre kısa kodunu kurtarabilirsiniz.

Son düşünceler

Bu gönderide, yoga stüdyosu web sitesine nasıl üyelik ekleneceğini gösterdik. Bu gönderi, devam eden Divi tasarım girişiminin bir parçası olan ve yüksek kaliteli resimler içeren güzel web siteleri oluşturmanıza yardımcı olacak ücretsiz düzen paketleri sağladığımız ücretsiz Yoga Düzen Paketinin bir kullanım örneğidir. Herhangi bir sorunuz veya öneriniz varsa; Aşağıdaki yorum bölümünde bir yorum bıraktığınızdan emin olun.

Büyük bir duyuruyu, faydalı ipucunu veya Divi freebie'sini asla kaçırmamak için e-posta bültenimize ve YouTube kanalımıza abone olmayı unutmayın!

Öne Çıkan Görsel Danielala / Shutterstock.com