向wp-caption添加额外的类吗？

时间：2012-12-03 作者：scottdaris

如何在添加带有标题的图像时生成的HTML中添加新类？

例如，由此：

<div id="attachment_xyz" class="wp-caption alignleft"...
对此：

<div id="attachment_xyz" class="wp-caption alignleft my_new_class"...
在这种情况下，添加，my_new_class.

谢谢，斯科特

2 个回复
最合适的回答,由SO网友:shea 整理而成

改编自this answer

将此代码添加到函数中。php文件：

add_action( \'after_setup_theme\', \'wpse_74735_replace_wp_caption_shortcode\' );

/**
 * Replace the default caption shortcode handler.
 *
 * @return void
 */
function wpse_74735_replace_wp_caption_shortcode() {
    remove_shortcode( \'caption\', \'img_caption_shortcode\' );
    remove_shortcode( \'wp_caption\', \'img_caption_shortcode\' );
    add_shortcode( \'caption\', \'wpse_74735_caption_shortcode\' );
    add_shortcode( \'wp_caption\', \'wpse_74735_caption_shortcode\' );
}

/**
 * Add the new class to the caption.
 *
 * @param  array  $attr    Shortcode attributes
 * @param  string $content Caption text
 * @return string
 */
function wpse_74735_caption_shortcode( $attr, $content = NULL )
{
    $caption = img_caption_shortcode( $attr, $content );
    $caption = str_replace( \'class="wp-caption\', \'class="wp-caption my_new_class\', $caption );
    return $caption;
}

SO网友:Morten Skogly

在wordpress 4.9中，您可以在align属性中编写类。我给标题加了全宽，如下所示。

[caption id="attachment_11537" align="aligncenter full-width" width="1170"]<img src="http://pappmaskin.no/wp-content/2016/03/IMG_5199-1920x712.png" alt="" width="1170" height="434" class="size-large wp-image-11537" /> Fem øl takk[/caption]
输出（jetpack photon打开时）：

<figure id="attachment_11537" style="max-width: 1170px" class="wp-caption aligncenter full-width"><img data-attachment-id="11537" data-permalink="http://pappmaskin.no/?attachment_id=11537" data-orig-file="https://i0.wp.com/pappmaskin.no/wp-content/2016/03/IMG_5199.png?fit=7723%2C2863" data-orig-size="7723,2863" data-comments-opened="1" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="Illustrasjon: Morten Skogly" data-image-description="" data-medium-file="https://i0.wp.com/pappmaskin.no/wp-content/2016/03/IMG_5199.png?fit=640%2C237" data-large-file="https://i0.wp.com/pappmaskin.no/wp-content/2016/03/IMG_5199.png?fit=1170%2C434" src="https://i0.wp.com/pappmaskin.no/wp-content/2016/03/IMG_5199.png?resize=1170%2C434" alt="" class="size-large wp-image-11537" srcset="https://i0.wp.com/pappmaskin.no/wp-content/2016/03/IMG_5199.png?resize=1920%2C712 1920w, https://i0.wp.com/pappmaskin.no/wp-content/2016/03/IMG_5199.png?resize=310%2C115 310w, https://i0.wp.com/pappmaskin.no/wp-content/2016/03/IMG_5199.png?resize=640%2C237 640w, https://i0.wp.com/pappmaskin.no/wp-content/2016/03/IMG_5199.png?resize=768%2C285 768w, https://i0.wp.com/pappmaskin.no/wp-content/2016/03/IMG_5199.png?w=2340 2340w, https://i0.wp.com/pappmaskin.no/wp-content/2016/03/IMG_5199.png?w=3510 3510w" sizes="(max-width: 1170px) 100vw, 1170px" width="684" height="254"><figcaption class="wp-caption-text">Fem øl takk</figcaption></figure>

结束
标签： captions   小码农  

相关推荐

Are captions stored anywhere?

关于我之前的question about shortcode captions, 在我看来，标题的实际文本并不是存储在短代码本身的帖子内容之外的任何地方。我会认为wp_get_attachment_metadata 将存储附件的信息，但它不会。我错了吗？或者WordPress没有在任何地方存储实际的标题？