Как отредактировать цвет шрифта H1 на одной странице?

Я работаю над новым сайтом, который включает членство, и я хотел бы, чтобы название страницы было другим цветом на странице членства, не меняя ни одной из других страниц. Я видел код, который помогает изменить цвет заголовка главной страницы (используя .home), но ни один из них не использует другую страницу. Заголовок страницы – «Голос, который заботится», поэтому, даже если я использую этот код, он не изменяется:

.a-voice-that-cares .gk-logo-text.inverse > span { color: blue!important; } 

или

 .a-voice-that-cares .h1 { color: blue!important; } 

Любая помощь / предложения будут очень признательны! Спасибо!

Solutions Collecting From Web of "Как отредактировать цвет шрифта H1 на одной странице?"

Если вы правильно используете body_class и post_class , у вас должны быть классы CSS, которые вы можете сопоставить с тем, который принимает форму postid-0001 т. Д.

Затем вам понадобится CSS для изменения цвета h1

Найдите идентификатор вашей страницы членства и используйте класс CSS в своем селекторе CSS, чтобы он соответствовал только этой странице.

например .postid-0001 h1 { color: red; } .postid-0001 h1 { color: red; }

Конечно, ваш членский титул не может быть элементом h1 , и на данный момент это чистый вопрос CSS. Используйте customizer, чтобы вставить свой CSS-код и hey presto, ваш цвет заголовка изменился

Во-первых, я бы рекомендовал вам создать специальную страницу шаблона ( документация по шаблонам WordPress ).

<?php /* Template Name: Example Template */ ?>

На вашей новой странице вы можете скопировать-вставить код HTML с page.php например, и быстро выполнить work-arround.

 <?php /* Template Name: Membership */ get_header(); ?> <div id="primary" class="site-content"> <div id="content" role="main"> <?php while ( have_posts() ) : the_post(); ?> <h1 class="membership-title"><?php the_title(); ?> <!-- Your content ... --> <?php endwhile; ?> </div> </div> <?php get_sidebar(); ?> <?php get_footer(); ?> 

И в вашем CSS вам нужно будет только создать свой класс.

 h1.membership-title { color: blue; } 

После того, как вы сохранили и загрузили свои файлы, вернитесь в панель администратора и измените parent атрибут страницы на тот, который вам нужен.

С помощью этого нового шаблона все страницы по умолчанию будут иметь стиль по умолчанию, который вы установили, и новая страница будет иметь новый стиль. Этот стиль будет применяться только к страницам, которые вы настроили для Membership .

Надеюсь, это то, что вы искали.

Вот как я это сделал (возможно, в функции active.php активной темы, так как вы пытаетесь повлиять на то, как выглядит страница):

 add_action( 'wp_enqueue_scripts', 'wpse_287062_add_style', 100 ); function wpse_287062_add_style() { if ( is_page( 'a-voice-that-cares' ) ) { wp_add_inline_style( 'stylesheet-handle', 'h1 { color: blue !important; }' ); } } 

Вам нужно будет разобраться с вашей stylesheet-handle вашей темы.

Для примера, как это сделать, я буду использовать текущую тему по умолчанию, Twenty Seventeen . Когда я просматриваю источник созданной WordPress страницы, использующей тему Twenty Seventeen, я вижу следующую строку:

 <link rel='stylesheet' id='twentyseventeen-style-css' href='http://example.com/wp-content/themes/twentyseventeen/style.css?ver=4.9' type='text/css' media='all' /> 

Рукояткой таблицы стилей является id , минус суффикс -css . Таким образом, в случае с Twenty Seventeen, stylesheet-handle в приведенном выше коде должен быть заменен на 20 twentyseventeen-style .

Рекомендации

  • is_page()
  • wp_add_inline_style()
  • wp_enqueue_scripts hook