个性化阅读
专注于IT技术分析

在保留站点logo和说明的同时添加页眉图像滑块

我已经下载了适用于WordPress的MetaSlider插件, 并且能够将生成的代码插入到主题的header.php文件中, 以便滑块显示在正确的位置。但是, 执行此操作时, 网站徽标和说明会消失(它们应与标题图像重叠)。这是header.php文件的代码:

    <!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
    <meta charset="<?php bloginfo( 'charset' ); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="profile" href="http://gmpg.org/xfn/11">

<?php wp_head(); ?>
</head>

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

    <!-- Preloader -->
    <?php get_template_part( 'templates/header/preloader' ); ?>

    <!-- Page Wrapper -->
    <div id="page-wrap">

        <!-- Boxed Wrapper -->
        <div id="page-header" <?php echo esc_attr(ashe_options( 'general_header_width' )) === 'boxed' ? 'class="boxed-wrapper"': ''; ?>>

        <?php

        // Top Bar
        get_template_part( 'templates/header/top', 'bar' );

        // Page Header
        get_template_part( 'templates/header/page', 'header' );


        // Main Navigation
        get_template_part( 'templates/header/main', 'navigation' );

        ?>

        </div><!-- .boxed-wrapper -->

        <!-- Page Content -->
        <div id="page-content">

            <?php get_template_part( 'templates/sidebars/sidebar', 'alt' ); // Sidebar Alt ?>

为了使滑块进入正确的位置, 我需要将// Page Header下面的代码替换为Meta Slider提供的代码。我认为问题在于它正在替换标题模板。因此, 我也查看了标头模板的php, 但不确定是否可以在其中解决该问题。这是标题模板代码:

<div class="entry-header">
    <div class="cv-outer">
    <div class="cv-inner">
        <div class="header-logo">

            <?php 

            if ( has_custom_logo() ) :

                $custom_logo_id = get_theme_mod( 'custom_logo' );
                $custom_logo    = wp_get_attachment_image_src( $custom_logo_id , 'full' );

            ?>

            <a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php esc_attr( bloginfo('name') ); ?>" class="logo-img">
                <img src="<?php echo esc_url(  $custom_logo[0] ); ?>" alt="<?php esc_attr( bloginfo('name') ); ?>">
            </a>

            <?php else : ?>
            <a href="<?php echo esc_url( home_url('/') ); ?>"><?php echo bloginfo( 'title' ); ?></a>
            <?php endif; ?>

            <br>
            <p class="site-description"><?php echo bloginfo( 'description' ); ?></p>

        </div>
    </div>
    </div>
</div>

关于如何解决此问题的任何想法将不胜感激!


#1


你是否尝试给出相对位置? z-index:9999; // z-index的编号取决于你的徽标和说明?

赞(0) 打赏
未经允许不得转载:srcmini » 在保留站点logo和说明的同时添加页眉图像滑块
分享到: 更多 (0)

评论 抢沙发

评论前必须登录!

 

觉得文章有用就打赏一下文章作者

微信扫一扫打赏