Different logo on homepage

时间：2013-01-24 作者：user26480

我上传了一个文件作为我的主题设置内的主徽标，但希望在主页上有一个不同的徽标。我正在使用的主题在主题设置中有一个自定义css选项，我可以使用自定义css仅在首页上更改它，而不更改网站的其余部分吗？

主题：http://demo.ghostpool.com/?theme=bounce-bp

4 个回复
最合适的回答,由SO网友:cpilko 整理而成

看起来主题设计师有办法让你在主页上使用不同的徽标。看着你的header.php 第83-93行。

如果您的主题检测到这是头版，标题将用<h1> 标签，否则会将其包含在<div>. 两者都有id=\'logo\'.

如果可以添加自定义css，则可以使用css image replacement 要替换此<h1> 在主页上标记不同的图像。

SO网友:Rick Benetti

在标题处。php您可以找到以下标记：

<div id="logo" style="">             
    <span class="logo-details">Bounce |   Example Homepage 1</span>
    <a href="http://demo.ghostpool.com/bounce" title="Bounce"><span class="default-logo"></span></a>                    
</div>
您只需访问a style colorchoose。css在第43行，并在类中更改图像路径。默认徽标，如果您使用chrome开发工具进行检查，您可以发现这个类使用我提到的这个类从CSS调用徽标。

知道如果这个主题提供了一个解决方案，以改变标志，这是另一种方式，他们不能帮助你。

如果需要帮助，请与我联系。

SO网友:Rafael Marques

有很多方法可以做到这一点。我们走吧。

1。只需头文件即可打开header.php 并查找何时显示徽标并添加有条件的主标签。类似这样：

<?php if(is_home()) { ?>
<!-- your custom logo for home here -->
<?php } else { ?>
<!-- your theme logo function here -->
<?php } ?>

2。使用CSS背景图像打开header.php 然后转到 标签添加body_class() 作用

<body <?php body_class($class); ?>>
现在，您可以使用CSS自定义主页上的任何元素。例如：

body.home .default-logo {background-image:url(your-custom-logo-for-home.jpg) !important;}

SO网友:marklchaves

您应该能够使用香草CSS。我无法访问您的网站，为您提供准确的CSS。但是，下面是一个使用Twenty Twenty 主题我处理的所有WordPress主题都遵循这种模式。

/* Twenty Twenty */

/** 
 * Hide the default logo. 
 *
 * For posts use .postid-1 format.
 */
.page-id-14 .custom-logo-link img {
    display: none;
}

/** 
 * Drop in a different logo.
 *
 * The site link is respected.
 */
.page-id-14 .custom-logo-link {
    background-image: url(https://balistreetphotographer.files.wordpress.com/2019/02/balistreetphotographer-logo-2-slashes-65.png);
    background-repeat: no-repeat;
    background-size: 100%;
    display: block;
    position: relative;
    height: 65px;
    width: 65px;
}
显然change 您的页面/帖子ID、徽标URL和徽标尺寸。

以下是如何获得page/post ID.

如果有任何问题，请大声喊叫：-）

结束
标签： themes   customization   css   小码农  

相关推荐

3.5媒体管理器将css/js添加到新的‘Tab’iFrame内容

在（耐心地）等待新媒体上传器的正确文档和/或一些教程的同时，我仍在使用media_upload_tabs筛选以向上载程序添加选项卡。这是我的（工作）代码：<?php add_filter( \'media_upload_tabs\', \'olab_add_media_tab\' ); function olab_add_media_tab( $tabs ) { $tabs[\'bildarkiv\'] = __( \'Bildarkiv\', \'bild