在WordPress中使用PHP更改CSS样式

I'm somewhat new to PHP and WordPress and I'm trying style a menu plugin (their support is busy) based on what page the user is on.

What I want is for the background and other styles to change if it isn't on the front page.

I've tested the CSS in inspect element so the selectors are correct, but I don't really know how to implement this in a clean and effective way.

The messy way would be to create another two menus (because top_navigation and main_menu are separate so 4 total) style those in their plugin settings and replace the two menus on the front page with two other ones when not on the front page using php. So if I need to make a change the menu's items I'd have to do it for two or four times which to me is stupid.


So far I've come up with creating a PHP variant of the style sheet and rewriting the URL to redirect from .css to .php however I don't really have a firm grasp on how I would do this from the root directory's .htaccess as the location of the two style sheets are far from it.

Location of style sheets:/wp-content/plugins/hmenu/_frontend_files/_menu_5/_css
Name of style sheets: hero_menu_styles.css and hero_menu_styles.php
PHP Style sheet:

<?php 
header('Content-type: text/css; charset: UTF-8'); 
?>

/*  Normal CSS Here */

<?php 
if(!is_front_page())
{
echo "#hmenu_load_5 .hmenu_main_holder {background-color: #67b7e1;}"
}
?>

.htaccess:
I am almost 100% sure there is something wrong with this.
I have no idea what though.

# BEGIN WordPress

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase "/wp-content/plugins/hmenu/_frontend_files/_menu_5/_css/"
RewriteRule ^hero\_menu\_styles\.css$ hero\_menu\_styles\.php [L]
</IfModule>

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

So I have a bunch of questions.

  1. Does echo work the way that I'm currently writing it assuming that it is in a stylesheet.php rather than a stylesheet.css?
  2. What if I were to reference an additional stylesheet.php on all my pages and just put it in there rather than rewriting my URLs? Is there a way to make sure it would override the other stylesheets?
  3. Can I have multiple .htaccess files
    (for example in /wp-content/plugins/hmenu/_frontend_files/_menu_5/_css)
    so I don't have to bother with long RewriteBase headaches?
  4. Am I correct in that I cannot just stick this code+css into my WordPress theme's header.php or functions.php?
  5. Do I need to require('/wp-load.php'); or load some WordPress functions (no idea what other than wp-load though) on my .php stylesheet if I wanted to use is_front_page()?

2个回答



如果您需要根据您是否在主页上设置菜单样式。 然后,您可以根据需要更改的内容简单地使用CSS选择器。 </ p>

目标主页菜单样式:</ p>

body.home .menu-class {background:#333;} </ code> < 页面上的目标菜单:</ p>

body.page .menu-class {background:#FFF;} </ code> </ p>

您可以在此处找到更多方案及其类: https:// codex。 wordpress.org/Function_Reference/body_class </ p>
</ div>

展开原文

原文

If you need to style a menu based solely on whether you are on the homepage or not. Then you can simply use CSS selectors based on what you need to change.

Target home page menu style:

body.home .menu-class {background: #333;}

Target menu on a page:

body.page .menu-class {background: #FFF;}

You can find more scenarios and their classes here: https://codex.wordpress.org/Function_Reference/body_class

dongzai2952
dongzai2952 非常感谢! 这真的帮助我避免了大量工作,从来不知道我只能使用CSS选择特定页面。
4 年多之前 回复
dpkpaxhzffixp8426
dpkpaxhzffixp8426 正确。 您可以从上面提供的链接中看到,您可以使用许多不同的主体类来定位特定元素。
4 年多之前 回复
douxianji6104
douxianji6104 因此,根据我的理解,如果我将某个样式应用于档案菜单,那么它将是body.archive#menu_load_5 .hmenu_main_holder {background-color:#67b7e1; }
4 年多之前 回复
douzhan6474
douzhan6474 对。 瞄准标准的WordPress体类绝对是这个方法。
4 年多之前 回复



试试此代码。</ p>

  echo“&lt; style&gt; 
#hmenu_load_5 .hmenu_main_holder
{
background-color:#67b7e1;
}
&lt; / style&gt;“;
</ code> </ pre>
</ div>

展开原文

原文

Try this code.

echo "<style>
#hmenu_load_5 .hmenu_main_holder 
{
background-color: #67b7e1;
}
</style>";

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