WordPress'te tam genişlikte bir sayfa oluşturmak ister misiniz?

Çok WordPress temaları zaten kullanabileceğiniz yerleşik bir tam genişlikte sayfa şablonuyla birlikte gelir. Ancak bazı WordPress temaları bu özelliğe sahip değildir. bu TutorielWordPress'te kolayca tam genişlikte bir sayfanın nasıl oluşturulacağını göstereceğiz.

Ama daha önce, eğer WordPress keşfi hiç kurmadıysanız Bir WordPress blog 7 adımlarını nasıl yüklenir et Nasıl bulmak yüklemek ve blogunuzda bir WordPress tema etkinleştirmek için 

O zaman neden burada olduğumuza dönelim.

Yöntem 1: WordPress temanızda yerleşik bir genişlik şablonu kullanma

WordPress temanıza zaten tam genişlikte bir sayfa şablonu sağlanmışsa bu yöntem önerilir. Bir tane yoksa, aşağıdaki seçime göz atın ve bir tane alın.

Öncelikle "sayfasını ziyaret ederek bir sayfayı düzenlemeniz veya yeni bir sayfa oluşturmanız gerekir" Sayfalar> Ekle Yeni bir sayfa.

Sayfa düzenleme penceresinde şunu seçin: Tam Genişlik Sayfa özellikleri onay kutusu altında bir şablon olarak.

Modeli seçtikten sonra Tam Genişliksayfanızı kaydetmelisiniz. Sayfayı daha fazla içerik eklemek için özelleştirmeye devam edebilir veya eylemi görmek için önizleme düğmesini tıklatabilirsiniz.

Sayfa düzenleme ekranınızda Tam Genişlik - tam genişlik - şablon seçeneğiniz yoksa bu, WordPress temanızın buna sahip olmadığı anlamına gelir. 

Ancak endişelenmeyin, size bir WordPress temasını değiştirmeden kolayca tam genişlikte bir sayfa oluşturmayı göstereceğiz.

2 Yöntemi: Tam Genişlikte Bir Sayfa Şablonu Nasıl Oluşturulur

Bu yöntem, kullandığınız WordPress temasının dosyalarını düzenlemenizi ve temel PHP, CSS ve HTML anlayışına sahip olmanızı gerektirir.

Bu arada, biz de sizi danışmaya davet ediyoruz 8 en iyi WordPress eklentileri mizanpajlarınızı kolayca oluşturabilirsiniz 

Ancak, daha ileri gitmeden önce bir WordPress yedeği veya en azından mevcut WordPress temanızın bir yedeğini oluşturun.. Bu, kötü bir şey olursa web sitenizi kolayca geri yüklemenize yardımcı olacaktır. 

Öncelikle, Not Defteri gibi bir metin düzenleyici açmanız ve aşağıdaki kodu boş bir dosyaya yapıştırmanız gerekir:

<?php
/*
*
Template Name: Full-Width
*/
get_header(); ?>

Şimdi bu dosyayı "olarak kaydetmeniz gerekiyor." Tam width.php Bilgisayarınızda

Bu kod basitçe bir dosya şablonunun adını belirler ve WordPress'e başlık şablonunu çıkarmasını söyler.

Daha sonra kodun içerik kısmına ihtiyacınız olacak. Bir FTP istemcisi kullanarak web sitenize bağlanın (cPanel veya dosya yöneticisi) sonra git " / Wp-content / themes / your-tema-klasör / '.

O zaman "" adlı dosyayı bulman gerekiyor. page.php ". Bu, temanız için varsayılan sayfa şablonu dosyasıdır.

İşlevden sonraki her şeyi kopyala « get_header () Ve bir dosyaya yapıştır " Tam width.php Bilgisayarınızda yarattığınız.

Şimdi "full-width.php" dosyasının içeriğine bakmalı ve bu kod satırını silmelisiniz:

<?php get_sidebar(); ?>

Bu satır sadece kenar çubuğunu alır ve onu WordPress temanızda görüntüler. Bunu kaldırırsanız, temanız şablonu kullanırken kenar çubuğunu göstermez Tam Genişlik.

Bu satırın WordPress temanızda birden fazla kez göründüğünü görebilirsiniz. WordPress temanızda birden fazla kenar çubukları (Widget alanlarına altbilgiye ayrıca kenar çubukları da denir.)Kodda bir kez başvurulan her bir kenar çubuğunu göreceksiniz. Hangi kenar çubuğunu korumak istediğinize karar vermelisiniz.

