Viewing 1 replies (of 1 total)
  • I know some time has passed, but I have exactly the same requirement to use an ID on the tab.

    It would have been great if the plugin author had added this feature already, because I have seen it requested before. However, I have found that 3 lines of code being changed is enough to add an ID to the tab-control elements rather than the tab content elements.

    For me this allows me to use jQuery to modify the classes applied to the tabs to disable or enable a tab dynamically which is enough for now, but it leaves the problem of what to do when the plugin has updates in the future.

    For anyone wanting to do this themselves look for the file shortcodes.php in the inc\core sub-folder in the plugin and simply add the ID to the arrays in the ‘tab’ function as shown below

    public static function tab( $atts = null, $content = null ) {
    		$atts = shortcode_atts( array(
    				'title'    => __( 'Tab title', 'su' ),
    				'disabled' => 'no',
    				'anchor'   => '',
    				'url'      => '',
    				'target'   => 'blank',
    				'class'    => '',
    			        'id'       => ''
    			), $atts, 'tab' );
    		$x = self::$tab_count;
    		self::$tabs[$x] = array(
    			'title'    => $atts['title'],
    			'content'  => do_shortcode( $content ),
    			'disabled' => ( $atts['disabled'] === 'yes' ) ? ' su-tabs-disabled' : '',
    			'anchor'   => ( $atts['anchor'] ) ? ' data-anchor="' . str_replace( array( ' ', '#' ), '', sanitize_text_field( $atts['anchor'] ) ) . '"' : '',
    			'url'      => ' data-url="' . $atts['url'] . '"',
    			'target'   => ' data-target="' . $atts['target'] . '"',
    			'class'    => $atts['class'],
    			'id'       => $atts['id']
    		);
    		self::$tab_count++;
    		do_action( 'su/shortcode/tab', $atts );
    	}

    You also need to modify the ‘tabs’ function to use the ID as shown in this line (around line 35) which actually generates the HTML markup for the tabs.

    $tabs[] = '<span id="'.$tab['id'].'" class="' . su_ecssc( $tab ) . $tab['disabled'] . '"' . $tab['anchor'] . $tab['url'] . $tab['target'] . '>' . su_scattr( $tab['title'] ) . '</span>';

    I know how to add a linked ID to the tab contents, but I do not need this for my project yet!

    I hope this might point someone in the right direction.

    David

Viewing 1 replies (of 1 total)
  • The topic ‘Add unique ID to shortcode tabs’ is closed to new replies.