it-swarm.com.de

Benötigen Sie Hilfe beim Erstellen eines Filters zum Bearbeiten der Ausgabe von "image_send_to_editor"?

Ich versuche, die Ausgabe von image_send_to_editor so zu bearbeiten, dass der Anker, der das Bild umbricht, eine bestimmte Klasse & rel hat.

Ich plane, jedes Bild, das in einen Beitrag eingefügt wird, zu einer Fancybox zu machen, ohne in einer Galerie sein oder ein Plugin verwenden zu müssen.

Hier ist, was ich bisher habe, aber ich brauche Hilfe beim Ausfüllen der Lücken ...

<?php
add_filter( 'image_send_to_editor', 'fancy_capable', 10, 7);
function fancy_capable($html, $id, $alt, $title, $align, $url, $size ) {
// not sure what to do here???
return "$html";
}
?>
3
Mr.Brown

Hier ist es am besten, jQuery zu verwenden, um einen Link zu einem Bild abzurufen und ihn anzufordern, fanceybox zu verwenden.

jQuery(document).ready(function($){
    $('a[href$="jpg"], a[href$="png"], a[href$="jpeg"]').fancybox();
});

Wenn Sie möchten, dass dies nur für Ihre Post-Inhaltsbereiche funktioniert, verwenden Sie Folgendes:

$('.post-content a[href$="jpg"], .post-content  a[href$="png"], .post-content a[href$="jpeg"]').fancybox();

Sie müssen .post-content durch das übergeordnete HTML-Element ersetzen, das den Inhaltsbereich umschließt.

2
Brian Fegter

Das ist eigentlich ganz einfach ... der return $html; kehrt einfach zum Editor zurück, was auch immer Sie ihm schicken ... also könnten Sie so etwas tun:

<?php 
       add_filter( 'image_send_to_editor', 'fancy_capable', 10, 7);
       function fancy_capable($html, $id, $alt, $title, $align, $url, $size ) {
           $url = wp_get_attachment_url($id); // Grab the current image URL
           $html = '<a href="' . $url .  '" class="fancybox" rel="your-rel"><img src="..." /></a>';
           return $html;
       }
?>

Sie können anstelle des HTML-Codes auch einfach einen Shortcode (der dem Benutzer vielleicht besser bekannt ist) eingeben ... und dann den Shortcode im Backend ausführen lassen.

<?php 
       add_filter( 'image_send_to_editor', 'fancy_capable', 10, 7);
       function fancy_capable($html, $id, $alt, $title, $align, $url, $size ) {
           $url = wp_get_attachment_url($id); // Grab the current image URL
           $html = '[image src="' . $url .  '" fancybox="true" /]';
           return $html;
       }
?>
2
luckykind

Ich habe einige Beispiele für die Verwendung regulärer Ausdrücke gefunden, um dem HTML einige Klassen hinzuzufügen. Das funktioniert bei mir:

add_filter('image_send_to_editor', 'add_class_to_image', 10, 8);

mit folgender Funktion:

function add_class_to_image($html, $id, $caption, $title, $align, $url, $size, $alt='') {
    $classes_to_add = 'media-img';
    if (preg_match('/<a.? class=".?">/', $html))
        $html = preg_replace('/(<a.? class=".?)(".\?>)/', '$1 ' . $classes_to_add . '$2', $html);
    else
        $html = preg_replace('/(<a.*?)>/', '$1 class="' . $classes_to_add . '">', $html);
    return $html;
}

Dann habe ich in meiner style.css-Datei den a.media-img-Selektor formatiert.

1
Joseph Hansen