Web siteniz yavaş yükleniyor gibi görünüyor WordPress blogunuzu resimlere göre optimize etmeye neden ihtiyacınız var?

Temanız sayfanızda kenar çubukları göstermiyorsa, bu kodu dosyanızda bulamayabilirsiniz.

Bu tam genişlikli.php kodumuzdaki değişiklikleri yapmamızı sağlar. Kodunuz temanıza bağlı olarak biraz farklı görünebilir.

<?php
/*
*
Template Name: Full-Width
*/
get_header(); ?>
<div id="primary" class="content-area">
    <main id="main" class="site-main" role="main">
        <?php
        // Start the loop.
        while ( have_posts() ) : the_post();

            // Include the page content template.
            get_template_part( 'template-parts/content', 'page' );

            // If comments are open or we have at least one comment, load up the comment template.
            if ( comments_open() || get_comments_number() ) {
                comments_template();
            }

            // End of the loop.
        endwhile;
        ?>

    </main><!-- .site-main -->
</div><!-- .content-area -->
<?php get_footer(); ?>

O zaman dosyayı indirmelisin Tam width.php »WordPress tema klasörünüzde FTP istemcisi.

Özel bir tam genişlikte sayfa şablonunu başarıyla oluşturdunuz ve temanıza yüklediniz. Bir sonraki adım, tam genişlikte bir sayfa oluşturmak için bu şablonu kullanmaktır.

Kontrol panelinize gidin ve yeni bir sayfa düzenleyin veya oluşturun.

Sayfa düzenleme ekranında, sayfa öznitelikleri onay kutusunu bulun ve "Şablon" seçeneğinin altındaki açılır menüyü tıklayın.

Modelinizi görebileceksiniz. Devam edin, onu seçin ve sayfayı kaydedin veya güncelleyin.

Artık web sitenizi ziyaret edebilirsiniz ve kenar çubuklarının kaybolduğunu ve sayfanızın tek sütunlu bir sayfa olarak göründüğünü göreceksiniz. Henüz dolu olmayabilir, ancak şimdi farklı şekilde yayınlamaya hazırsınız.

Keşfederek web sitenizi popüler hale getirin Resimlerinizin SEO'sini optimize etmek için 7 WordPress eklentileri

Temanızın içerik alanını tanımlamak için kullandığı CSS sınıflarını keşfetmek için İnceleme aracını kullanmanız gerekecektir.

Ardından CSS kullanarak genişliğini% 100'e ayarlayabilirsiniz. Aşağıdaki CSS kodunu kullandık:

.page-template-full-width .content-area {
    width: 100%;
    margin: 0px;
    border: 0px;
    padding: 0px;
}

.page-template-full-width .site {
margin:0px;
}

İşte Yirmi Onyedi gibi görünecek.

Hepsi bu ders için, umarım tam genişlikte sayfalar oluşturmanıza izin verir.

Yukarıdaki yöntemler kolayca alabilecek ve kolayca tam genişlik veya tam genişlikli düzenler oluşturmak isteyenler için ücretsizdir.

Ayrıca bazı premium WordPress eklentilerini keşfedin  

diğer kullanabilirsiniz WordPress eklentileri modern bir görünüm vermek ve blogunuzun veya web sitenizin kullanımını optimize etmek için.

Size, bu konuda yardımcı olacak bazı premium WordPress eklentileri sunuyoruz.

1. Divi Oluşturucu

Divi Builder, çok takdir edilen sayfaların yüksek kalitede bir üreticisidir. Zarif Temalar. Genelde Divi WordPress temasının bir parçası olarak kullanılsa da Divi Builder aynı zamanda diğer WordPress temalarında kullanabileceğiniz bağımsız bir eklentidir.

Divi Builder, çoğu kullanıcı ilk arayüzü tercih etse de, içeriğinizi ön uçta görsel bir arayüz ve arka uçta bir arayüz kullanarak düzenlemenize olanak tanır.

Temelde kenar çubukları yerine, hepsi pop-up'larda ve kayan düğmelerde. 316 farklı sunum paketine yayılmış 40 önceden tasarlanmış şablona erişimin yanı sıra kendi tasarımlarınızı şablon olarak kaydetme olanağı sağlar.

