Pass variable to add_shortcode functions

Resolved

(@joanc2)

Hi everybody,

Using code snippets created shortcodes to show custom post title, image and content (only text) in an Elementor popup, with this code:

add_shortcode("Sh_Post_Title", function () 
      {$post_title = 'My_Post_Title';
	return $post_title;
	});

add_shortcode("Sh_Post_Image", function () 
      { $post_title = 'My_Post_Title';
	$post = get_page_by_title($post_title, 'OBJECT', 'My_Custom_Post_Type_Name');
	echo get_the_post_thumbnail($post->ID, 'large' );
      });

add_shortcode("Sh_Post_Content", function ()
       { $post_title = 'My_Post_Title';
	 $post = get_page_by_title($post_title, 'OBJECT', 'My_Custom_Post_Type_Name');
	 return $post->post_content;;
	});

Fine when writing the post title in functions, but what I try is to pass it as a variable from the page where I trigger the popup with javascript, this way:

In frontend side:

<script>
	var post_title = 'My_Post_Title';
	var Show_Button = document.getElementById("Show_Button_Id");
	Show_Button .onclick = function(event)
             { //Pass sonehow post_title to server php add_shortcode functions;
	       //Show Popup:
	       elementorFrontend.documentsManager.documents[popup_id].showModal();
	      };
</script>

In server side (code snippet):

add_shortcode("Sh_Post_Title", function ()
          { //$post_title = retrieve post_title var from client javascript;
   	    return $post_title;
	  });
..................

Can’t find a way to achieve this. Read about Ajax posts (wich are new to me), or using the admin_url( ‘admin-ajax.php’ ) function, but it seems having to be sent to ‘admin-ajax.php’, and don’t know how to add shortcodes to it with code snippets (I’d rather not have to create or edit php files in my theme).

Some idea? Will appreciate any help 😉

Viewing 1 replies (of 1 total)

Plugin Author

Shea Bunge

(@bungeshea)

4 years, 1 month ago

I recommend using JavaScript to set the value of some existing element instead of trying to pass it to a shortcode.

For example, include a selector in your shortcode:

add_shortcode( 'sh_post_title', function () {
     return '<span id="post-title">default title</span>'
} );

And then select this element with JavaScript and set its new value:

<script>
var post_title = 'new post title';
var button = document.getElementById('show-button-id');
button.addEventListener( 'click', function () {
    document.getElementById('post-title').textContent = post_title;
} );
</script>

Viewing 1 replies (of 1 total)

The topic ‘Pass variable to add_shortcode functions’ is closed to new replies.

Tags