使用主题定制创建旋转标题/图像滑块

时间:2012-11-03 作者:laggingreflex

所以我正在学习WP,我想为标题创建一个旋转图像滑块(like in this) 使用Theme Customization API. 但我不知道该怎么做setting 我应该用它来拍摄图像,并将其存储在HTML/JS中以供以后制作动画。帮助

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

我们可以做到!首先,您需要在主题定制器上添加一个自定义部分,其中包含所有图像上载(本例中我们将使用3):

add_action( \'customize_register\', \'themename_customize_register\' );
function themename_customize_register($wp_customize) {  

$wp_customize->add_section( \'slides\', array(
    \'title\'          => \'Slides\',
    \'priority\'       => 25,
) );

$wp_customize->add_setting( \'first_slide\', array(
    \'default\'        => \'\',
) );

$wp_customize->add_control( new WP_Customize_Image_Control( $wp_customize, \'first_slide\', array(
    \'label\'   => \'First Slide\',
    \'section\' => \'slides\',
    \'settings\'   => \'first_slide\',
) ) );

$wp_customize->add_setting( \'second_slide\', array(
    \'default\'        => \'\',
) );

$wp_customize->add_control( new WP_Customize_Image_Control( $wp_customize, \'second_slide\', array(
    \'label\'   => \'Second Slide\',
    \'section\' => \'slides\',
    \'settings\'   => \'second_slide\',
) ) );

$wp_customize->add_setting( \'third_slide\', array(
    \'default\'        => \'\',
) );

$wp_customize->add_control( new WP_Customize_Image_Control( $wp_customize, \'third_slide\', array(
    \'label\'   => \'Third Slide\',
    \'section\' => \'slides\',
    \'settings\'   => \'third_slide\',
) ) );
}
使用该代码将添加一个新的部分,其中包含3个文件上载。目前,我们只使用图像。稍后,您可以返回并添加描述、目标URL等。一旦您上载了三张幻灯片,您所需要做的就是在模板中调用它们。

使用函数调用主题选项非常简单get_theme_mod(). 例如,要调用第一张幻灯片,只需使用:

echo get_theme_mod(\'first_slide\')

所以,如果您想在主页上放置一个滑块,您可以打开索引。php并添加如下标记:

<ul class="slider">
    <li><img src="<?php echo get_theme_mod(\'first_slide\') ?>" height="" width=""></li>
    <li><img src="<?php echo get_theme_mod(\'second_slide\') ?>" height="" width=""></li>
    <li><img src="<?php echo get_theme_mod(\'third_slide\') ?>" height="" width=""></li>
</ul>
当然,您仍然需要大量的CSS和JS来制作实际的滑块,但这是使用主题定制器上载、存储和调用图像的基础。

如果您还不太清楚,Otto已经对其他功能做了完美的介绍:http://ottopress.com/2012/how-to-leverage-the-theme-customizer-in-your-own-themes/

结束

相关推荐

Upload images with comment

编辑:我终于得到了正确的答案;请在这篇帖子下面为所有感兴趣的人查看我自己的答案。经过几天的搜寻和反复尝试,我真的被卡住了。我有一个客户,他通过使用评论表在自己的网站上收集客户体验;所有评论都显示为客户评论。到目前为止还不错。但由于这家公司在旅游方面做得很多,他需要让他的客户上传多达五张图片,并附上评论。所以我需要做的是找到一种方法,让客户上传媒体,并填写评论表。我知道这有点冒险,因为可能会上传损坏的图像等等。但我仍然希望实现这一目标。尝试了很多东西,但我一次又一次陷入困境的地方是文件上传处理,对于一个未登