Keşfetmenizi öneriyoruz Profesyonel bir blog nasıl oluşturulur

Divi'nin özelliklerinden biri her zaman size verdiği stillerin kontrolü olmuştur. Üç farklı sekmede, duyarlı kontroller, özelleştirilebilir boşluklar ve daha fazlası dahil olmak üzere çeşitli ayarları yapılandırabilirsiniz.

CSS düzenleyicisi temel doğrulama ve otomatik tamamlamayı içerdiğinden, özel CSS bile ekleyebilirsiniz. Divi Builder'ın eleştirilerinden biri her zaman dayandığı olmuştur. kısa kod. Bu, bir gün devre dışı bırakırsanız içeriğinizde bir sürü kısa kod bırakacağı anlamına gelir. Bu biraz moral bozucu olsa da, artık Shortcode Cleaner gibi eklentiler mevcut olmaktan daha az problem.

Indir | gösteri | Web hosting

2. Themify Builder

Themify Builder, şaşırtıcı bir şekilde Themify ekibinin ürünüdür. Müşterilere basit özelleştirme seçenekleri sunmak için birkaç WordPress temasına entegre eder. Ancak, bağımsız bir eklenti olarak da satın alabilir ve herhangi bir WordPress temasıyla kullanabilirsiniz.

Divi Builder ve WPBakery Page Builder gibi Themify Builder da ön uçta veya arka uçta mizanpajlar oluşturmanıza olanak tanır. Bir başka iyi şey de, bu eklentinin duyarlı kesme noktalarınızı özelleştirmenize izin vermesidir (ancak yalnızca tüm web sitesi düzeyinde).

keşfedin WooCommerce nasıl kurulur ve yapılandırılır için çevrimiçi mağaza oluştur ve ürünlerinizi internette kolayca satabilirsiniz 

Themify Builder ile ilgili harika bir şey, standart WordPress düzenleyicisini kullanmanıza izin verirken, diğer sayfa oluşturucuların sizi WordPress arayüzünü kullanmaya zorlamasıdır. sayfa oluşturucu herşey için.

Indir | gösteri | Web hosting

3. Elementor

İlk olarak 2016'da piyasaya sürülen Elementor WordPress eklentisi, bu listedeki en genç sayfa oluşturuculardan biridir. Geç başlamasına rağmen, Elementor WordPress.org'da 1'den fazla aktif yüklemeyi hızlı bir şekilde artırdı ve bu da onu en popüler WordPress sayfa oluşturucularından biri haline getirdi.

Şöhretini artıran, akışkan görsel arayüzü, farklı stil seçenekleri ve WordPress temalarının oluşturulması gibi diğer güçlü özellikleridir.

Arabirimi, belirli parametreler için üçüncü bir bölgeye sahip iki ana bölüme ayrılmıştır. Elementor'ün ücretsiz sürümü 28 içermeyen widgetlar sunuyor. Pro sürümü, 30'in diğer widget'larını ve Pro sürümünde toplam 58 widget'ını getirir. Ücretsiz sürümde 40 ücretsiz şablonları bulunurken, Pro sürümünde yüzlerce ek şablon bulunur.

 Indir | gösteri | Web hosting

Diğer önerilen kaynaklar

Web sitenizi oluşturmanıza ve yönetmenize yardımcı olacak diğer önerilen kaynaklar hakkında bilgi edinin.

• WordPress temanızı güvenle nasıl değiştirirsiniz?
• WooCommerce üzerinde dağıtımlar ayarlamak nasıl
• Rezervasyon ve Rezervasyondan 10 premium WordPress eklentisi
• Ne zaman ve nasıl bir alt WordPress yüklemek için
• 10 WordPress eklentileri blogunuzun hızını artırmak için

Sonuç

Burada ! Bu eğitim için bu kadar. Şablon olarak Tam Genişlik sayfası sunmayan bir WordPress temanız varsa, bu öğreticinin bu eksikliği çözmenize yardımcı olduğunu umuyoruz. Çekinme En sevdiğiniz sosyal ağlarda arkadaşlarınızla paylaşın. 

Bununla birlikte, ayrıca bize danışabilirsiniz kaynakların bulunduğuİnternet siteleri oluşturma projelerinizi yürütmek için daha fazla elemana ihtiyacınız varsa, WordPress blog oluşturma.

Öneriniz veya yorumunuz varsa, bunları bölümümüzde bırakın. Yorumlar.

...