将 html 数据属性添加到 Joomla 模块 - Add html data attribute to Joomla module

Add html data attribute to Joomla module

有时需要向joomla模块添加一个数据属性，例如，如果你想使用wow.js并且想要一个延迟事件，你必须将data-wow-delay='2s'添加到模块div。目前没有办法在joomla框架内做到这一点

我有一个解决方案，有点捏造，但可以完成工作。它使用模块管理器高级选项卡下的"标头类"字段。

在你的模板覆盖目录模板/你的模板/html中，你应该找到一个名为模块的文件.php我有一个名为块的模块样式，我在我的索引.php文件中使用它。

我编辑了它以查看 hederclass 变量，看看它是否包含字符 data-。如果是这样，我假设标头类实际上是一个数据属性。这是代码。

function modChrome_block($module, &$params, &$attribs)
{
    // Temporarily store header class in variable
    $headerClass    = $params->get('header_class');
    $headerAttribute = '';  //define the variable for the attribute
    if ($headerClass !=''){
        if (stripos($headerClass,'data-') !== false) {  //check to see if the header class contains the characters 'data-'
            $headerAttribute = htmlspecialchars($headerClass);
            $headerClass = '';
        }else{
            $headerClass    =  ' class="' . htmlspecialchars($headerClass) . '"';
        }
    }
    if (!empty ($module->content)) : ?>
           <div class="block <?php if ($params->get('moduleclass_sfx')!='') : ?><?php echo $params->get('moduleclass_sfx'); ?><?php endif; ?>" <?PHP echo $headerAttribute; ?>>
            <div class="moduletable">               
                <?php if ($module->showtitle != 0) : ?>
            <div class="module-title">
                            <h3 <?PHP echo $headerClass; ?>><?php echo $module->title; ?></h3>
            </div>
                        <?php endif; ?>
                        <div class="module-content">
                            <?php echo $module->content; ?>
                        </div>
              </div>                
           </div>
    <?php endif;
}

要使其正常工作，在joomla模块管理器中，打开要应用数据属性的模块，单击"高级"选项卡，然后在标题类字段中使用单引号添加数据属性，如下所示

data-wow-delay='2s'

希望这对某人有所帮助