HTML Web Sitenizi Neden Bir WordPress Temasına Dönüştürmelisiniz?

Hala eski HTML web sitelerini mi kullanıyorsunuz? HTML web sitenizi bir WordPress web sitesine dönüştürmenin ve bu popüler içerik yönetim sisteminin sunduğu çok sayıda özellikten yararlanmanın zamanı geldi. Neden WordPress'e geçmeniz gerektiğine ve bunu nasıl başarabileceğinize odaklanacağız.

giriiş

Saf vanilya HTML, uzun süredir web sitesi geliştirme için altın standart olmuştur. Bununla birlikte, geçmiş yılların web siteleri iskeletten oluşuyordu, ayrıntılı bir zil ve ıslık yoktu ve bu siteler için HTML kullanmak o zamanlar mantıklıydı.

Mevcut piyasa eğilimleri ve ihtiyaçları ile artık HTML'yi WordPress'e dönüştürebilir ve web sitenizi çalıştırmak için kodu yazmak yerine İçerik Yönetim Sisteminden yararlanabilirsiniz. WordPress Geliştirme hakkında daha geniş bir anlayışa sahip olmak için daha fazlasını okuyun.

HTML Web Sitelerini WordPress'e Yükleme veya Dönüştürme Nedenleri

Statik bir HTML web sitesinden bir WordPress web sitesine geçmenin ideal bir adım olmasının en önemli nedenlerinden bazıları şunlardır:

1. WordPress, web sitesi tasarımları için statik HTML şablonlarıyla kolayca mümkün olmayan, türünün tek örneği kullanıcı arabirimleri oluşturmak ve düzenlemek için harika bir araçtır.
2. WordPress, sitenizde size yardımcı olabilecek ve yeni gelenlerin geçmişteki zorluklarına rehberlik edebilecek güçlü bir geliştirici topluluğuna sahiptir.
3. Düzeni hızlı bir şekilde özelleştirmek istiyorsanız, düz HTML düzeni ile aynı şey elde edilemez. WordPress' Sayfa oluşturucu özellikleri, kullanıcının hareket halindeyken web sitesinin düzenini ve görünümünü ve hissini özelleştirmesine olanak tanır.
4. Mevcut HTML dosyalarınızı kullanmak istemiyorsanız, mevcut binlerce tema arasından seçim yapabilirsiniz. HTML görünümünüze ve hissine çok benzeyen bir tema bulma ihtimaliniz çok yüksek. Bu şekilde, mevcut HTML düzeninizi WordPress'e dönüştürmek için maliyet ve emekten tasarruf eder ve hazır şablonlardan yararlanırsınız.
5. WordPress, dönem içinde gelişti ve evrim sırasında WordPress topluluğu, SEO dostu olduğundan emin oldu. Bazı şaşırtıcı SEO artırma eklentileri var, böyle bir eklenti, WordPress'te SEO yönetimi için altın standart olan YOAST SEO'dur. Ticari web siteleri oluşturmanın nihai hedefi olan daha yüksek arama motoru sıralamalarına ulaşmaya yardımcı olur.

HTML Web Sitelerini WordPress'e Dönüştürmenin Farklı Yolları

HTML'yi WordPress'e dönüştürmenin neden tavsiye edildiğini tartıştıktan sonra, bunu nasıl başaracağımızı anlamaya çalışacağız.

Mevcut üç seçenek var

• Hepsini sıfırdan inşa etmeyi gerektiren manuel yöntem.
• Alt tema yöntemi, temel bir WordPress teması kullanmayı ve onu kendi özelliklerine göre özelleştirmeyi içerir.
• Eklenti tekniği.

Seçtiğiniz yöntem, kodlama bilginize, bu projeye ayırmayı düşündüğünüz süreye ve tercihlerinize bağlıdır.

HTML Web Sitesinin Manuel Olarak WordPress'e Dönüştürülmesi

Mevcut sitenizin HTML kodu, manuel dönüştürme için bir referans noktası olabilir. Uzmanlar, bu çeviri prosedürünü denemeden önce yeterli kodlama bilgisine sahip olmanızı tavsiye ediyor. Özellikle HTML, CSS ve PHP'ye aşina olmalısınız.

HTML'yi manuel olarak WordPress'e nasıl dönüştüreceğiniz aşağıda açıklanmıştır:

1. Adım: Yeni bir tema klasörü oluşturun

Tema dosyalarınızı depolamak için PC'nizde yeni bir dosya oluşturun. Bu kategoriye istediğiniz herhangi bir isim vermekte özgürsünüz (özniteliğin adı olarak işlev görecektir). Uygun dosyaları oluşturun ve tercih ettiğiniz kodlama düzenleyicide açık tutun:

1. Stil.css
2. index.php
3. Header.php
4. Kenar çubuğu.php

2. Adım: CSS kodunu yeni stil sayfasına kopyalayın

