自定义添加介质弹出窗口以包括Rel属性选项

时间:2013-09-11 作者:McShaman

如今,很多jQuery灯箱都使用“rel”属性来标识应该作为目标的对象。不幸的是,在Wordpress中,插入缩略图/链接时,要添加rel属性,您必须编辑html源代码,或者在首次插入后拉一个单独的弹出窗口。这使得一些不太自信的用户的过程变得复杂。

我想做的是在插入媒体弹出窗口中包含一个复选框,以便在插入时向标记添加rel=\'lightbox\'属性。

虽然我对主题开发很有信心,但我不知道从哪里开始修改Wordpress管理功能。

有人能给我指出正确的方向吗?

2 个回复
SO网友:Nat

这是一个艰难的过程,但我要从这里开始:Add new "Insert Into Post" button with another function. 下面是一些通过添加字段开始的代码http://rider.sofarider.com/wordpress-tips-and-tricks/extra-input-field-to-add-an-image-panel/ 从这里开始,尝试第二个代码块。

<?php
function attachment_url_extra( $form_fields, $post ) {
    // input field relates to attachments
        // my_field and _my_field is what you should replace with your own
    $post->post_type == \'attachment\';
    $form_fields[ \'my_field\' ] = array(
        \'label\' => __( \'MY FIELD\' ),
        \'input\' => \'text\',
        \'value\' => get_post_meta( $post->ID, \'_my_field\', true )
    );
    $form_fields[ \'my_field\' ][ \'label\' ] = __( \'MY FIELD\' );
    $form_fields[ \'my_field\' ][ \'input\' ] = \'text\';
    $form_fields[ \'my_field\' ][ \'value\' ] = get_post_meta( $post->ID, \'_my_field\', true );

    return $form_fields;
}

add_filter( \'attachment_fields_to_edit\', \'attachment_url_extra\', NULL, 2 );

function attachment_url_extra_save( $post, $attachment ) {

    if( isset( $attachment[ \'my_field\' ] ) ) {
        if( trim( $attachment[ \'my_field\'] ) == \'\' ) $post[ \'errors\' ][ \'my_field\' ][ \'errors\' ][] = __( \'Error! Something went wrong.\' );
        else update_post_meta( $post[ \'ID\' ], \'_my_field\', $attachment[ \'my_field\' ] );
    }
    return $post;

}
现在自定义实际插入。

add_filter( \'attachment_fields_to_save\', \'attachment_url_extra_save\', NULL, 2 );
?>

add_filter(\'media_send_to_editor\', \'my_filter_iste\', 20, 3);

function my_filter_iste($html, $id, $caption, $title, $align, $url, $size, $alt) {
    $attachment = get_post($id); //fetching attachment by $id passed through

    $mime_type = $attachment->post_mime_type; //getting the mime-type
    if (substr($mime_type, 0, 5) == \'video\') { //checking mime-type
        $src = wp_get_attachment_url( $id );
        $html = \'[video src="\'.$src.\'"]\';  
    }
    return $html; // return new $html
}

SO网友:eskimo

在下面的示例中,我使用的是fancybox,但您当然也可以使用lightbox。我更喜欢fancybox,因为它非常轻量级,而且我使用它的方式不需要将其作为插件包含,但我可以在现有文件中包含js和css。更快更简单!

如果您不一定需要复选框,只想在链接到文件的每个图像上都有一个rel=\'lightbox\',可以使用下面的函数。它还可以为每个库项目添加一个rel=\'lightbox[POST ID]\'。对于fancybox,这样当用户浏览图像时,每个“循环”将从该厨房的第一个图像开始,到最后一个图像结束。在一个页面上显示具有多个库的多篇文章时非常有用。

功能:

function fancybox_rel($attachment_link)
{   
    global $post;
    $pattern = "/<a(.*?)href=(\'|\\")([^>]*).(bmp|gif|jpeg|jpg|png)(\'|\\")(.*?)>(.*?)<\\/a>/i";
    $replacement = \'<a$1rel="fancybox[%LIGHTID%]" href=$2$3.$4$5  $6>$7</a>\';
    $attachment_link= preg_replace($pattern, $replacement, $attachment_link);
    $attachment_link = str_replace("%LIGHTID%", $post->ID, $attachment_link);
    return $attachment_link;
}
add_filter(\'wp_get_attachment_link\', \'fancybox_rel\'); 
为了确保fancybox不会为每个图像加载,而是只为可以点击的图像加载(图像/图库必须设置为链接到“文件”),可以使用javascript添加fancybox类:

$(\'.gallery-icon\').addClass(\'fancybox\');
因此,如果希望在lightbox/fancybox中自动查看带有链接的图像,则不需要复选框。让用户更加轻松!

结束

相关推荐

Admin login not working

我无法以管理员身份登录wordpress网站。我试图更改密码和其他一些东西,但没有结果。发生的事情是,我返回到登录页面,没有消息。奇怪的是,我可以作为另一个用户登录,但我没有所需的权限。我检查了PHP日志文件,在那里找不到任何东西。我尝试过以私人模式进行,但也不起作用。建议我应该尝试什么?