2015-03-31 4 views
0

У меня есть этот код в моей таблице стилей:Различные CSS на домашней странице

#social-icons { 
    width:100%; 
} 
#social-icons li { 
    float:right; 
    display: inline; 
    list-style-type:none; 
    padding: 10px 10px 10px 10px; 
    width:50px; 
    height:50px; 
    text-decoration: none; 
} 

Я хотел бы, чтобы #social-icons lifloat:left на всех страницах, кроме главной страницы.

ответ

1

В header.php файле вашей темы, перед тем </head> тег, просто поместите этот код:

<?php 
if(!is_homepage()) 
{ 
?> 
    <style type="text/css"> 
    #social-icons li {float:left} 
    </style> 
<?php 
} 
?> 

Если вы не хотите прикоснуться к вашей теме, вы можете использовать wp_head action hook.

После комментария Бруно Toffolo в

Если вам не нравится встроенный CSS, вы можете поставить стартовые конкретные правила CSS в другой файл CSS, как homepage.css, а затем Ставить этот CSS-файл с is_homepage() условно тег.

<?php 
if(!is_homepage()) 
{ 
    wp_enqueue_style(...); 
} 
?> 
+0

Я бы +1 вашей должности, но встроенный CSS просто так некрасиво. :( –

+1

@BrunoToffolo вы можете поместить правила css на домашнюю страницу в другой файл css, например ** homepage.css **, а затем вставить этот файл css в условный тег 'is_homepage(). – Eray

+0

Теперь это лучше: D –

1

Большинство WordPress темы дают CSS крюк для домашней страницы, а также ряд других факторов, путем добавления различных классов к body тега. Попробуйте сравнить тег body на своей домашней странице и на другой странице.

На сайте я работаю, вот тег для домашней страницы:

<body class="home page page-id-33 page-template-default"> 

А вот для внутренней страницы:

<body class="page page-id-285 page-parent page-template page-template-page-market page-template-page-market-php"> 

Классов, приложенной к <body> позвольте мне написать различные CSS в этом случае на основании того, является ли страница:

  • домашняя страница,
  • страница (в отличие от должности),
  • страницы с детьми (потомками в иерархии страниц),
  • страница с шаблоном по умолчанию, или
  • страница с определенным шаблоном страницы.

Чтобы настроить таргетинг на домашней странице, в вашем случае, вы бы написать:

#social-icons li { 
    float: left; 
} 

.home #social-icons li { 
    float: right; 
} 

Это должно дать вам float: left на всех страницах, кроме дома, где он будет float: right.

Если вы не видите различий в теге body между домашней страницей и другими страницами, то ваша текущая тема не имеет этой функции. Вы должны будете редактировать любые файлы, содержащие тег body. Большинство тем соответствуют стандартной практике включения этого только один раз, в header.php.

Где бы вы найти тело тега, замените <body> с

<body <?php body_class(); ?> > 

Если вы хотите, вы можете включить строку текста в функции, например:

<body <?php body_class('sammich'); ?> > 

Это будет иметь эффект добавления «sammich» к классам в теге body.

Примечание. Если вы сделаете это по вашей теме, обновите тему, ваши изменения в кодировке будут потеряны. Подумайте о том, чтобы сделать быстрый Child Theme.

Подробнее @http://codex.wordpress.org/Function_Reference/body_class

+1

Я бы добавил что если это не присутствует в теме, добавьте '' в элемент '' в заголовке или соответствующем файле шаблона. Также обратите внимание, что вы можете добавить класс (ы) путем передачи строки или массива с помощью этой функции. –

+0

Очень хорошая идея. Я обновил свой ответ, чтобы включить это-спасибо! –

+0

Выглядит хорошо. Вам не хватает закрывающего '' 'на' ' в вашем объяснении body_class() Я попытался предложить редактирование, но он не позволит мне добавить только 2 символа. –

Смежные вопросы