🎄teratailクリスマスプレゼントキャンペーン2024🎄』開催中!

\teratail特別グッズやAmazonギフトカード最大2,000円分が当たる!/

詳細はこちら
CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

Q&A

解決済

1回答

564閲覧

WordPressの条件分岐タグでCSSファイルを読み込ませたいです。

ojakomaru

総合スコア10

CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

0グッド

0クリップ

投稿2021/01/13 03:33

前提・実現したいこと

WordPressにてファイルごとに条件分岐を書きそれぞれ別の
CSSファイルを読み込ませたいです。
下記カスタム投稿アーカイブページ用とあるあたりが怪しいのですが、ほかのCSSファイルは問題なく
読み込まれており、カスタム投稿アーカイブページ用のなにかがいけないのかもしれません。

該当のソースコード

PHP、HTML

<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="https://kit.fontawesome.com/fb19e987ff.js" crossorigin="anonymous"></script> <?php if(is_front_page()) { ?><!-- ホーム画面用 --> <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url');?>/style.css"> <?php } else if(is_page('company')){ ?><!-- 会社概要用ページ --> <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url');?>/css/style-company.css"> <?php } else if(is_page('service')) {?><!-- サービス案内ページ用 --> <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url');?>/css/style-service.css"> <?php } else if(is_page('recruit')) {?><!-- RECRUIT情報ページ用 --> <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url');?>/css/style-recruit.css"> <?php } else if(is_page('contact')) {?><!-- お問い合わせページ用 --> <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url');?>/css/style-contact.css"> <?php } else if('is_archive'()) {?><!-- ニュース一覧ページ用 --> <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url');?>/css/style-archive.css"> <?php } else if(is_singular('works')) {?><!-- カスタム投稿ページ用 --> <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url');?>/css/style-works.css"> <?php } else if(is_post_type_archive('works')) {?><!-- カスタム投稿アーカイブページ用 --> <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url');?>/css/style-archiveworks.css"> <?php } else { ?> <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url');?>/style.css"> <?php } ?> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery/min.js"></script> <script type="text/javascript" src="<?php bloginfo("template_url");?>/ja/common.js"></script> <title>WordPress練習</title> <?php wp_head(); ?><!-- 必ずこの記述をココに!! --> </head> <body> <header class="inner"> <?php if(is_front_page()){ ?><!-- ホーム画面用 --> <logo><a href="<?php echo home_url(); ?>"><img src="<?php bloginfo('template_url');?>/img/sample5.jpg" alt="会社のロゴです"></a></logo> <?php } else if(is_page('company')){ ?><!-- 会社概要用ページ --> <logo><a href="<?php echo home_url($path); ?>"><img src="<?php bloginfo('template_url');?>/img/sample4.jpg" alt="会社のロゴです"></a></logo> <?php } else if(is_page('service')){ ?><!-- サービス案内ページ用 --> <logo><a href="<?php echo home_url(); ?>"><img src="<?php bloginfo('template_url');?>/img/logo copy.png" alt="会社のロゴです"></a></logo> <?php } else if(is_page('recruit')){ ?><!-- RECRUIT情報ページ用 --> <logo><a href="<?php echo home_url($path); ?>"><img src="<?php bloginfo('template_url');?>/img/00002900.jpg" alt="会社のロゴです"></a></logo> <?php } else if(is_page('contact')){ ?><!-- お問い合わせページ用 --> <logo><a href="<?php echo home_url(); ?>"><img src="<?php bloginfo('template_url');?>/img/00002884.jpg" alt="会社のロゴです"></a></logo> <?php } else if(is_archive()){ ?><!-- ニュース一覧ページ用 --> <logo><a href="<?php echo home_url(); ?>"><img src="<?php bloginfo('template_url');?>/img/1.jpg" alt="会社のロゴです"></a></logo> <?php } else{ ?><logo><a href="<?php echo home_url(); ?>"><img src="<?php bloginfo('template_url');?>/img/logo copy.png" alt="会社のロゴです"></a></logo> <?php } ?> <ul> <a href="<?php bloginfo("url");?>/company"><li>会社概要<br><span>Company</span></li></a> <a href="<?php bloginfo("url");?>/service"><li>サービス紹介<br><span>Service</span></li></a> <a href="<?php bloginfo("url");?>/recruit"><li>採用情報<br><span>Recruit</span></li></a> <a href="<?php bloginfo("url");?>/contact"><li>お問い合わせ<br><span>Contact</span></li></a> </ul> </header> <div class="inner">

試したこと

条件分岐タグを網羅的にしらべたのですが、WordPressのコーデックスも現在開けなくなっており、
解決に至りません。

補足情報(FW/ツールのバージョンなど)

カスタム投稿アーカイブページ用以外のページは読み込まれており問題ありません。
下の方の画像に対しての条件分岐も問題ありません。
どうかお力添えをよろしくお願い申し上げます。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2021/01/13 05:54

質問に「WordPress」タグを追加してください。 むしろ「CSS」はメインではないです。
guest

回答1

0

自己解決

問題のコードより上に書いていいた。the_category()が優先して読み込まれていました。

投稿2021/01/28 03:54

ojakomaru

総合スコア10

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.36%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問