Wordpress 不允许我在锚标记中包含 div

Question

我在一个页面模板中，我正试图将整个 div 包装在一个标签中。我希望整个 div 元素都可以点击，而不仅仅是两个 header 标签元素。标签被拆开和切割得太快了。嵌套问题？我不确定 - 尝试了很多不同的东西。这是代码...请参阅第 <a href="<?php echo esc_url($education['lightbox']);?>"> 行是我要包含的锚标记

    <section id="<?php echo esc_attr($menu_id);?>" class="section section-education">
                <div class="animate-up">
                    <?php if($title):?>
                        <h2 class="section-title"><?php echo esc_html($title);?></h2>
                    <?php endif;?>
                    <?php if($education_fields):?>
                    <div class="timeline">
                        <div class="timeline-bar"></div>
                        <div class="timeline-inner clearfix myBox">
                            <?php                               
                            $i=0;foreach ($education_fields as $education):
                                    if ($i % 2 == 0):
                                        $class = 'timeline-box-left';
                                        $class_inner = 'animate-right';
                                    else:
                                        $class = 'timeline-box-right';
                                        $class_inner = 'animate-left';                                      
                                    endif;
                            ?> 

                              <a href="<?php echo esc_url($education['lightbox']);?>">
                                <div class="timeline-box timeline-box-compact <?php echo esc_attr($class); ?>">
                                    <span class="dot"></span>

                                    <div class="timeline-box-inner <?php echo esc_attr($class_inner); ?>">
                                        <?php if($education['years']):?>
                                            <span class="arrow"></span>
                                            <div class="date"><?php echo esc_html($education['years']);?></div>
                                        <?php
                                        endif;
                                        if($education['education_name']):
                                            ?>
                                            <h3><?php echo esc_html($education['education_name']);?></h3>
                                        <?php
                                        endif;
                                        if($education['education_place']):
                                            ?>
                                            <h4>
                                            <?php if($education['education_place_link']):?>
                                                <a href="<?php echo esc_url($education['education_place_link']);?>">
                                            <?php endif;?>
                                            <?php echo esc_html($education['education_place']);?>
                                            <?php if($education['education_place_link']):?>
                                                </a>


                                            <?php endif;?>
                                            </h4>
                                        <?php endif;?>

                                    </div>
                                </div>
                                </a>
                            <?php $i++; endforeach; ?>
                        </div>
                    </div>
                    <?php endif;?>
                    <?php if($custom_editor):?>
                        <div class="section-txt-btn"><?php echo $custom_editor;?></div>
                    <?php endif;?>
                </div>
            </section>

这就是返回的内容：

    <div class="timeline-box timeline-box-compact timeline-box-left" style=""><a href="http://johnhoich.com/wp-content/uploads/2015/11/logo-compass-1.png" data-featherlight="image">
                                    <span class="dot"></span>

                                    </a><div class="timeline-box-inner animate-right animated"><a href="http://johnhoich.com/wp-content/uploads/2015/11/logo-compass-1.png" data-featherlight="image">
                                                                                        <span class="arrow"></span>
                        <div class="date">1974 - 1976</div>                                                                                 <h3>High School</h3>
                                                                                        </a><h4><a href="http://johnhoich.com/wp-content/uploads/2015/11/logo-compass-1.png" data-featherlight="image"></a>

Westside

Answer 1

你得到了这个link...

<a href="<?php echo esc_url($education['education_place_link']);?>">

... 在 DIV 中，您用引用的 <a> 标签包装，但是 link 中的 link 是不可能的，它将一定要打破 HTML...

Answer 2

想通了：

解法： 我将 <a> 标签放在 div/section 的末尾，并添加了一些 css：使其成为绝对的，顶部、底部、右侧、左侧 = 为 0，相应地调整宽度和高度覆盖整个内容区域并提高 z-index。这允许 link 覆盖，而不是环绕 div。

Wordpress 不允许我在锚标记中包含 div

Wordpress won't let me wrap a div in an anchor tag

html

php

wordpress-theming

custom-wordpress-pages