Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Kupası
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Beaver Builder ile Özel WordPress Düzenleri Nasıl Oluşturulur?

Muhtemelen WordPress’te özel düzenler oluşturmanın yollarını aramışsınızdır. Ancak bulduğunuz kılavuzlar ya çok uzun ya da kodlama becerisi gerektiriyor. Tanıdık geliyor mu?

Eğer öyleyse, Beaver Builder gibi bir sayfa oluşturucuyu denemeniz gerektiğini düşünüyoruz. Birçok deneyimli kullanıcı sayfa oluşturucuların harika tasarımlar yapmadığını veya web sitelerini yavaşlattığını düşünüyor. Ancak deneyimlerimize göre, bu gibi araçlar özellikle yeni başlayanlar için web sitesi oluşturmayı gerçekten basitleştirebilir.

Göstermek için, Beaver Builder kullanarak özel bir WordPress düzeninin nasıl yapılacağını göstereceğiz. Size nasıl kurulacağını, ilk özel düzeninizi nasıl yapacağınızı ve zamandan tasarruf etmek için hazır tasarımları nasıl kullanacağınızı öğreteceğiz.

Creating custom page layouts in WordPress with Beaver Builder

Özel Sayfa Düzenlerine Neden ve Ne Zaman İhtiyaç Duyarsınız?

Birçok premium WordPress teması, bir web sitesinin farklı bölümleri için kullanıma hazır sayfa düzenleriyle birlikte gelir. Ancak bazen yerleşik bir düzen ihtiyaçlarınıza uymayabilir.

WordPress’te bir alt tema oluşturarak ve ardından kendi sayfa şablonlarınızı ekleyerek özel sayfa şablonları oluşturabilirsiniz. Ancak bunun işe yaraması için biraz PHP, HTML ve CSS bilgisine ihtiyacınız olacaktır.

İşte burada Beaver Builder gibi araçlar devreye giriyor. WordPress için bir sürükle ve bırak sayfa oluşturucu eklentisidir. Herhangi bir kod yazmadan kendi özel sayfa düzenlerinizi oluşturmanıza yardımcı olur.

Beaver Builder’ın kullanımı çok kolay ve acemi dostu. Aynı zamanda, profesyonel görünümlü sayfalar oluşturmak için inanılmaz özelliklerle yüklüdür.

Tüm WordPress temalarıyla çalışır ve sayfanıza sürükleyip bırakabileceğiniz tonlarca modüle sahiptir. İstediğiniz her türlü düzeni oluşturabilir ve tam hayal ettiğiniz şekilde ayarlayabilirsiniz.

Bu Beaver Builder eğitiminde, WordPress’te özel sayfa düzenleri oluşturmak için Beaver Builder’ı nasıl kullanacağınızı göstereceğiz. Bu makalede gezinmek için aşağıdaki hızlı bağlantıları kullanabilirsiniz:

Profesyonel İpucu: Tüm kendin yap kısmını atlamak ister misiniz? WPBeginner Pro Services ‘teki uzmanlarımız, size zaman kazandırmak için profesyonel bir web sitesini hızlı bir şekilde hazırlamanıza ve çalıştırmanıza yardımcı olabilir. Tasarımdan geliştirmeye kadar her şeyi biz halledeceğiz, böylece siz işinize odaklanabilirsiniz.

Adım 1: Beaver Builder Eklentisini Kurun

İlk olarak, Beaver Builder eklentisini satın almanız gerekir. Ücretli bir eklentidir ve sınırsız site için 99$’dan başlayan fiyatlara sahiptir.

Ardından, Beaver Builder eklentisini yüklemeniz ve etkinleştirmeniz gerekir. Daha fazla ayrıntı için, bir WordPress eklentisinin nasıl kurulacağına ilişkin adım adım kılavuzumuza bakın.

Etkinleştirmenin ardından, lisans anahtarınızı girmek için Ayarlar ” Beaver Builder sayfasını ziyaret etmeniz gerekir.

Entering the Beaver Builder's license key

Lisans anahtarınızı girdikten sonra, artık güzel sayfa düzenleri oluşturmaya hazırsınız.

Adım 2: Beaver Builder ile İlk Özel Sayfa Düzeninizi Oluşturun

İlk olarak, WordPress’te Sayfalar ” Yeni Sayfa Ekle‘y i ziyaret ederek yeni bir sayfa oluşturun.

Clicking Add New Page in WordPress admin area

Beaver Builder’ı açmadan önce, yeni sayfanıza bir başlık verin ve taslak olarak kaydedin.

Deneyimlerimize göre, önce bunu yapmadığımız sürece sayfa oluşturucu açılmıyordu.

Saving a page as a draft

Bunu yaptıktan sonra, başlamak için ‘Launch Beaver Builder’ düğmesine basın.

Bu, Beaver Builder arayüzünde sayfanızın ön ucunu açacaktır.

Launching the Beaver Builder plugin

Beaver Builder’ı ilk kez kullanıyorsanız, size rehberli bir tur sunan bir karşılama açılır penceresi göreceksiniz.

Bundan sonra, üst menüdeki ‘+’ düğmesine tıklamanız gerekir. Bu düğme bir ‘x’ simgesine dönüşecektir. Ardından, ‘Şablonlar’ sekmesine geçin.

Finding a template to add to the page template in Beaver Builder

Beaver Builder, hemen başlamanız için profesyonelce tasarlanmış bazı şablonlarla birlikte gelir.

Endişelenmeyin; şablonu istediğiniz kadar özelleştirebilirsiniz. Bu sadece bir düzenle başlamanız için hızlı bir yoldur.

Bir düzen seçtiğinizde, Beaver Builder bunu önizleme penceresine yükleyecektir. Farenizi bir öğenin üzerine getirdiğinizde Beaver Builder onu vurgulayacaktır.

Düzenlemek için vurgulanan herhangi bir öğenin üzerindeki İngiliz anahtarı simgesine tıklamanız yeterlidir.

wrench icon

Beaver Builder, düzenleyebileceğiniz farklı ayarları içeren bir açılır pencere gösterecektir.

Yazı tipini, rengini, arka planını, yazı tipini , dolguyu, kenar boşluğunu ve daha fazlasını değiştirebilirsiniz.

headings popup

Beaver Builder düzenleri satırlara dayanır. Satırları yeniden düzenlemek için sürükleyip bırakabilirsiniz. Ayrıca yeni bir satırı kaldırabilir veya ekleyebilirsiniz.

Satır Düzenleri menüsünü tıklamanız ve satırınızda istediğiniz sütun sayısını seçmeniz yeterlidir.

row and columns layout

Beaver Builder, satırı sitenizdeki canlı önizlemeye ekleyecektir.

Temel veya gelişmiş modülleri ve widget’ları kullanarak satırınıza öğeler ekleyebilirsiniz. Bu modüller düğmeler, başlıklar, metin, resimler, slayt gösterileri, ses, video vb. gibi en sık kullanılan öğeleri eklemenize olanak tanır.

Sadece bir öğe seçin ve yeni eklediğiniz satıra sürükleyin. Özelliklerini düzenlemek için bir öğeye tıklayın.

Ayrıca bir satırı veya modülü daha sonra başka sayfalarda tekrar kullanmak üzere kaydedebilirsiniz. Bir satırı veya modülü düzenlerken ‘Farklı kaydet’ düğmesine tıklayın.

Save element to reuse

Sayfanızı düzenlemeyi bitirdiğinizde sağ üst köşedeki ‘Bitti’ düğmesine tıklayın.

Beaver Builder, sayfanızı yayınlamak veya taslak olarak kaydetmek için bir dizi düğme gösterecektir.

publish button

Ayrıca bir sayfa düzeninin tamamını WordPress sitenizdeki diğer sayfalar için yeniden kullanabilirsiniz. Sayfayı Sayfa Oluşturucu ile açın ve ardından üst çubuktaki ‘Araçlar’a erişmek için aşağı ok düğmesine tıklayın.

Beaver Builder size bir açılır pencere gösterecektir. Sayfayı bir şablon olarak kaydedebilir veya aynı düzene sahip hızlı bir şekilde yinelenen bir sayfa oluşturabilirsiniz.

Beaver Builder tools

Beaver Builder’da Sayfa Düzeni Şablonları Nasıl Yönetilir

Yaptığınız tüm şablonları Beaver Builder “ Şablonlar bölümünden kontrol edebilirsiniz . Burada, mevcut şablonlarınızı yönetebilir, önizleyebilir ve düzenleyebilirsiniz.

Managing templates in Beaver Builder

Beaver Builder şablonlarıyla ilgili harika bir şey de özel yazı türleri olmalarıdır. Bu, WordPress’teki yerleşik dışa aktarma özelliğini kullanarak Beaver Builder şablonlarınızı kolayca dışa aktarabileceğiniz anlamına gelir.

Araçlar ” Dışa Aktar sayfasını ziyaret edin ve Şablonları seçin. ‘Dışa Aktarma Dosyasını İndir’ düğmesine tıkladığınızda WordPress size indirmeniz için bir XML dosyası gönderecektir.

Exporting templates

Şimdi şablonları içe aktarmak istediğiniz WordPress sitesine giriş yapın. Ayarlar ” İçe Ak tar sayfasını ziyaret edin ve WordPress’e tıklayın.

WordPress ithalatçı eklentisini indirmeniz ve yüklemeniz istenecektir. Bundan sonra, şablonunuzun XML dosyasını yükleyebilir ve içe aktarabilirsiniz.

Alternatif: Özel Tema Oluşturmak için SeedProd’u Kullanın

Beaver Builder harika olsa da herkes için mükemmel bir seçim olmayabilir. Sorun değil! SeedProd gibi başka mükemmel seçenekler de var.

SeedProd, sıklıkla önerdiğimiz bir diğer kullanıcı dostu sayfa oluşturucudur. Sadece açılış sayfaları yapmak için değil. Tüm WordPress temalarını oluşturmak için bile kullanabilirsiniz. OptinMonster için açılış sayfaları oluşturmak da dahil olmak üzere birçok projede iyi bir şekilde kullandık.

SeedProd's homepage

SeedProd’u öne çıkaran şey, kapsamlı özelleştirme seçenekleridir. Bu sayede sayfalarınıza dönen referanslar, göz alıcı animasyonlar, profesyonel fiyatlandırma tabloları, özellik kutuları ve daha fazlası gibi harika özellikleri kolayca ekleyebilirsiniz.

Ayrıca SeedProd, siteniz için hızlı bir şekilde iyi kalitede metin ve görseller oluşturabilen yapay zeka araçlarına sahiptir. Bu, sayfalarınızı oluştururken gerçek bir zaman tasarrufu sağlayabilir.

Daha fazlasını öğrenmek ister misiniz? SeedProd’un diğer popüler sayfa oluşturuculara kıyasla nasıl olduğunu görmek için bu incelemelere göz atın:

Umarız bu makale Beaver Builder kullanarak WordPress’te özel sayfa düzenleri oluşturmanıza yardımcı olmuştur. Ayrıca mobil uyumlu bir WordPress sitesinin nasıl oluşturulacağına dair rehberimizi ve en iyi WordPress tema oluşturucuları hakkındaki uzman seçimlerimizi de görmek isteyebilirsiniz.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Açıklama: İçeriğimiz okuyucu desteklidir. Bu, bazı bağlantılarımıza tıklarsanız komisyon kazanabileceğimiz anlamına gelir. WPBeginner'ın nasıl finanse edildiğini, neden önemli olduğunu ve nasıl destek olabileceğinizi görün. İşte editoryal sürecimiz.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

Ultimate WordPress Araç Kiti

Araç setimize ÜCRETSİZ erişim sağlayın - her profesyonelin sahip olması gereken WordPress ile ilgili ürün ve kaynaklardan oluşan bir koleksiyon!

Reader Interactions

