如何使用php和html一起编辑网页的标题

时间:2016-11-02 06:17:55

标签: php html wordpress

我有一个来自wordpress主题的以下命令。

</head>

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


<header id="masthead" class="site-header <?php echo ( get_theme_mod( 'panoramic-header-layout', 'panoramic-header-layout-standard' ) == 'panoramic-header-layout-centered' ) ? sanitize_html_class( 'panoramic-header-layout-centered' ) : sanitize_html_class( 'panoramic-header-layout-standard' ); ?>" role="banner">



<?php if ( get_theme_mod( 'panoramic-header-layout', 'panoramic-header-layout-standard' ) == 'panoramic-header-layout-centered' ) : ?>

    <?php get_template_part( 'library/template-parts/header', 'centered' ); ?>

<?php else : ?>

    <?php get_template_part( 'library/template-parts/header', 'centered' ); ?>

<?php endif; ?>

现在我需要添加两个徽标,一个位于左侧,另一个位于右侧。

怎么做?

1 个答案:

答案 0 :(得分:1)

如评论部分所述,只需将图标添加到HTML部分,然后删除特定于主题的图像。以下是展示如何完成此操作的示例:

HTML部分:

<header>
  <img class="logo left" src="PATH_TO_LEFT_LOGO.png">
  <div class="header-text left">
    This may be a title.
  </div>
  <img class="logo right" src="PATH_TO_RIGHT_LOGO.png">
  <br class="header-clear" />
</header>

用于对齐徽标文件的CSS:

.header-text {
  color: white;
  margin: 5px;
  font-size: 20px;
}
.header-text.left,
.logo.left{
  float: left;
}
.logo.right {
  float: right;
}
.header-clear {
  clear: both;
}

如果您不需要标题文本,请从CSS部分删除DIV图层和相应的规则。同样显而易见的是,您必须替换与您的配置匹配的徽标图像的路径: - )

Here's a fiddle显示上述代码。