abdulawal39

Tabs Shortcode for WordPress

Dec 18th, 2015
1,900
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. function tab_func( $atts, $content = null ) {
  2.     extract(shortcode_atts(array(
  3.       'title'  => '',
  4.       'link'   => '' ,
  5.       'target' => ''
  6.     ), $atts));
  7.     global $single_tab_array;
  8.     $single_tab_array[] = array('title' => $title, 'link' => $link, 'content' => trim(do_shortcode($content)));
  9.     return $single_tab_array;
  10. }
  11. add_shortcode('tab', 'tab_func');
  12. /* Shortcode: tabs
  13.  * Usage:  
  14.  *  [tabs]
  15.  *    [tab title="title 1"]Your content goes here...[/tab]
  16.  *    [tab title="title 2"]Your content goes here...[/tab]
  17.  *  [/tabs]
  18.  */
  19. function tabs_func( $atts, $content = null ) {
  20.     global $single_tab_array;
  21.     $single_tab_array = array(); // clear the array
  22.    
  23.     $tabs_nav = '';
  24.     $tabs_content = '';
  25.     $tabs_output = '';
  26.  
  27.     $tabs_nav .= '<div class="tabs tabs-style-topline">';
  28.     $tabs_nav .= '<nav>';
  29.     $tabs_nav .= '<ul>';
  30.    
  31.      // execute the '[tab]' shortcode first to get the title and content - acts on global $single_tab_array
  32.     do_shortcode($content);
  33.    
  34.     //declare our vars to be super clean here
  35.     foreach ($single_tab_array as $tab => $tab_attr_array) {
  36.       $random_id = rand(1000,2000); // potential duplicate issue.. need to fix
  37.      
  38.       $default = ( $tab == 0 ) ? ' class="active"' : '';
  39.      
  40.       if($tab_attr_array['link'] != ""){
  41.         $tabs_nav .= '<li'.$default.'><a class="tab-me-link" href="' . $tab_attr_array["link"] . '" target="' . $tab_attr_array["target"] . '" rel="tab'.$random_id.'"><span>'.$tab_attr_array['title'].'</span></a></li>';
  42.       }else{
  43.         $tabs_nav .= '<li'.$default.'><a href="javascript:void(0)" rel="tab'.$random_id.'"><span>'.$tab_attr_array['title'].'</span></a></li>';
  44.         $tabs_content .= '<div class="section-topline" id="tab' . $random_id . '" ' . ( $tab!=0 ? 'style="display:none"' : '') . '>'.$tab_attr_array['content'].'</div>';
  45.       }
  46.     }
  47.     $tabs_nav .= '</ul><!-- .tab-me-tabs -->';
  48.     $tabs_nav .= '</nav><!-- .tab-me-tabs -->';
  49.     $tabs_output = $tabs_nav . '<div class="content-wrapper">' . $tabs_content . '</div>';
  50.     $tabs_output .= '</div><!-- .tabs-wrapper -->';
  51.     return $tabs_output;
  52. }
  53. add_shortcode('tabs', 'tabs_func');
  54. function tab_me_scripts(){
  55.   wp_enqueue_style('tab-me-styles', get_template_directory_uri() . '/css/tabstyles.css' );
  56.   wp_enqueue_style('tab-me-styles', get_template_directory_uri() . '/css/tabs.css' );
  57.  
  58.   wp_enqueue_script('tab-me-js', get_template_directory_uri() . '/js/cbpFWTabsjs', array('jquery'), null, true );
  59. }
  60. add_action('wp_enqueue_scripts', 'tab_me_scripts');
RAW Paste Data