Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #760745

    is it possible to give the image itself the class of the custom class.
    Now a parent container (avia-image-container) gets the custom class. is it possible to set up the same class for the image itself?

    Thanks

    #760749

    Hi Guenter!

    Currently it is not possible. You know you can target the image using

    .your-custom-class img { }

    Would that be fine? :)

    Regards,
    Yigit

    #760857

    :lol – yes

    the reason : there is an svg plugin which enables all in wordpress what svg must have. in dashboard media the grid and the list overview is with svg preview and the clue : you can embed svg in the normal and advanced layout editor. This is allready possible – but the svg is still an img tag.
    if you give a custom css class to it (standard is style-svg) it places not an image tag but the svg inline code.
    This has a lot of advantages.
    So in tiny mce editior this is simple to set the class to the image. But on alb image not.

    how does the parent container get the custom class?

    for me it will be ok if i put a new shortcode image.php in child theme – but i do not see where the custom class in the code comes from.

    #760875

    hm i changed it in image.php to: (from line 437)

    $markup_url = avia_markup_helper(array('context' => 'image_url','echo'=>false, 'custom_markup'=>$meta['custom_markup']));
    $markup = avia_markup_helper(array('context' => 'image','echo'=>false, 'custom_markup'=>$meta['custom_markup']));
    
    $output .= "<div class='avia-image-container {$class} ".$meta['el_class']." ".$this->class_by_arguments('align' ,$atts, true)."' $markup >";
    $output .= "<div class='avia-image-container-inner'>";
    if($link)
    {
    	$output.= "<a href='{$link}' class='avia_image'  {$blank}>{$overlay}<img class='avia_image ".$meta['el_class']." ' src='{$src}' alt='{$alt}' title='{$title}' $markup_url /></a>";
    }
    else
    {
    	$output.= "{$overlay}<img class='avia_image ".$meta['el_class']." ' src='{$src}' alt='{$alt}' title='{$title}'  $markup_url />";
    }
    $output .= "</div>";
    $output .= "</div>";
    }

    you can see result here: https://webers-testseite.de/kokon/3164-2/

    this is an image alb element in a 1/2 container.
    The plugin (svg support) – if it comes to an img tag with class style-svg it replaces the whole img container with the svg code ! nice !

    #760884

    see what happens on hovering the svg!

    #760885

    Hey!


    @Guenni007
    actually using SVG inside ALB.
    We have forward the idea to Kriesi, so we can see if that can be implemented as a solution.

    Would in the meantime work, to use it as a shortcode?
    https://el.wordpress.org/plugins/add-full-svg-support/

    Regards,
    Basilis

    #760920

    well with the plugin above and my “image.php” i can use the alb element. And only by adding a custom class i reach the possibility to add that inline svg.

    My idea now is to insert an if clause to the image alb ( if mime type is svg than custom class of image is …)

    on logo case i often use this:

    function first_logo($logo) {
    $logo .= '<strong class="logo first-logo"><a href="url1">' ;
    $logo .= file_get_contents("path to svg logo");
    $logo .= '</a></strong>';
    return $logo;
    }
    add_filter('avf_logo_final_output', 'first_logo');

    to place an inline svg as logo.

    #763136

    Hey!

    I think you can also accomplish this via jQuery. Remove the logo img tag then replace it with the svg markup. One advantage is that you don’t need to use any plugin to render the svg file.

    // insert svg
    function ava_custom_script() {
    ?>
    	<script type="text/javascript">
    	(function($) {
    		function a() {
    			$( ".logo a img" ).remove();
    			$.get('/example.svg', function(svg){
    				$( ".logo a" ).html( svg );
    			}, 'text');
    		}
    
    		a();
    	})(jQuery);
    	</script>
    <?php
    }
    add_action('wp_footer', 'ava_custom_script');
    

    Best regards,
    Ismael

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.