I've been trying to make a shortcode function that outputs some html for a tabbed gallery, and after many days I haven't gotten far. Here's an example of the shortcode:
[thumbTab id="test1" nav="top" shadow="off"]
[imgTab id="1" src="source1" width="1280" height="720" ]
[vidTab id="2" src="source2" width="1280" height="720" ]
[htmlTab id="4" preview_src="source3"] Other HTML stuff in here [/html]
[/thumbTab]
I want the returned html to be something like this (simplified for example):
<div>
<nav>
<img .../> /* 1st nested shortcode */
<img.../> /* 2st nested shortcode */
<img.../> /* 3st nested shortcode */
</nav>
<div>
<img.../> /* 1st nested shortcode */
<video.../> /* 2st nested shortcode */
<section.../> /* 3st nested shortcode */
</div>
</div>
Therefore I need the nested shortcodes to output data into a nav
tag and into a div element. The problem with this is (I think) it requires a variable accessible to the main and nested shortcode functions, which is what I've been stuck on.
My attempt at the shortcode plugin is below (fatal error upon attempted install). I'd appreciate a correction to my existing code or perhaps advice on a better approach to the problem.
add_shortcode('thumbTab', 'thumbTab_func');
function thumbTab_func( $atts, $content = null ) {
$a = shortcode_atts( array(
'id' => 'theID',
'nav' => 'top',
'shadow' => 'off'
), $atts );
class thumbTab_class
{
//Array to hold tabbed content
$tabCon = array();
//Array to hold navigation tabs
$navCon = array();
//run nested shortcodes
do_shortcode( $content, $ignore_html = false);
//combine $navCon array elements into the navigation tab html
function navCreate(){
$navReturn = '<div><nav><ul>';
for ($i = 0; $i < count($this->navCon) ; ++$i) {
$navReturn .= $this->navCon["$i"];
}
$navReturn .= '</ul></nav></div>';
return $navReturn;
}
//combine $tabCon array elements into tabbed content html
function tabCreate(){
$tabReturn = '';
for ($i = 0; $i < count($this->tabCon) ; ++$i) {
$tabReturn .= $this->tabCon["$i"];
}
$tabReturn .= '</ul></nav></div>';
return $tabReturn;
}
// Assigning processed html code to variable
$thumbReturn = '<div id="'.$a["id"].'" class="thumbTAB">';
$thumbReturn .= navCreate();
$thumbReturn .= tabCreate();
$thumbReturn .= '</div>';
}
$thumbTab_class = new thumbTab_class();
// output processed html
return $thumbTab_class->thumbReturn;
}
//One nested shortcode function for testing
add_shortcode('imgTab', 'imgTab_func');
function imgTab_func( $atts ) {
$a = shortcode_atts( array(
'id' => 'no_order',
'src' => 'no_source',
'width' => '100%',
'height' => 'auto'
), $atts );
//create baseline structure
$img = '<img src="'.$a["src"].'" width="'.$a["width"].'" height="'.$a["height"].'">';
//assign tabbed html string to tabCon array using the id number to place in order
$this->tabCon["a['id']"] = '<section class="tabPage tabPage_'.$a["id"].'>'.$img.'</section>';
//same for nav html string
$this->navCon["a['id']"] = '<li class="sDS tabHeader_'.$a["id"].'">'.$img.'</li>';
}