😊
まだまだ使える！一から学べるWordpressの超シンプルなテーマの作り方（初心者・学習者向け）※コード付き
まだまだ使える！一から学べるWordPressの超シンプルなテーマの作り方（初心者・学習者向け）※コード付き
はじめに
最近またWordPressについて教える機会が増えまして。
「まだ需要あるなぁ」ということで、「勉強するにはどこから始めたらいいの？」 という方向けに超シンプルなテーマを用意しました。
「説明とかいいからとりあえずテーマファイルが欲しい！」という方は、最後のコードをコピーして使ってくださいね。
WordPressとは？
WordPressってなに？
WordPress（ワードプレス）は、世界で最も人気のあるオープンソースのCMS（コンテンツ管理システム）です。ブログ、企業サイト、ECサイトなど、さまざまな種類のウェブサイトを簡単に構築できます。
WordPressの特徴
- 無料で使える（サーバーとドメインは別途必要）
- プラグインやテーマで拡張可能（機能を追加しやすい）
- 初心者でも比較的簡単にウェブサイトが作れる
- SEO対策がしやすい（Googleに好まれる構造）
- 大規模なコミュニティがある（情報が豊富）
本記事では、WordPressのテーマ開発に必要な基礎を学びながら、最小構成のテーマを作成していきます。
シンプルなテーマの作り方
1. テーマフォルダを作成
まずは、WordPressのテーマフォルダを作成しましょう。
wp-content/themes/simple-theme/ というフォルダを作成します。
2. 必要なファイルを作成
以下のファイルを作成します。
simple-theme/
├── style.css
├── index.php
├── header.php
├── footer.php
├── functions.php
├── screenshot.png
3. style.css を作成
style.css はWordPressテーマの情報を定義する重要なファイルです。
/*
Theme Name: Simple Theme
Theme URI: https://example.com/
Author: あなたの名前
Author URI: https://example.com/
Description: 超シンプルなWordPressテーマ
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: simple-theme
*/
4. index.php を作成
index.php はテーマのメインテンプレートです。
<?php get_header(); ?>
<main>
<h1>ようこそ！</h1>
<p>これは超シンプルなWordPressテーマです。</p>
</main>
<?php get_footer(); ?>
5. header.php を作成
ヘッダー部分を共通化するためのファイルです。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?php bloginfo('name'); ?></title>
<link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>">
</head>
<body>
<header>
<h1><?php bloginfo('name'); ?></h1>
</header>
6. footer.php を作成
フッター部分を共通化するためのファイルです。
<footer>
<p>© <?php echo date('Y'); ?> <?php bloginfo('name'); ?></p>
</footer>
</body>
</html>
7. functions.php を作成
functions.php はテーマの設定を記述するファイルです。
<?php
function simple_theme_setup() {
add_theme_support('title-tag');
add_theme_support('post-thumbnails');
}
add_action('after_setup_theme', 'simple_theme_setup');
8. screenshot.png を作成
screenshot.png は、WordPressの管理画面でテーマのプレビューとして表示される画像です。
- サイズ: 1200 × 900px（推奨）
- 内容: テーマのスクリーンショットやデザインのプレビュー画像
- 保存形式: PNG
画像を作成し、simple-theme フォルダに保存してください。
テーマを適用する
- 作成した
simple-themeフォルダをwp-content/themes/に配置します。 - WordPressの管理画面にログインし、「外観」→「テーマ」から「Simple Theme」を有効化します。
まとめ
これで超シンプルなWordPressテーマが完成しました！
このテーマをベースにして、カスタマイズを加えて自分だけのオリジナルテーマを作ってみてください！ 🚀
Discussion