워드프레스 만들기

워드프레스 테마 만들기 튜토리얼!

초보자를 위한 단계별 가이드, PHP, HTML, CSS를 활용한

커스텀 테마 제작 방법, 그리고 다양한 팁과 예제를 제공합니다.

워드프레스 기본폴더 만들기 – 2

E, Rhymix, 그리고 그누보드 모두 스킨이나 테마를 만들 때는 기본 테마나 스킨을 활용하는 것이 작업하기에 편리합니다.
하지만 불필요한 군더더기 없이 꼭 필요한 내용만 담긴 테마나 스킨을 찾기가 쉽지 않았습니다.

그래서 구글링을 하면서, 다른 사람들도 활용할 수 있는 기본 테마를 직접 만들어 보았습니다.
파일 구성은 basictheme 라는 폴더명에 style.css, functions.php, index.php, header.php, footer.php, sidebar.php 파일로 이루어져 있습니다.


style.css

/*
Theme Name: Basic Theme
Theme URI: https://doorweb.net/
Author: Your Name
Author URI: https://doorweb.net/
Description: A basic WordPress theme.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: basictheme
*/

funtion.php

<?php
function basictheme_setup() {
    // 테마 지원 추가
    add_theme_support('title-tag');
    add_theme_support('post-thumbnails');
    add_theme_support('custom-logo');

    // 메뉴 등록
    register_nav_menus(array(
        'primary' => __('Primary Menu', 'basictheme'),
    ));
}

add_action('after_setup_theme', 'basictheme_setup');

function basictheme_enqueue_styles() {
    wp_enqueue_style('basictheme-style', get_stylesheet_uri());
}

add_action('wp_enqueue_scripts', 'basictheme_enqueue_styles');

index.php

<?php get_header(); ?>

<div id="content">
    <?php
    if ( have_posts() ) :
        while ( have_posts() ) : the_post();
            the_title('<h2>', '</h2>');
            the_content();
        endwhile;
    else :
        echo '<p>No content found</p>';
    endif;
    ?>
</div>

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

header.php

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
    <meta charset="<?php bloginfo('charset'); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
    <header>
        <h1><a href="<?php echo esc_url(home_url('/')); ?>"><?php bloginfo('name'); ?></a></h1>
        <nav>
            <?php
            wp_nav_menu(array(
                'theme_location' => 'primary',
                'menu_class' => 'nav-menu',
            ));
            ?>
        </nav>
    </header>

footer.php

<footer>
        <p>&copy; <?php echo date('Y'); ?> <?php bloginfo('name'); ?></p>
    </footer>
    <?php wp_footer(); ?>
</body>
</html>

sidebar.php

<aside>
    <?php if (is_active_sidebar('main-sidebar')) : ?>
        <?php dynamic_sidebar('main-sidebar'); ?>
    <?php endif; ?>
</aside>

테마 다운로드

Categories: 워드프레스 만들기