Dosyaları oluşturduktan sonra CSS kodunuzu yeniden kopyalayabilirsiniz. Sitelerini kopyalamak ve WordPress'e taşımak isteyenlerin, önceki konumlarından CSS kodunu bulmaları ve çıkarmaları gerekecektir. style.css dosyası sitenin görünümünden sorumludur. Bu nedenle, ona aşağıdaki satırları ekleyin:

 /* Theme Name: Replace with your Theme's name Theme URI: Your Theme's URI Description: A brief description Version : 1.0 Author: You Author URI: Your website address */

3. Adım: Geçerli HTML kodunu ayırın

Başlamak için index.html dosyasını açın.

Üretilen WordPress dosyalarından kodu kopyalayın ve aşağıdaki alanlara yapıştırın:

1. Header.php — Bu dosya, HTML kodunuzun girişinden ana içerik alanına kadar her şeyi içerir. </head> bölümünden hemen önce <?php wp_head();?> dosyasını kopyalayıp yapıştırmanız gerekecek.
2. Sidebar.php — Burası, <aside> bölümündeki tüm kodu ekleyeceğiniz yerdir.
3. Footer.php — Bu bölüm, kenar çubuğunun altından dosyanın üstüne kadar çalışır. Köşeli ayracı </body> ile bitirmeden önce <?php wp_footer();?> için bir çağrı ekleyin.

Adım 4: WordPress için Header.php ve Index.php'yi değiştirin

