WordPressのカスタムページテンプレートを設計する方法[UPDATE2021]

Cutsom WordPressのテンプレート

WordPressのテーマは 彼らはWordPressのwebデザインをとても簡単にします。

しかし、あなたが選択したテーマを超えたいときはどうなりますか?

特定のページでカスタムWordPressレイアウトを使用したい場合はどうすればよいですか?

まあ、いくつかのテーマは、あなたがそれらのレイアウトを変更することはできません。

私のミームの画像結果

しかし、これにはいくつかの回避策があります。

カスタムページテンプレートとは何ですか?

WordPressのページと投稿のレイアウトは、”page”という名前のテンプレートファイルによって制御されます。php”。 テンプレートは、さまざまな種類のコンテンツを表示する方法をWordPressに伝えるファイルです。

今、あなたはすべてのページと投稿が同じに見えるようにしたくないかもしれません。 これは、カスタムページテンプレートが必要な場合です。

あなたはどのようなWordPressのページテンプレートを使用していますか?

どのページテンプレートを使用しているか、またはテンプレートを切り替える方法を知りたいですか?

それは簡単ですpeasy、あなたはする必要があります:

  1. WordPress管理ダッシュボードに移動し、
  2. 左のメニューから”ページ”を選択し、
  3. ページのタイトルにカーソルを合わせ、WordPressのすべてのページ
  4. タイトルの下のメニ編集”ウィンドウ、”テンプレート”ドロップダウンに移動します。

WordPressのテンプレート

ここでは、利用可能なすべてのテーマテンプレートを見ることができ、あなたの現在のページに別のテンプレートを割り当てるこ

たとえば、必要に応じてページを全幅に変更するオプションがあります。 しかし、第二のサイドバーを追加するテンプレートのオプションはありません。

カスタムWordPressのテンプレートが便利になることができる理由です。 新しいテンプレートを保存するたびに、それは同様に古いものと一緒に利用できるようになります。

今、あなたは同様にページ内でこの割り当てを行う割り当てることができます。 ページを編集する場合は、右側の”ページ属性”->テンプレートに移動します。

ページテンプレートを割り当てる

子テーマを作成する方法

さて、WordPressのカスタムページテンプレートを作成することで手を汚す前に、心に留めておくべき 親テーマに不可逆的な変更を加えたくないでしょう。

WordPressの子テーマは、親テーマのすべての機能とスタイルを継承するサブテーマです。 これで、親テーマが更新を取得しても、子テーマは影響を受けず、変更は上書きされません。

さて、どのようにして子テーマを作成しますか? 手順は次のとおりです:

  1. あなたのcPanelにログインし、
  2. ファイルマネージャに移動し、cPanel内のアクセスファイルマネージャ
  3. 頭の上public_html->wp-content->テーマフォルダ、cPanel内のアクセステーマフォルダ
  4. “Themes”フォルダ内にある間、”+Folder”から新しいフォルダを追加します。上のメニュー。 それに名前を付けます。 ベストプラクティスは、”-child”を追加するテーマの名前を使用することです。 また、スペースの代わりにハイフンを使用します。 私の場合、Mesmerizeテーマを使用しているため、mesmerize-childを使用します。
  5. フォルダー内に新しいファイルを作成し、「スタイル」と呼びます。css”,スタイルを作成します。cPanelでのcss
  6. . ファイルを右クリックし、”編集”オプションを選択します。
    /* Theme Name: Your Theme Child Theme URL: http://yourdomain.comDescription: Your Theme Child Theme Author: Your NameAuthor URL: http://yourdomain.comTemplate: yourtheme Version: 1.0.0 Text Domain: yourtheme-child */

    ここでは、親CSSファイルにコードの一部を貼り付けるか、独自のスタイルを追加することができます。

  7. テーマとドメイン名を変更し、”保存”を押して、
  8. 同じフォルダに別のファイルを作成します。 今回は”関数”と名前を付けます。php”。 次のコードを貼り付けます:
    <?phpadd_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );function enqueue_parent_styles() { wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );}?>
  9. ワードプレスのダッシュボードに移動し、外観->テーマ。 あなたの子供のテーマは、あなただけのそれを有効にする必要があり、そこになります。

これで完了です。

次は、新しいテンプレートを作ってみましょうか?

WordPressのカスタムページテンプレートを作成するには?

既存のテーマコードから開始し、必要な調整を行うことができます。

:

  1. cPanelに移動->ファイルマネージャ、
  2. public_htmlに移動->wp-content->テーマフォルダ、
  3. メインテーマフォルダを開き、
  4. ページを識別します。phpファイル。 これは次のようになります:
    <?php mesmerize_get_header(); ?> <div class="page-content"> <div class="<?php mesmerize_page_content_wrapper_class(); ?>"> <?php while (have_posts()) : the_post(); get_template_part('template-parts/content', 'page'); endwhile; ?> </div> </div><?php get_footer(); ?>
  5. ファイルを選択し、「コピー」を選択し、
  6. ポップアップするウィンドウで、ファイルのパスをテーマの子フォルダのコピーページのパスに変更します。phpを新しいファイルの場所に
  7. 新しいファイルの名前を変更して、それが何をしているのかを簡単に識別できるようにします。
  8. これが新しいカスタムテンプレートであることをWordPressに伝えることができるように、ファイル内にコメントを追加します。 これを行うには、”編集”を選択し、次のテキストを挿入します。
    /* * Template Name: Your custom TEmplate's name * description: >- Explain what your new templates does */

    新しいファイルは次のようになります:

    <?php /* * Template Name: Custom Full Width * description: >- Page template without sidebar */mesmerize_get_header(); ?> <div class="page-content"> <div class="<?php mesmerize_page_content_wrapper_class(); ?>"> <?php while (have_posts()) : the_post(); get_template_part('template-parts/content', 'page'); endwhile; ?> </div> </div><?php get_footer(); ?>

ここに他のファイルのコピーを追加することもできます。 たとえば、シングルをカスタマイズできます。phpファイルは、ブログ記事のルックアンドフィールを変更します。

次に、袖を巻いてコードを書く必要があります。

そして、あなたはCSSのスタイルを変更したい場合は、子テーマカスタマイザー内、Aditional CSS内またはスタイル内でこれを行うことができます。cssファイル。

しかし、より簡単な解決策があります…Colibriのようなサイトビルダーでは、すべてのコードが後ろに”立って”、非技術的なサイト作成者をブロックしません。 カスタムページへのすべての追加または変更は、カスタマイザに視覚的に反映されます。 したがって、サイト作成者はデザインをより詳細に制御できます。 かなりカスタムページは、ページの背後にあるコードを気にすることなく、目の点滅で準備ができています。

Leave a Reply

コメントを残す

メールアドレスが公開されることはありません。