WordPressのPHP関数でCSSを呼び出す方法

Question

WordPressテーマで作業していますが、CSSの変更を1ページだけでなくすべてのページに適用できるようにしたいとします。フロントページの変更、私はfunctions.phpでこれを呼び出すことができるようにしたいが、それをどのように呼び出すかはわからない。任意の提案のfunctions.phpファイルに、PHPの関数の中で

をCSSを呼び出す方法を一言で言えば

、？

テンプレート-frontpage.php

<?php 
/** 
* Template Name: Front Page 
* 
* @package Eli 
*/ 
get_header(); 

$hero = cs_get_option('hero_image'); 
?> 

<style type="text/css"> 

.hero:before{ 
background-color:<?php echo cs_get_option('hero_color_picker');?>; 

} 


.hero:after{ 
background-color:<?php echo cs_get_option('hero_color_picker');?>; 

} 

a{ 
    color: <?php echo cs_get_option('link_color');?>; 
} 

footer a{ 
    color:<?php echo cs_get_option('link_color');?>; ; 
} 



</style> 

<div class="row"> 
    <div class="hero" style="background-image:url(<?php echo $hero; ?>); width:100%; min-height:350px; background-size: cover;"> 
     <div class="container"> 
      <div class="col-md-12"> 
       <header class="hero-text"> 

       <?php if (get_field('hero_title')):?> 

        <h1 style="color:#fff;"><?php the_field('hero_title'); ?></h1> 

       <?php endif;?> 

       <?php if (get_field('hero_span')):?> 

        <span><?php the_field('hero_span'); ?></span> 

       <?php endif;?> 


       <?php if (get_field('hero_span_2')):?> 

        <span id="move"><?php the_field('hero_span_2'); ?></span> 

       <?php endif;?> 




       </header> 

      </div> 
     </div> 
    </div> 
</div> 
<section class="section-home"> 
    <div class="row"> 
     <div class="container"> 
      <div class="line"></div> 
      <?php if (get_field('content_block_left')):?> 
      <div id="cbl" class="col-md-4 col-xs-12"> 
       <?php the_field('content_block_left_icon'); ?> 
       <?php the_field('content_block_left'); ?> 

      </div> 
      <?php endif;?> 
      <?php if (get_field('content_block_left2')):?> 
      <div id="cbl" class="col-md-4 col-xs-12 "> 
       <?php the_field('content_block_left_2_icon'); ?> 
       <?php the_field('content_block_left2'); ?> 

      </div> 
      <?php endif;?> 
      <?php if (get_field('content_block_left3')):?> 
      <div id="cbl" class="col-md-4 col-xs-12"> 
       <?php the_field('content_block_left_3_icon'); ?> 
       <?php the_field('content_block_left3'); ?> 

      </div> 
      <?php endif;?> 

     </div> 

    </div> 
</section> 
<div class="section-about"> 
    <div class="row"> 
     <h1>Beat Your Rivals</h1> 
     <div class="line"></div> 
     <div class="container"> 
      <?php if (get_field('image_left')):?> 
      <div id="cbl2" class="col-md-6 offset-md-3 col-xs-12"> 

       <img src="<?php echo the_field('image_left'); ?>" width:"400px" height:"300px"> 

      </div> 
      <?php endif;?> 
      <?php if (get_field('caption_text')):?> 
      <div id="cbl2" class="col-md-6 offset-md-3 col-xs-12"> 

       <?php the_field('caption_text'); ?> 

      </div> 
      <?php endif;?> 
     </div> 
    </div> 
</div> 
<?php 
$image2 = get_field('test_image'); 
?> 
<div class="section-test" style="background-image:url(<?php echo $image2['url'];?>); width:100%; min-height:300px; background-size: cover;"> 
    <div class="row"> 
     <div class="container"> 
      <?php if (get_field('test_text')):?> 
      <div id="cbl3" class="col-md-12 col-xs-12"> 

       <?php the_field('test_text'); ?> 

      </div> 
      <?php endif;?> 

     </div> 
    </div> 
</div> 


<div class="about-us"> 
    <div class="row"> 

     <div class="container"> 

     <?php if (get_field('about_us')):?> 
      <div class="col-md-12 col-xs-12"> 

       <?php the_field('about_us'); ?> 

      </div> 
     <?php endif;?> 


     </div> 
    </div> 
</div> 



<?php 
$image3 = get_field('cons_image'); 
?> 

<div class="consult"> 
    <div class="row"> 
     <div class="my-block-left" style="background-image:url(<?php echo $image3['url'];?>); background-size: cover;" > 

      <div class="container"> 

      <?php if (get_field('consult_us')):?> 
       <div class="col-md-12 col-xs-12"> 

        <?php the_field('consult_us'); ?> 

       </div> 
      <?php endif;?> 


      </div> 


     </div> 
    </div> 
</div> 


<?php if (get_field('contact_us')):?> 
<div class="contact-us"> 
    <div class="row"> 

     <div class="container"> 

     <h1 class="contact-h1">Contact Us</h1> 

     <div class="line"></div> 


      <div class="col-md-12 col-xs-12"> 

       <?php the_field('contact_us'); ?> 

      </div> 



     </div> 
    </div> 
</div> 
<?php endif;?> 

<?php get_footer(); ?> 

Answer 1

わからないあなたは、CSSをエンキューする方法または特定のページへのCSSを制限する方法を知りたい場合はそう

スタイルがあなたの関数で使用含めることができます。これらのスタイルを使用するかどうかをどこPHP

function site_styles() { 
    wp_register_style('global-css', get_template_directory_uri() . '/assets/css/global.css'); 
    wp_register_style('frontpage-only-css', get_template_directory_uri() . '/assets/css/frontpage.css'); 
} 
add_action('init', 'site_styles'); 

あなたが決めることができるよりも

// is_front_page() 
// is_page(XX) - is page id XX 
// is_single() && get_post_type()="custom_post_type" - single for custom posts 
// more about conditional tags: https://codex.wordpress.org/Conditional_Tags 

function enqueue_styles() { 
    if (is_front_page()) { 
     wp_enqueue_style('frontpage-only-css'); 
    } else { 
     wp_enqueue_style('global-css'); 
    } 
} 
add_action('wp_enqueue_scripts', 'enqueue_styles');