Verwenden von WordPress, das in Thickbox ohne Plugin integriert ist

Ich versuche, die eingebaute Thickbox in WordPress in meinem Thema zu verwenden. Ich versuche es so zu machen, dass alle Bilder, die ich über den Admin hinzufüge, automatisch die Thickbox-Funktion haben. Ich habe versucht, dies in die functions.php einzufügen, aber es hat nicht funktioniert:

function fb_add_thickbox($content){
$content = preg_replace('/<a(.*?)href="https://stackoverflow.com/questions/6631447/(.*?).(jpg"jpeg|png|gif|bmp|ico)"(.*?)><img/U', '<a$1href="$2.$3" $4 class="thickbox"><img', $content);
return $content;
}
add_filter('the_content', 'fb_add_thickbox', 2);

Angenommen, Ihr Code funktioniert tatsächlich – (wird Ihr Markup tatsächlich gefiltert?) – wird dies fehlschlagen, da Thickbox nicht aktiviert wurde. Sie müssen es manuell injizieren:

Wie @Alexcp angemerkt hat, müssen Sie Javascript und CSS manuell registrieren und einreihen (außerhalb des Admin-Bereichs). Fügen Sie zusätzlich zu Ihrer preg_replace-Funktion Folgendes zu Ihrer Vorlage hinzu Functions.php.

// register scripts 
if (! function_exists(thickbox_register){
function thickbox_register() {
    wp_deregister_script( 'jquery' );
    wp_register_script( 'jquery','http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js');
    wp_register_script( 'thickbox', 'path to thickbox'.thickbox.js, 'jquery');
    }  
}   
add_action('init', 'thickbox_register');

//print the now registered scripts 
if (! function_exists(thickbox_enqueue){
function thickbox_enqueue() {
    wp_enqueue_script( 'jquery' );
    wp_enqueue_script( 'thickbox' );
    }  
}
add_action('wp_print_scripts', 'thickbox_enqueue');

// do the same for css 
if (! function_exists(thickbox_style_enqueue){
function thickbox_style_enqueue() {
    wp_register_style( 'thickbox', 'path to css'.thickbox.css );
    wp_enqueue_style( 'thickbox' );
    }  
}
add_action('wp_print_styles', 'thickbox_style_enqueue');

Beachten Sie, dass Pfade abgerufen werden können verschiedene Wege – aber so etwas wie bloginfo('url'); sollte Ihnen den Einstieg erleichtern.

Wenn Sie immer noch Probleme haben, verwenden Sie FireBug oder etwas Ähnliches, um dies sicherzustellen Thickbox wird ordnungsgemäß registriert im jquery-Objekt des DOM.

Ich hoffe, das hilft

Dieser hat bei mir funktioniert

<?php add_thickbox(); ?>
<div id="my-content-id" style="display:none;">
 <p>
      This is my hidden content! It will appear in ThickBox when the link is clicked.
 </p>
</div>

<a href="#TB_inline?width=600&height=550&inlineId=my-content-id" 
class="thickbox">View my inline content!</a>

fügen Sie dies zu Ihrer functions.php-Datei in Ihrem Design hinzu:

<?php
// Adds thickbox to all images with a link inside of $content.
// Uses the title attribute in the Media Library.
add_filter('the_content', 'brentini_addthickboxclass');
function brentini_addthickboxclass($content) {
add_thickbox();
$pattern[0] = "/<a(.*?)href=('|\")(.*?).(bmp|gif|jpeg|jpg|png)('|\")(.*?)>/i";
$replacement[0] = '<a$1href=$2$3.$4$5 class="thickbox">';
$pattern[1] = "/(<a href=)('|\")([^\>]*?)(\.bmp|\.gif|\.jpg|\.jpeg|\.png)('|\")([^\>]*?)(>)(.*?) title=('|\")(.*?)('|\")(.*?)(<\/a>)/i";
$replacement[1] = '$1$2$3$4$5$6 title=$9$10$11$7$8 title=$9$10$11$12$13';
$pattern[2] = "/(<a href=)('|\")([^\>]*?)(\.bmp|\.gif|\.jpg|\.jpeg|\.png)('|\")([^\>]*?) title=([^\>]*?) title=([^\>]*?)(>)(.*?)(<\/a>)/i";
$replacement[2] = '$1$2$3$4$5$6 title=$7$9$10$11';
$content = preg_replace($pattern, $replacement, $content);
return $content;
}

Es funktioniert einwandfrei, wenn Sie es genau so machen. Es ist nicht nötig, alle diese Anrufe hinzuzufügen, die andere erwähnt haben. Es ist überhaupt nicht notwendig, da WordPress nativ jquery und Thickbox für die Verwendung im Backend enthält. add_thickbox() ist also alles, was Sie brauchen, um Thickbox in Ihrem Design aufzurufen. Der Rest des Skripts fügt einfach jedem Bild innerhalb von $content class=”thickbox” hinzu und verwendet das Titelattribut aus der WordPress-Medienbibliothek.

Wenn Sie an einem Skript interessiert sind, das dies plus Thickbox-Unterstützung für Galerien mit Navigation enthält, schauen Sie es sich an Kleister.

Für eine vereinfachte Version, die keine Navigation enthält, dieses bei pastebin verwendet jquery, um die Thickbox-Klasse zu Galerien hinzuzufügen.

Einige einfache Möglichkeiten, die WordPress bereits enthalten hat thickbox.js in seinem Skriptordner.

Also einfach öffnen wp-include/script-loader.php

Finden Sie die Zeile von function print_head_scripts(),

Hinzufügen $wp_scripts->do_items( 'thickbox' ); nach$wp_scripts->do_items( 'l10n' );

Aktualisieren Sie dann Ihre Seite, Sie werden die sehen thickbox.js haben Sie bereits in Ihre aufgenommen header partdann nur hinzufügen class="thickbox" in deiner <a> tagkann man die Thickbox perfekt nennen.