简体   繁体   中英

Add CSS class to all images in Joomla articles using PHP

I have installed a plugin called Nice Watermark (on my Joomla 3 site) that adds a watermark to all images with a certain class (in my case <img class="waterm" src="/images/wm/idx-homepage3cfotoby0.jpg" alt=""> )

Is it possible to use PHP to add a CSS class to all images before the site is loaded? Or even better, to target only images that are part of an article (I don't want to watermark icons and other template images)?

I was thinking something like a plugin that finds <img src=.../> tags in the code and adds a class, but I'm not sure how to attack this problem.

Maybe someone can point me in the right direction?

EDIT:

I've created a Joomla plugin with the following code, and it works, but it also adds a complete html structure ( <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd"> <html><body><p><img... around the images. How can I avoid this?

<?php
// no direct access
defined('_JEXEC') or die;
jimport('joomla.plugin.plugin');
class plgContentAddImageClass extends JPlugin
{
    public function __construct(&$subject, $params)
    {
        parent::__construct($subject, $params);
    }
    public function onContentPrepare($context, &$article, &$params, $offset = 0)
    {
        $content =& $article->text; // Article content
        $dom = new DOMDocument();
        @$dom->loadHTML($content);
        $dom->preserveWhiteSpace = false;
        $images                  = $dom->getElementsByTagName('img');
        foreach($images as $image) {
            // the existing classes already on the images
            $existing_classes   = $image->getAttribute('class');
            // the class we're adding
            $new_class          = ' watermark';
            // the existing classes plus the new class
            $class_names_to_add = $existing_classes . $new_class;
            $image->setAttribute('class', $class_names_to_add);
        }
        $content = $dom->saveHTML();
        return true;
    }
}
?>

According to the PHP Manual , the saveHTML() method automatically adds <html> , <body> and <!doctype> tags to the output, but I found a code snippet on the same page that removes these codes. Here's the complete code that worked for me:

<?php
// no direct access
defined('_JEXEC') or die;
jimport('joomla.plugin.plugin');
class plgContentAddImageClass extends JPlugin
{
    public function __construct(&$subject, $params)
    {
        parent::__construct($subject, $params);
    }
    public function onContentPrepare($context, &$article, &$params, $offset = 0)
    {
        // Article Content
        $content = &$article->text;
        $dom = new DOMDocument();
        @$dom->loadHTML(mb_convert_encoding($content, 'HTML-ENTITIES', 'UTF-8'));
        $dom->preserveWhiteSpace = false;
        $images                  = $dom->getElementsByTagName('img');
        foreach($images as $image) {
            $existing_classes   = $image->getAttribute('class');
            // the class we're adding
            $new_class          = ' watermark';
            // the existing classes plus the new class
            $class_names_to_add = $existing_classes . $new_class;
            $image->setAttribute('class', $class_names_to_add);
        }
        // Remove unwanted tags
        $content = preg_replace('/^<!DOCTYPE.+?>/', '', str_replace( array('<html>', '</html>', '<body>', '</body>'), array('', '', '', ''), $dom->saveHTML()));
        return true;
    }
}
?>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM