wordpress - 更改 Wordpress 默认库输出

标签 wordpress zurb-foundation

我希望使用 Wordpress gallery shortcut但我想将输出绑定(bind)到 Foundation Orbit plugin (制作一个 slider )。这是我要输出的 HTML:

<div class="slideshow-wrapper">
    <div class="preloader"></div>
    <ul data-orbit>
        <li>
            <img src="img1.png" alt="bla bla bla" />
        </li>
        <li>
            <img src="img2.png" alt="bla bla bla" />
        </li>
        <li>
            <img src="img3.png" alt="bla bla bla" />
        </li>
        <li>
            <img src="img4.png" alt="bla bla bla" />
        </li>
    </ul>
</div>

是否可以在 functions.php 中放一些东西? (或类似的)来实现这一点?

最佳答案

确实是的。很久以前,我发现了这段代码,并且一直在使用它。将 WP 的默认图库自定义为您想要的任何内容都很棒。

有一个过滤器到 post_gallery您可以使用它来自定义所有默认的 WP 画廊。这是我使用的适用于您提供的模板的代码示例。我已经尽可能地清理了它。

该功能的第一部分几乎是画廊附件处理,因此您可能只想更改后半部分,即决定画廊模板输出的部分(按照评论):

add_filter('post_gallery', 'my_post_gallery', 10, 2);
function my_post_gallery($output, $attr) {
    global $post;

    if (isset($attr['orderby'])) {
        $attr['orderby'] = sanitize_sql_orderby($attr['orderby']);
        if (!$attr['orderby'])
            unset($attr['orderby']);
    }

    extract(shortcode_atts(array(
        'order' => 'ASC',
        'orderby' => 'menu_order ID',
        'id' => $post->ID,
        'itemtag' => 'dl',
        'icontag' => 'dt',
        'captiontag' => 'dd',
        'columns' => 3,
        'size' => 'thumbnail',
        'include' => '',
        'exclude' => ''
    ), $attr));

    $id = intval($id);
    if ('RAND' == $order) $orderby = 'none';

    if (!empty($include)) {
        $include = preg_replace('/[^0-9,]+/', '', $include);
        $_attachments = get_posts(array('include' => $include, 'post_status' => 'inherit', 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => $order, 'orderby' => $orderby));

        $attachments = array();
        foreach ($_attachments as $key => $val) {
            $attachments[$val->ID] = $_attachments[$key];
        }
    }

    if (empty($attachments)) return '';

    // Here's your actual output, you may customize it to your need
    $output = "<div class=\"slideshow-wrapper\">\n";
    $output .= "<div class=\"preloader\"></div>\n";
    $output .= "<ul data-orbit>\n";

    // Now you loop through each attachment
    foreach ($attachments as $id => $attachment) {
        // Fetch the thumbnail (or full image, it's up to you)
//      $img = wp_get_attachment_image_src($id, 'medium');
//      $img = wp_get_attachment_image_src($id, 'my-custom-image-size');
        $img = wp_get_attachment_image_src($id, 'full');

        $output .= "<li>\n";
        $output .= "<img src=\"{$img[0]}\" width=\"{$img[1]}\" height=\"{$img[2]}\" alt=\"\" />\n";
        $output .= "</li>\n";
    }

    $output .= "</ul>\n";
    $output .= "</div>\n";

    return $output;
}

只需将其粘贴到您的 functions.php文件并修改以适应您的需要。我很确定它对你有用,因为它对我有用:)

关于wordpress - 更改 Wordpress 默认库输出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19802157/

相关文章:

javascript - 尝试在 Rails/Ember 应用程序中使用 Foundation 的 Orbit slider

javascript - 从谷歌地图中删除标题标签属性

php - 结帐时进行 Paypal 货币兑换

html - 是否可以底部对齐图像并顶部对齐图像下方的标题?

css - Foundation 6.4 调整顶栏

css - Foundation 顶部栏中的按钮样式?

php - WordPress 如何在转义 html 标签时使用换行符

MySQL 远程连接问题

css - 使用 WooCommerce 和 Avada 更改 Wordpress 中的数量选择器样式

javascript - lazy_high_charts 和基础冲突加载 javascript