所以我从短代码开始,这是我第一次尝试制作一个,我用它来制作css/js选项卡以获取信息,并基于我从前面得到的代码。。
因此,我将尽最大努力解释我所拥有的以及我正在努力做的事情。
以下是我的简短代码
[tabs]
[tab title="This is tab 1 Title"]Tab 1 Content [/tab]
[tab title="This is tab 2 Title"]Tab 2 Content [/tab]
[tab title="This is tab 3 Title"]Tab 3 Content [/tab]
[tab title="This is tab 4 Title"]Tab 4 Content [/tab]
[/tabs]
这是我用来制作选项卡的代码 /* -----------------------------------------------------------------
Tab
----------------------------------------------------------------- */
// Set up Scripts For Tabs
function add_tabs_scripts_to_head(){
wp_register_script( \'custom-script\', get_template_directory_uri() . \'/js/zozoTabs.js\' );
// For either a plugin or a theme, you can then enqueue the script:
wp_enqueue_script( \'custom-script\' );
}
// Set up Style For Tabs
function add_tabs_style_to_head(){
wp_register_style( \'custom-style\', get_template_directory_uri() . \'/css/zozoTabs.css\');
// For either a plugin or a theme, you can then enqueue the style:
wp_enqueue_style( \'custom-style\' );
}
add_action(\'template_redirect\', \'add_scripts\');
extract(shortcode_atts(array(
\'style\' => false,
\'orientation\' => false,
), $atts));
function add_scripts() {
global $wp_query;
if ( is_singular() ) {
$post = $wp_query->get_queried_object();
if ( false !== strpos($post->post_content, \'[tabs\') ) {
// Adding the style JUST when needed
add_action( \'wp_enqueue_scripts\', \'add_tabs_style_to_head\' );
add_action( \'wp_enqueue_scripts\', \'add_tabs_scripts_to_head\' );
}
}
}
add_shortcode(\'tabs\', \'ts_tab\');
function ts_tab($atts, $content = null, $code) {
if (!preg_match_all("/(.?)\\[(tab)\\b(.*?)(?:(\\/))?\\](?:(.+?)\\[\\/tab\\])?(.?)/s", $content, $count)) {
return do_shortcode($content);
} else {
for($i = 0; $i < count($count[0]); $i++) {
$count[3][$i] = shortcode_parse_atts($count[3][$i]);
}
$output = \'
<script>
$(document).ready(function () {
$("#tabbed-nav").zozoTabs({
defaultTab: "tab1",
rounded: false,
});
});
</script>
<div id="basic-usage">
<div id="tabbed-nav">
<ul>
\';
for($i = 0; $i < count($count[0]); $i++) {
$output .= \'<li><a>\' . $count[3][$i][\'title\'] . \'</a></li>\';
}
$output .= \'</ul>\';
$output .= \'<div>\';
for($i = 0; $i < count($count[0]); $i++) {
$output .= \'<div>\' . do_shortcode(trim($count[5][$i])) . \'</div>\';
}
$output .= \'</div>\';
return \'<div class="tabcontainer">\' . $output . \'</div></div></div>
\';}
}
和一个相同的粘贴箱:http://pastebin.com/wZ6VRPwm所有这些都很好,但我要做的是让我的简短代码从下面开始
[tabs orientation="vertical"]
它会增加orientation: "vertical"
, 粘贴到粘贴箱的第52行,使其看起来像这样
<script>
$(document).ready(function () {
$("#tabbed-nav").zozoTabs({
defaultTab: "tab1",
rounded: false,
orientation: "vertical",
});
});
</script>
这就是问题所在,我已经尝试了所有我能想到的和搜索的方法,但没有找到任何地方。