Question

我的网站上没有可点击的标题。当我单击标题时，我想重定向到主页。我不知道代码应如何使其工作。

这是我的page-header.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; ?>

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

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

我想我应该在这里添加一些想法，但是我对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; ?>

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

另外，我还会在浏览器中向您显示网站的来源：

browser website source

所有建议都是无价之宝！

Answer 1

我个人将PHP代码放入CV-Outer div的定义中。

     <?PHP
         if (has_custom_logo()) {
               echo "<div class='cv-outer clickHeader'>" + PHP_EOL;
         } else {
               echo "<div class='cv-outer'>" + PHP_EOL;
         }
     ?>

然后，只需将一个onclick处理程序添加到您的javascript中，以使clickHeader类重定向到正确的URL。

如果您需要保留PHP代码中的自定义徽标，只需将其保留在此处，删除具有URL的位。

基本上，问题在于超链接没有大小，因此不可点击。与其搞乱CSS以使其适合...我只是将其删除并使用JS作为clickhandler ...

完整的HTML代码：

<div class="entry-header">
<?PHP
if (has_custom_logo()) {
    echo "<div class='cv-outer clickHeader'>" + PHP_EOL;
     } else {
    echo "<div class='cv-outer'>" + PHP_EOL;
     }
?>
<div class="cv-inner">
    <div class="header-logo">

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

示例JavaScript：

<script>
    window.onload = function() {
        var headers = document.getElementsByTagName('clickHeader');
        for(var i = 0; i < headers.length; i++) {
            var header = headers[i];
            header.onclick = function() {
                document.location.href="/";
            }
        }
    }
</script>

Answer 2

标题似乎是空的。

在else子句中，如果没有自定义徽标，则链接内将显示文本。该链接在那里，但由于该链接内没有文本，因此无法单击。

您可以检查bloginfo( 'title' )是否为空吗？

另一种解决方法是添加您知道链接div中存在的默认图片，而不是文本。

Answer 3

您只需将所有标头div保留在Anchor元素中。像下面的代码

<a href="<?php echo esc_url( home_url( '/' ) ); ?>"
  <div class="cv-inner">
    <div class="header-logo">

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

Wordpress上的可点击标题

3 个答案: