Divi图片库：悬停时显示标题

Question

我有一个使用Wordpress Divi主题构建的摄影网站。使用图库模块我已经构建了一些照片主题页面。

目前，当您将鼠标悬停在图库中的图像缩略图上时，它会覆盖不透明的颜色和图标。我想用图像标题替换这个图标，因为它是在Wordpress媒体库中设置的（我认为是mfr-title）。

注意：当您点击图库中的图片时，它会打开一个灯箱，图片标题位于左下角 - 所以标题是html可读的，某处。

我已经扫描了堆栈上的所有文章，this question类似，但对于Divi Portfolio模块而不是Gallery模块，我无法弄清楚如何使解决方案适应。

这里的任何帮助都会非常感激。

链接到我的网站库：http://27.54.88.129/~mattsh39/between-worlds/

Answer 1

我已通过自定义代码修复了此问题， 转到主题文件夹＆gt;包括＆gt;建设者＆gt;主modules.php
行号：846-857

$image_output = sprintf(
                '<a href="%1$s" title="%2$s">
                    <img src="%3$s" alt="%2$s" />
                    <span class="et_overlay%4$s"%5$s></span>
                </a>',
                esc_url( $attachment->image_src_full[0] ),
                esc_attr( $attachment->post_title ),
                esc_url( $attachment->image_src_thumb[0] ),
                ( '' !== $hover_icon ? ' et_pb_inline_icon' : '' ),
                $data_icon
            );

以下面的代码替换上面的代码

$image_output = sprintf(
                '<a href="%1$s" title="%2$s">
                    <img src="%3$s" alt="%2$s" />
                    <div class="et_overlay%4$s"%5$s><span>%6$s</span></div>
                </a>',
                esc_url( $attachment->image_src_full[0] ),
                esc_attr( $attachment->post_title ),
                esc_url( $attachment->image_src_thumb[0] ),
                ( '' !== $hover_icon ? ' et_pb_inline_icon' : '' ),
                $data_icon,wptexturize($attachment->post_title)
            );

将此css代码添加到自定义css选项中：

div.et_overlay span {
text-align: center;
display: block;
position: absolute;
top: 50%;
width: 100%;
}

标题将在悬停时出现。你发现标题的问题也出现在图像下面，图标也会出现。 为此，您可以在模块中添加自定义类并通过css编码处理它 示例：

.my_gallery h3.et_pb_gallery_title{
display:none;
}

Answer 2

首先，您要正确创建子主题 在子主题内创建Include文件夹 在Include文件夹中创建Builder文件夹 现在将main-modules.php文件复制到Builder文件夹中。

现在将此代码添加到Child主题functions.php，以便它覆盖父主题main-modules.php。

if ( ! function_exists( 'et_builder_add_main_elements' ) ) :
function et_builder_add_main_elements() {
require ET_BUILDER_DIR . 'main-structure-elements.php';
include ( get_stylesheet_directory() . '/includes/builder/main-modules.php');
do_action('et_builder_ready');
}
endif;