2013年主题使用高于230px的徽标图像

时间:2014-05-12 作者:Alexander Farber

UPDATE: 我的问题并不离题,因为WordPress裁剪的是徽标图像,而不仅仅是CSS。

我正在尝试使用4724×2362 png图像作为网站徽标,位于a WordPress website 以股票二十三为主题。

默认情况下,裁剪图像高度(此处fullscreen) 你看不到坐在桌子旁的人的脸:

website screenshot

作为WordPress的新手,我在文件中编辑了第4.1节wp-content/themes/twentythirteen/style.css 并将230px更改为500px:

.site-header .home-link {
        color: #141412;
        display: block;
        margin: 0 auto;
        max-width: 1080px;
        min-height: 500px;
        padding: 0 20px;
        text-decoration: none;
        width: 100%;
}
现在“页眉”更高了,但我的问题是图像仍然被裁剪(我想在我将其设置为2013主题的“页眉图像”时)。

请告诉我如何修复此问题,可能需要在下面编辑一些PHP文件wp-content/themes/twentythirteen?

2 个回复
最合适的回答,由SO网友:Pieter Goosen 整理而成

首先,不要更改十三年主题中的任何文件。原因是,《第十三集》是定期更新的,所以如果你对主题进行了更改,你就可以WILL 把你所做的一切都放在主题上。您应该创建child theme

您需要更改设置页眉高度的函数才能正确裁剪图像。此函数可在“inc/custom”标题中找到。第30行的php。

“高度”=>230,

要更改此设置,请创建函数。php,并在函数中添加以下代码。您创建的php。此函数将覆盖默认高度并将其设置为500px

<?php
function my_custom_header_setup() {
    $args = array( \'height\' => 500 );
    add_theme_support( \'custom-header\', $args );
}
add_action( \'after_setup_theme\', \'my_custom_header_setup\' );
然后,您可以将您提到的以下样式添加到子主题的样式中。css

.site-header .home-link {
        color: #141412;
        display: block;
        margin: 0 auto;
        max-width: 1080px;
        min-height: 500px;
        padding: 0 20px;
        text-decoration: none;
        width: 100%;
}

SO网友:KnightHawk

如果您使用的是最新版本的wordpress,则在上载新图像时,可以在“自定义”菜单选项(外观下的左栏)中更改标题图像,并要求您将其裁剪到所需的位置。

如果您通过FTP(或其他方法)上传了替换图像,则可以尝试添加

.site-header {
     background-position:center center;
  }
这将使图像水平和垂直居中。只要图像没有被事先裁剪,这应该会给你一个更接近我认为你正在寻找的结果。

结束

相关推荐

Style.css重定向至404找不到页面

我刚刚从MAMP上传了一个wordpress站点到一个实时站点。与我通常上载它们的方法完全相同,包括permalinks和所有常见的PHPMyAdmin位。这次是风格。css、js和所有图像只是重定向到404页面。该网站是here有人能帮忙吗?这毫无意义。编辑:这里有一个标题片段。php:<!DOCTYPE html> <html lang=\'en\'> <head> <!-- Version 1.0 of Ken

2013年主题使用高于230px的徽标图像 - 小码农CODE - 行之有效找到问题解决它

2013年主题使用高于230px的徽标图像

时间:2014-05-12 作者:Alexander Farber

UPDATE: 我的问题并不离题,因为WordPress裁剪的是徽标图像,而不仅仅是CSS。

我正在尝试使用4724×2362 png图像作为网站徽标,位于a WordPress website 以股票二十三为主题。

默认情况下,裁剪图像高度(此处fullscreen) 你看不到坐在桌子旁的人的脸:

website screenshot

作为WordPress的新手,我在文件中编辑了第4.1节wp-content/themes/twentythirteen/style.css 并将230px更改为500px:

.site-header .home-link {
        color: #141412;
        display: block;
        margin: 0 auto;
        max-width: 1080px;
        min-height: 500px;
        padding: 0 20px;
        text-decoration: none;
        width: 100%;
}
现在“页眉”更高了,但我的问题是图像仍然被裁剪(我想在我将其设置为2013主题的“页眉图像”时)。

请告诉我如何修复此问题,可能需要在下面编辑一些PHP文件wp-content/themes/twentythirteen?

2 个回复
最合适的回答,由SO网友:Pieter Goosen 整理而成

首先,不要更改十三年主题中的任何文件。原因是,《第十三集》是定期更新的,所以如果你对主题进行了更改,你就可以WILL 把你所做的一切都放在主题上。您应该创建child theme

您需要更改设置页眉高度的函数才能正确裁剪图像。此函数可在“inc/custom”标题中找到。第30行的php。

“高度”=>230,

要更改此设置,请创建函数。php,并在函数中添加以下代码。您创建的php。此函数将覆盖默认高度并将其设置为500px

<?php
function my_custom_header_setup() {
    $args = array( \'height\' => 500 );
    add_theme_support( \'custom-header\', $args );
}
add_action( \'after_setup_theme\', \'my_custom_header_setup\' );
然后,您可以将您提到的以下样式添加到子主题的样式中。css

.site-header .home-link {
        color: #141412;
        display: block;
        margin: 0 auto;
        max-width: 1080px;
        min-height: 500px;
        padding: 0 20px;
        text-decoration: none;
        width: 100%;
}

SO网友:KnightHawk

如果您使用的是最新版本的wordpress,则在上载新图像时,可以在“自定义”菜单选项(外观下的左栏)中更改标题图像,并要求您将其裁剪到所需的位置。

如果您通过FTP(或其他方法)上传了替换图像,则可以尝试添加

.site-header {
     background-position:center center;
  }
这将使图像水平和垂直居中。只要图像没有被事先裁剪,这应该会给你一个更接近我认为你正在寻找的结果。

相关推荐

在带有PHP的子主题中包含style.css

在里面https://codex.wordpress.org/Child_Themes 这是包含样式的最佳实践。css在子主题中,必须将下面的代码放入函数中。php的子主题,但将“父样式”替换为可以在函数中找到的父主题的参数。父主题的php。我在我的主题文件中找不到它,那里也没有多少代码。使用@import包含父主题样式表的方法不适用于我,放入文件的css不会在任何浏览器的站点上显示自己。function my_theme_enqueue_styles() { $parent_s