Question

如何创建自定义wordpress幻灯片插件？我一直在寻找谷歌的教程，但我找不到一个，你们介意在这里给教程或链接到其他一些自定义幻灯片插件教程？

Answer 1

如果您不介意使用jQuery插件，而不是从头开始编写，我可以建议.cycle()。

我会假设你不熟悉WP循环。如果你不是，你真的应该查看WP Codex（here）。

PHP - （把它放在functions.php中）

<?php add_action('wp_enqueue_scripts', 'my_scripts_method'); ?>
<?php function my_scripts_method() {
    wp_deregister_script( 'jquery' );
    wp_register_script( 'jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js');
    wp_enqueue_script( 'jquery' );
    wp_deregister_script( 'jqueryui' );
    wp_register_script( 'jqueryui', 'https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js');
    wp_enqueue_script( 'jqueryui' );
    wp_register_script( 'slideshow', get_bloginfo('stylesheet_directory').'js/slideshow.js');
    wp_enqueue_script( 'jqueryui' );
} ?>

<?php add_action('hook_name', 'my_slideshow'); ?>
<?php function my_slideshow() { ?>
    <?php if(is_page('page_name')) : ?>
    <div id="SlideShow">
    <?php $my_query = new WP_Query('category_name=my-slideshow$post_per_page=5'); ?>
    <?php if ($my_query->have_posts()) : ?>
        <?php while ($my_query->have_posts()) : ?>
        <div id="slide">
            <div class="wrapper">
                         <?php if (has_post_thumbnail()) : ?>
                              <?php the_post_thumbnail() ?>
                         <?php else : ?>
                              <?php echo (get_bloginfo('stylesheet_directory').'/images/default.png'); ?>
                         <?php endif; ?>
            </div><!-- end .wrapper -->
        </div><!-- end #slide -->
        <?php endwhile; ?>
    <?php else : ?>
        <span>Sorry, there is no content at this time.</span>
    <?php endif; ?>
    <?php wp_reset_postdata(); ?>
    </div><!-- end #slideshow -->
    <?php endif; ?>
<?php } ?>

将“hook_name”替换为要插入幻灯片的挂钩。将'page_name'替换为您希望幻灯片显示的页面的slug。如果您希望它显示在所有网页上，请删除最后的<?php if(is_page('page_name')) : ?>和<?php endif; ?>。将$my_query中的“my-slideshow”替换为幻灯片中所需类别的名称。您可以将“5”更改为要在幻灯片中显示的任意数量的幻灯片。 the_post_thumbnail是帖子的精选图片。它正在检查帖子是否有特色图像，如果没有，它依赖于主题图像文件夹中的default.png。

jQuery - （将它放在/ js目录中主题目录中的自己的文件中。调用文件slideshow.js）

var $j = jQuery.noConflict();

$j(document).ready(function() {
    $j('#slideshow').cycle({
        // options here.
    });
});

您可以定义许多选项here。

这几乎总结了自定义幻灯片。如果您想将其打包为模块化插件，则需要参考Codex here。

Answer 2

我认为如果您有wordpress知识，那么只需从模板文件夹中修改header.php文件即可。

Answer 3

以下是一些有用的链接： -

祝你好运..

如何创建自定义wordpress幻灯片插件？

3 个答案: