HTMLサイトをWordpressの自作テーマで再現する

実現したいこと

HTMLにて、すでに作成しているサイトについて、ヘッダーやフッターの共通化をphpで実施したいことや、ニュースサイトを管理していくにあたり、Wordpressを利用したいと思っている。

現在のサイトの見た目は変えたくないので、HTMLで作ったソースをもとに作成したいです。
現在ローカル環境で、Youtubeや解説ブログなどを見ながら作成しているのですが、うまくいかない部分があります。

なお、構造としては、
トップページは独立したデザインになっており、
子ページは同じようなデザイン、
ヘッダーからメインビジュアル、フッターは共通にしたいと思っています。

発生している問題・分からないこと

つまずいているのは、以下の部分です。

①CSSが反映されない
fanctions.phpにて、CSSを読み込ませていますが、反映されません。
HTMLでは、リセット・トップと子ページ共通(common)・トップページ用の3種類のCSSに分けていたため、これを変更しないで読み込もうと思っていますが、なぜか2つ名のstylecommon.cssだけ読み込まれず、全然違うフォルダを見に行ってしまいます。
具体的に検証ツールで見ると、themeフォルダより上のwp_adminフォルダを見に行ってしまいます。

②index.phpが、フッターが読み込まれません。
トップページはfront-page.phpを利用して作成していて、問題なくフッターが出ているのですが、
index.phpのほうは、フッターの表示がされません。

③Wordpressの管理ページのCSSが大幅に崩れている

該当のソースコード

php

1function my_stylesheets(){2 wp_register_style( 'reset', get_stylesheet_directory_uri().'/css/reset.css', array(), '1.0.0',false);3 wp_register_style( 'common', get_stylesheet_directory_uri().'/css/stylecommon.css', array(), '1.0.0', false);4 wp_enqueue_style( 'main', get_stylesheet_directory_uri().'/css/style.css', array('reset','common'), '1.0.0', false);5}6 7add_action('wp_enqueue_scripts', 'my_stylesheets');

<?php get_header(); ?> <main> <?php if(have_posts()): ?> <?php while(have_posts()): the_post(); ?> <?php the_content(); ?> <?php endwhile; ?> <?php endif; ?> </main> <?php wp_footer(); ?>

試したこと・調べたこと

上記の詳細・結果

①CSSについては、1つの場合はそのままの記載でよいものの、2つ以上になる場合は、順番を記載する必要があることを確認し、実践するも、なぜか2つ目だけうまくいかない状態。
https://yuki.world/wp-include-scripts-howto/

②VSコードで見ても、huront-pageとの差がわからない

③wordpressのテーマを削除したことが問題かもと思い、インストール時のzipファイルを解凍しなおしたり、検証ソースコードを見てもファイルが足りないようには見えなかった。Apacheの起動しなおしなども試した。

補足

特になし

コメントを投稿

0 コメント