Ardından header.php ve index.php'yi WordPress formatına uyacak şekilde değiştireceksiniz.

 <?php if (have_posts()) : ?> <?php while have_posts()) : the_post(); ?> <div <?php post_class(); ?>> <div class="post-header"> <div class="date"X?php the_time( 'My'); ?X/div> <h2><a href="<?php the permalink(); ?>" rel="bookmark" title="Permanent link to <?php the_title_attribute(); ?>"X?php the_title(); ?X/ax/h2> <div class="author"X?php the_author(); ?></div> </divx!--end post header--> <div class="entry clear"> <?php if ( Eunction_exists( 'add_theme_support' ) ) the_post_thumbnail(); ?> <?php the_content(); ?> <?php edit_post_link(); ?> <?php wp_link_pages(); ?X/div> <!--end entry--> <div class="post-Footer"> <div class="comments"X?php comments_popup_link( 'Leave a Comment', '1 Comment', '? Comments! ); ?X/div> </divX!--end post footer--> </div><!--end post--> <?php endwhile; /* rewind or continue if all posts have been fetched */ ? > <div class="navigation index"> <div class="alignleft"><?php next_post_link( 'Older Entries'); ? X/div> <div class="alignright"X?php previous_posts_link( 'Newer Entries' ); ?></div> </divx<!--end navigation--> <?php else : ?> <?php endif; ?>

Bunu yapmak için <head> bölümünde şuna benzeyen bir bağlantı arayın:

 <link rel=”stylesheet” href=”style.css”>.

Önceki URL'yi bununla değiştirin:

 <link rel=”stylesheet” href=”<?php echo get_template_directory_uri(); ?>/style.css” type=”text/css” media=”all” />

Şimdi header.php dosyasını kaydedin ve çıkın.

index.php dosyasını web tarayıcınızda açın. Boş olması gerekiyordu.

Boşlukları tam olarak aşağıdaki gibi doldurun:

 <?php get_header(); ?> <?php get_sidebar(); ?> <?php get_footer(); ?>

Adım 5: Yeni temanızı indirin

Tema klasörünüz tamamlandığında, web sitenize yükleyin ve HTML'den WordPress'e dönüşümünü tamamlayın. Bunu yapmak için WordPress'i indirdiğiniz yere gidin ve yeni oluşturulan klasörü / wp-content / temasına ekleyin.

Öznitelik adının var olup olmadığını görmek için WP-Admin sayfanızdaki, temanızdaki ve temalardaki öznitelikler listesini kontrol edin. Bu durumda, her şeyi doğru yaptınız ve şimdi etkinleştirebilirsiniz.

Bir WordPress Alt Teması aracılığıyla HTML Web Sitesini Dönüştürme

1. Adım: Bir tema seçin

Her şeyden önce, uygun bir HTML tasarım teması seçin. Mevcut web sitenize benzer bir alt tema arayın. İçerdiği kalıbı bulursanız, kodlamayı çok aramayacaksınız.

Temel kod satırları üzerine kurulduğu için başlangıç ​​özelliğini sağlamalısınız.

2. Adım: Yeni bir tema klasörü oluşturun

Aynı şekilde son yöntemde de yaptınız ve masaüstünüzde yeni bir klasör oluşturacaksınız.

Klasör, ana stil ile aynı başlığa sahip olmalı, ancak sonuna “-child” eklenmelidir. İsimde boşluk olmaması gerektiğini unutmayın.

3. Adım: Yeni bir sayfa stili oluşturun

Ardından, klasör içinde bir style.css dosyası oluşturun ve ek kod satırları ekleyin:

Bunun sadece bir örnek olduğunu unutmayın. Ayrıntılarınızla baştan başlamanız gerekecek. İşlem bittiğinde dosyayı kaydedin.

 Theme Name: Twenty Nineteen Child Theme URI: http://example.com/twenty-nineteen-child/ Description: Twenty Nineteen Child Theme Author: John Doe Author URI: http://example.com Template: twentynineteen Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gp1-2.0.html Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready Text Domain: twenty-nineteen-child */

Adım 4: Bir Functions.php oluşturun

Ardından, alt tema için bir function.php dosyası yazacak ve ana stilleri kopyalayacaksınız.

Bunu gerçekleştirmek için function.php adlı yeni bir dosya oluşturun. Başlamak için <?php.ini olduğundan emin olun. etiket.

Şimdi kutuya aşağıdaki kodu yazın:

 function child_theme_enqueue_styles() { $parent_style = 'parent-style'; wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' ); wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array( $parent_style ), wp_get_theme()->get('Version') ); } add_action( 'wp_enqueue_scripts', 'child_theme_enqueue_styles' );

Bu kod, WordPress'e ana temaya gitmesini ve alt temanın orada belirtilen stillerini kullanmasını söyler.

Adım 5: Çocuğun konusunu etkinleştirin

Son olarak, temayı yapılandırmanız gerekir. Klasörü WordPress'e göndermeden önce Görünüm menüsü, Temalar ve ardından "Yeni Ekle"yi kullanarak sıkıştırılmış dosyayı açın. Oradan zip dosyasını alabilirsiniz. Başka bir seçenek olarak wp-content/tema klasörüne bakın.

Bir Eklenti kullanarak İçeriğinizi HTML Web Sitesinden WordPress'e Aktarın

1. Adım: Yeni bir site kurun

Tercih ettiğiniz WordPress temasını yeni sitenize indirin. İstediğiniz bir şablon olduğundan ve hızlı bir şekilde değişebildiğinden emin olun. Kimliğinize uyması için görünümü güncellemeniz gerekir.

2. Adım: Eklentiyi Kurun

İlk adım, HTML Import 2 eklentisini indirip kurmaktır. (WordPress Eklentilerinin kullanımı güvenli mi? Daha fazla bilgi için okumaya devam edin). Bunu yapmanın en basit yolu, Eklentiler > Yeni Ekle'ye gidip eklentinin adını WordPress Yönetici Panelinize yazmaktır. Ekranda bulduğunuzda Şimdi Kur'a tıklayın (alta yakın olabilir). Bittiğinde, başlatın.

3. Adım: Sayfaları yükleyin

Eklenti yüklendikten sonra sayfalarınızı WordPress kurulumunuzla aynı sunucuda yayınlayın.

Doldurmanız gereken bilgiler:

• İçe Aktarılacak Dizin
• Eski site URL'si
• Varsayılan Dosya
• Dahil edilecek dosya uzantıları
• Hariç tutulacak dizinler
• Dosya adlarını koru

Bundan sonra, içerik sekmesine gidin ve sitenizin içeriğini taşıyan HTML öğesini yapılandırın.

İkinci adım, eski URL'lerden yeni URL'lere bir yönlendirme ayarlamaktır. Bu şekilde mevcut herhangi bir SEO değerini kaybetmezsiniz.

Seçeneklerinizi kaydedin ve ardından her sekmeden geçtikten sonra Dosyaları İçe Aktar'ı tıklayın.

Çözüm

Günümüzün sürekli değişen rekabetçi pazarında, esnek bir WordPress web sitesine sahip olmak, şirketinizin gelişmesi için en etkili yol olabilir.

Bir WordPress web sitesinin hızını artırmak için kullanışlı püf noktaları ve yüksek trafik için WordPress web sitenizi büyütmenin yolları ile WordPress, büyük veya küçük işletmelerinizle birlikte gelişebilir.

HTML'den WordPress'e dönüştürücü eklentileri uygun bir çözüm gibi görünse de, özellikle bir HTML web sitesini WordPress temasına dönüştürürken insan kodlamasıyla elde edilen sonuçlarla karşılaştırılamazlar.

Statik bir HTML sitesinden WordPress platformu gibi yerleşik yeteneklere sahip daha etkili bir içerik yönetim sistemine geçmek, özellikle Wix gibi diğer benzer platformlarla karşılaştırıldığında, varsa iyi bir seçenektir. HTML'yi WordPress'e dönüştürdüğünüzde, WordPress temaları ve kullanıcı dostu WordPress özellikleri sayesinde sitenizin yönetimini ve yönetimini kolaylaştırır. Çok sayıda başka hizmet arasında özel WordPress çözümleri için Bize Ulaşın ve Creole Studios ile fikirlerinizi gerçeğe dönüştürün!