Question

所以，我基本上在我的wordpress主题中有这段代码，它为画廊中的图像创建了一个容器，其上面有2个图标作为叠加层。第一个图标是灯箱库图标，这是我感兴趣的图标，另一个是类似按钮。

我尝试做的是取消灯箱等的按钮，让整个缩略图使用灯箱而不是重定向到项目页面。

我尝试更改链接到项目页面的图像的href以加载灯箱但失败了。

如果你知道怎么做，请告诉我！

$html .=" " . $masonry_size;
            $html .="'>";

            $html .= "<div class='image_holder'>";
            $html .= "<a class='portfolio_link_for_touch' href='".$portfolio_link."' target='".$target."'>";
            $html .= "<span class='image'>";
            $html .= get_the_post_thumbnail(get_the_ID(), $image_size);
            $html .= "</span>"; //close span.image
            $html .= "</a>"; //close a.portfolio_link_for_touch

            $html .= "<span class='text_holder'>";
            $html .= "<span class='text_outer'>";
            $html .= "<span class='text_inner'>";
            $html .= '<div class="hover_feature_holder_title">';
            $html .= '<div class="hover_feature_holder_title_inner">';
            $html .= '<'.$title_tag.' '.$title_styles.' class="portfolio_title"><a href="' . $portfolio_link . '" '.$title_styles.' target="'.$target.'">' . get_the_title() . '</a></'.$title_tag.'>';
            $html .= $separator_html;
            $html .= '<span '.$category_style.' class="project_category">';
            $k = 1;
            foreach ($terms as $term) {
                $html .= "$term->name";
                if (count($terms) != $k) {
                    $html .= ', ';
                }
                $k++;
            }
            $html .= '</span>'; //close span.project_category
            $html .= '</div>'; //close div.hover_feature_holder_title_inner
            $html .= '</div>'; //close div.hover_feature_holder_title

            $html .= "<span class='feature_holder'>";
            $html .= '<span class="feature_holder_icons">';
            if ($lightbox == "yes") {
                $html .= "<a class='lightbox hover_icon_holder' title='" . $title . "' href='" . $large_image . "' data-rel='prettyPhoto[" . $slug_list_ . "]'><span ".$features_icons_styles." class='hover_icon icon_search'></span></a>";
            }
            $html .= "<a class='preview hover_icon_holder' href='" . $portfolio_link . "' target='".$target."'><span ".$features_icons_styles." class='hover_icon icon_link_alt'></span></a>";
            if ($portfolio_qode_like == "on") {
                $html .= "<span ".$features_icons_styles." class='portfolio_like hover_icon_holder'>";

                if (function_exists('qode_like_portfolio_list')) {
                    $html .= qode_like_portfolio_list(get_the_ID());
                }
                $html .= "</span>";
            }
            $html .= "</span>"; //close span.feature_holder_icons
            $html .= "</span>"; //close span.feature_holder

            $html .= "</span>"; //close span.text_inner
            $html .= "</span>"; //close span.text_outer
            $html .= "</span>"; //close span.text_holder
            $html .= "</div>"; //close div.image_holder
            $html .= "</article>";

        endwhile;
        else:
            ?>

Answer 1

我不确定你主题的其余部分是什么样的，但我在这里尝试一下。我认为触发灯箱和决定在灯箱中查看哪个图像的代码是：

WebClient

因此，我们将把这部分移动到代码的外部链接。我还从代码中删除了两个按钮。我认为它变成了这样：

class='lightbox hover_icon_holder' title='" . $title . "' href='" . $large_image . "' data-rel='prettyPhoto[" . $slug_list_ . "]'

Wordpress主题灯箱缩略图

1 个答案: