TypographyをWordPressテーマに変換

php
CopyEdit

 language_attributes(); ?>>

    "">
    "viewport" content="width=device-width, initial-scale=1.0">
    
     wp_head(); ?>

 body_class(); ?>>
    

        
    

フッターの作成

フッター部分も同様に、固定テンプレートのHTMLをfooter.phpに変換します。以下はその例です。

php
CopyEdit


 wp_footer(); ?>

4. コンテンツの動的表示

固定テンプレートでは、コンテンツが手動で埋め込まれていますが、WordPressでは、コンテンツはWordPressの投稿やページとして保存され、動的に表示されます。これを実現するために、index.phpファイルにWordPressのループを追加します。

php
CopyEdit
 if ( have_posts() ) : ?>
     while ( have_posts() ) : the_post(); ?>
        

            
 the_title(); ?>
            
 the_content(); ?>
        
     endwhile; ?>
 else : ?>
    
 _e( 'No posts found.' ); ?>
 endif; ?>

5. カスタムメニューとウィジェットの追加

WordPressでは、メニューやウィジェットを簡単に追加できるので、これらも固定テンプレートに適用することができます。functions.phpでメニューを登録するためのコードを追加します。

php
CopyEdit
function typography_theme_setup() {
    register_nav_menus( array(
        'primary' => __( 'Primary Menu', 'typography-theme' ),
    ) );
}
add_action( 'after_setup_theme', 'typography_theme_setup' );

このコードをfunctions.phpに追加することで、WordPress管理画面からメニューを管理できるようになります。

6. テーマの有効化

すべてのファイルが整ったら、WordPressの管理画面にログインし、「外観」→「テーマ」で作成したテーマを選択し、有効化します。

最後に

Typographyの固定テンプレートをWordPressテーマに変換する作業は、HTMLとCSSの基本的な理解に加えて、WordPressのテンプレートタグやPHPコードの知識が求められます。上記の手順に従って、固定テンプレートのデザインを動的なWordPressテーマに変換することができます。テーマをカスタマイズすることで、より多くの機能を追加し、ユーザーにとって便利なサイトを作成できます。