Changing Shortcode without loading data

  • Dee Lete

    (@dee-lete)


    8 years ago

    Is there a way to change a short code using js onclick so that only ONE short is loaded at a time? More specifically, Let’s say i’m using a table short ofr table press and I have 50 tables (one for every state), I have an opening page shortcode load for one table, but I do not want the other codes to load on the page – as loading all 50 tables would slow the page load time down to a crawl.

    Using CSS: display none and jquery: “noshow” still loads the Unseen tables and slows the load time as per GTMetrix and Pingdom has shown me. I realize the page may appear to load quickly, but not from a SEO point of view.

    With the exception of creating a page for each of fifty tables, is there a way to ONLY load one table at a time using shortcodes and using an “onclick” to replace the shortcode for another table? if Yes, how?

    Thank You

Viewing 2 replies - 1 through 2 (of 2 total)
  • Moderator keesiemeijer

    (@keesiemeijer)

    Hi dee-lete

    To help you on your way this code lets you only load the shortcodes you want. Put the following code in your (child) theme’s functions.php file:

    
add_filter( 'the_content', 'MyTheme_the_content' );

function MyTheme_the_content( $content ) {

	// Shortcode name (without brackets)
	$shortcode = 'table';

	if ( has_shortcode( $content, $shortcode ) ) {
		$regex = get_shortcode_regex( array( $shortcode ) );
		$content = preg_replace_callback( "/$regex/", 'MyTheme_do_shortcode_tag', $content );
	}

	return $content;
}

function MyTheme_do_shortcode_tag( $m ) {
	global $shortcode_tags;

	// allow <a href="https://codex.www.ads-software.com/foo">foo</a> syntax for escaping a tag
	if ( $m[1] == '[' && $m[6] == ']' ) {
		return substr( $m[0], 1, -1 );
	}

	$tag = $m[2];
	$attr = shortcode_parse_atts( $m[3] );

	// Load altenative output for the shortcode if the 'load' attribute is not used
	if ( !isset( $attr['load'] ) ) {
		return Mytheme_load_alternative_shortcode_output( $attr );
	}

	if ( ! is_callable( $shortcode_tags[ $tag ] ) ) {
		/* translators: %s: shortcode tag */
		$message = sprintf( __( 'Attempting to parse a shortcode without a valid callback: %s' ), $tag );
		_doing_it_wrong( __FUNCTION__, $message, '4.3.0' );
		return $m[0];
	}

	if ( isset( $m[5] ) ) {
		// enclosing tag - extra parameter
		return $m[1] . call_user_func( $shortcode_tags[$tag], $attr, $m[5], $tag ) . $m[6];
	} else {
		// self-closing tag
		return $m[1] . call_user_func( $shortcode_tags[$tag], $attr, null,  $tag ) . $m[6];
	}
}

function Mytheme_load_alternative_shortcode_output( $attr ) {

	// Check shortcode attribute
	if ( isset( $attr['id'] ) ) {
		$json = esc_attr( wp_json_encode( $attr ) );
		return "<a href='#' data-table-atts='{$json}'>Load table with jQuery Ajax</a>";
	}

	// No table id found, return nothing.
	return '';
}

    This will not load the TablePress shortcodes unless you add the load attribute to it

    
[table id="44" load="true"]

    For all other table shortcodes (without load) it adds a link to the content to load the table with ajax. Let me know if this helps you get started.

    btw:
    consider creating a child theme instead of editing your theme directly – if you upgrade the theme all your modifications will be lost. Or create a plugin with the code above.

    Thread Starter Dee Lete

    (@dee-lete)

    keesiemeijer, first apologize for the long delay – life dealt me a curve. I appreciate your response.

    I tried a few different JS methods to select ONE state from my list to display ONE table only, with no success. Can what I am trying to do only be accomplished with AJAX? Cannot change “shortcode” as the change is on the front side and needs to be on the server side…right?

    your code works fine – but adding “load=”true” to every shortcode in the html will still load ALL the tables on the page… Or am I not seeing the obvious?

    Any more help will be helpful

    Dee

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Changing Shortcode without loading data’ is closed to new replies.