26 yorumBir Cevap Bırakın

  1. corey

    this helps me out a lot.
    i am using astra and beaver. been needing to upgrade to grwoth plan soon
    is still over my head unlike Guttenberg

    • WPBeginner Support

      Glad to hear our guide was helpful!

      Yönetici

  2. Rodney Harrier

    I started using Elementor to build a blog. If I switch to Beaver Builder, do I lose whatever I have done?

    • WPBeginner Support

      If you change plugins you would lose the customizations from your first plugin.

      Yönetici

  3. Pius Anthony

    Dear Sir,

    Happy new year, i have being watching your wpbeginner video it really inspiring I believe before the next six month i will be teaching other people.

    Regard
    Pius Anthony

    • WPBeginner Support

      Glad our guides can help you start helping other people too :)

      Yönetici

  4. Krayl

    When using Beaver Builder, are you using it on a child theme only? If not, how does it hold up to theme updates?

    Thank you team WPbeginner!

  5. Lisa Theriault

    I really need some help. This is supposed to be easy but when I click on a module or a row nothing happens. I tried dragging and dropping, saving, etc. Nada. I made sure the settings were correct and that the plug in was active. Beaver Builder shows up on the page for editing but I’m obviously an idiot. Getting frustrated, but I’m sure it’s just some silly thing. Can someone offer suggestions? I followed the beginner tutorial and thay is really easy. When I try to do it in Live mode….nothing. Please help. Thank you in advancd.

    • WPBeginner Support

      Hi Lisa,

      Try editing a new page. If that doesn’t work try switching to a default WordPress theme like twenty seventeen and then try editing with Beaver Builder. If that works, then your theme probably has compatibility issues with the page builder.

      Yönetici

      • David Sharp

        I’m having the same problem as Lisa. I used Beaver Builder a couple of years ago to create a landing page, and it worked very well. In fact, I’m still using that same landing page without any problems. But today I tried to create a new landing page using Beaver Builder, but this time, Beaver Builder wouldn’t work.

        Here’s what happened: I created a new page. I clicked the Beaver Builder tab. But instead of seeing a button that says “Launch Beaver Builder,” I was taken to a screen that said, “Drop a row layout or module to get started.” Unfortunately, Beaver Builder failed to produce a Beaver Builder toolbar or any other tools (such as modules or rows) with which to build the page.

        Here’s what I tried to do to fix the problem, without success:

        1. I deactivated my other plugins.
        2. I switched to the Twenty Sixteen Theme.
        3. I made sure I’m using the latest version of everything (Wordpress, Beaver Builder, etc.)
        4. I noticed that if I typed something into the page and then clicked Beaver Builder tab, tools would show up. But when I clicked on them, I just got a spinning circle.
        5. I tried using Beaver Builder on my website that’s online, and also on my localhost test site, but Beaver Builder failed to work on either site.
        6. I tried using a different browser (Safari instead of my usual Chrome) without success.

        Any idea what might be wrong and how I might fix it?

        Thanks!

        • WPBeginner Support

          Hi David,

          You can contact Beaver Builder support, they would be able to help you out.

    • Krayl

      Same thing happened to me Lisa. I think it is my theme not playing well with BB. Looking to switch themes to have full compatibility.

    • Yeremi Akpan

      I had similar issues using Chrome, but they were resolved when I switched to Mirosoft Edge.

  6. Jesse

    I am so grateful for all the wpbeginner ‘how-to’ articles. They are clear and direct, and they make my life so much easier. Because I could follow the trail from ecommerce through Beaver Builder I am now in a place to get OptInMonster. Thanks Syed & team.

  7. Gabrielle

    Hi, is BB outputting [shortcodes] or html content, when switching back to normal editor?
    I wonder if this works well, when building products pages for woocommerce.

  8. Dr. Peter H. Markesteyn

    Would I have to create a child theme (20-17) to preserve all the changes I would make with BeaverBuilder when there is an update?

  9. Anthony

    While this plugin is great, I was wondering if you teach how to customize them yourself? I am looking to build my portfolio and knowing how to do it yourself would be fantastic!

  10. Ian Gordon

    WIth the Beaver Builder plugin, I can take an existing theme and create a completely new Header and Footer without editing any of the existing template files? My

  11. Sam

    How nice does Beaver Builder play with other plugins?

    • WPBeginner Support

      It plays well with most plugins. There might be some hiccups with a random less commonly used plugin, but they are quick to solve such issues.

      Yönetici

  12. Rk bhardwaj

    This is amazing plugin to make any blog looks pretty

  13. Oliver

    Beaver Builder is the best page builder plugin by the best team! :)

    • Robby

      Hey, Oliver! Thanks for the kind words. :)

  14. Andrew Peters

    I LOVE Beaver Builder. I’ve used it for close to a dozen sites since making the switch back in the fall. I’m actually going back and converting some of my clients from VC to BB. It’s fire!

    • Shaiful

      Hi there,

      Just wondering, can it support shortcodes that have conditional context? Such as:

      [if user_loggedin]
      hello user.
      (show logged in user content build with beaver builder)
      [else]
      hello guest.
      (show public content build with beaver builder)
      [/if]

      • WPBeginner Support

        Yes it supports shortcode. Paste them in any field that you can insert text and they will be rendered automatically. When placing shortcodes on the page, it is best to use the HTML module compared to the Text Editor module. The latter tends to add additional p tags which sometimes break the layout.

        Yönetici

Bir Cevap Bırakın

Yorum bırakmayı seçtiğiniz için teşekkür ederiz. Lütfen tüm yorumların yorum poli̇ti̇kasi uyarınca denetlendiğini ve e-posta adresinizin yayımlanmayacağını unutmayın. Ad alanında anahtar kelime KULLANMAYIN. Kişisel ve anlamlı bir sohbet edelim.