Php Wordpress在特定类别的帖子中具有独特的背景_Php_Css_Wordpress

Php Wordpress在特定类别的帖子中具有独特的背景

php css wordpress

Php Wordpress在特定类别的帖子中具有独特的背景,php,css,wordpress,Php,Css,Wordpress,我有一个密码： <body <?php if( in_category( 11446 ) ) { echo "style=\"background-image: url('my-background-url-of-image');background-repeat:repeat;\" onclick=\"window.open('http://www.domain.com');\""; } ?> > 我假设您正在构建Wordpress模板，并且要使用的背景图像基于Wor

我有一个密码：

<body <?php if( in_category( 11446 ) ) { echo "style=\"background-image: url('my-background-url-of-image');background-repeat:repeat;\" onclick=\"window.open('http://www.domain.com');\""; } ?> >

我假设您正在构建Wordpress模板，并且要使用的背景图像基于Wordpress帖子的类别
这不使用Javascript。相反，它所做的是在HTML5文档的head标记中动态创建CSS声明块。它不为body标记提供内联CSS
<?php
// ====================================================
// Solution #1
// Background Image Only
// ====================================================

function GetThisWordpressPostCategory() {
  // Do post category to filename mapping here
  return("cars");
}

function in_category() {
  // Just a dummy to simulate Wordpress in_category call
  return(true);
}

function BodyBackground($category) {
  $bodyCss = "";
  if (in_category($category)) {
    $bodyCss =<<<CSS
<style type="text/css">
body {
  background-image: url('{$category}.jpg');
}
</style>
CSS;
  }
  return($bodyCss);
}
?>

<!DOCTYPE html>
<html>
  <head>
    <title>Category background</title>
    <?php
    $category = GetThisWordpressPostCategory();
    echo BodyBackground($category);
    ?>
  </head>
  <body>
  </body>
</html>


<?php
// ====================================================
// Solution: 2
// Clickable div spanning viewport
// ====================================================


function GetThisWordpressPostCategory() {
  // Do post category to filename mapping here
  return("cars");
}

function in_category() {
  // Just a dummy to simulate Wordpress in_category call
  return(true);
}

function PageCss($category) {
  $pageCss = "";
  if (in_category($category)) {
    $pageCss =<<<CSS
<style type="text/css">
html, body, #page {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  background-image: url('{$category}.jpg');
}
#page-anchor {
  display: block;
  width: 100%;
  height: 100%;
}
</style>
CSS;
  }
  return($pageCss);
}
?>

<!DOCTYPE html>
<html>
  <head>
    <title>Category background</title>
    <?php echo PageCss(GetThisWordpressPostCategory()); ?>
  </head>
  <body>
    <div id="page">
      <a id="page-anchor" href="http://www.google.com"></a>
    </div>
  </body>
</html>


类别背景
类别背景
感谢您的回复，我不是在构建新主题，我是在header.php中使用该代码来简单地在特定类别的帖子中显示新的背景，但我没有这样做，因为onclick函数无法正常工作。为什么需要单击以加载背景图像？只要使用我的代码。这与根据类别指定背景图像相同，但通过CSS而不是Javascript进行。我想要可点击的背景，因为我想使用赞助商广告，一旦点击了背景，用户将被重定向到赞助商网站。目前，我的代码背景显示，但问题是，一旦网站加载满，它就无法点击。你的代码比我看到的要好得多，但我不知道如何用你的代码应用可点击的背景。这张图片适合响应性强的网页设计吗？所以它在手机、平板电脑和桌面屏幕尺寸下看起来很好？我尝试放置的可剪切图像是265x76，我只使用了重复css功能。主要目标是简单地制作可剪辑的背景，并且使用我提供的代码，它只能在网站加载满后才能工作，因为javascript出现了一些我无法检测到的情况，所以可能需要使用href。