How to replicate a shortcode inside template

Viewed 62

In wordpress functions.php file I have a shortcode that allows me to display the order ID when I'm on the view-order.php page. The shortcode works fine.

What I am trying to do is find a more comfortable alternative to this. So I would like to take advantage of the Twig template, so I'm doing some testing. I'm actually viewing the order ID, but it stays the same for every order I decide to view.

Example:

  • if I view the order 001, the ID 001 is shown (correct)
  • if I view the order 002, the ID 001 is shown (incorrect)

With the shortcode this does not happen, I can correctly display the ID of each order. Can anyone tell me where I'm doing wrong?

I've already done the same thing with my-orders page and my-downloads page, it worked fine, but for some reason it's not working with view-order.php page.

I appreciate any response, thanks.

add_shortcode( 'view_order_id' , 'view_order_00' );
function view_order_00(){
 $order_id = absint( get_query_var('view-order') );
 $order = new WC_Order( $order_id );
 return $order->get_id();
}
{% set post = system.get.order_id|php('get_post') %}
{% set order = post.ID|php('wc_get_order') %}
{% for item in order.get_items %}
{% for download in order.get_downloadable_items %}

<div>{{post.ID}}</div>
  
{%endfor%}
{% endfor %}
1 Answers

I am using a third party plugin called e-addons, this offers many widgets for elementor, including Twig Template.

I contacted plugin support and they told me that I would have to pass the order ID in $ _GET to fix the problem. Furthermore, all this must be done in a dedicated elementor page and not in the view-order.php template as I was doing initially.

So here is a brief explanation of what I did step by step to fix the problem. I hope it will be useful to anyone who has had the same difficulties as me.

1. I created a new page with elementor titled test page. The

2. I copied the permalink of the newly created page (test-page) and put it in a filter in the functions.php file, here it is below.

// When you click on view order, this filter allows you to redirect from view-order (original woocommerce endpoint) to a custom page created with elementor.
function filter_woocommerce_get_endpoint_url( $url, $endpoint, $value, $permalink ) {
    
    // Specific endpoint: If in the advanced settings of woocommerce you have changed the endpoint view order, then below you have to replace view-order with the one you have chosen in the advanced settings wi WC
    if ( $endpoint === 'view-order' ) {
    
    // New URL: change test-page with permalink of the page you created earlier. The /?order_id= part should not be removed.
    $url = $permalink . 'test-page/?order_id=' . $value;
} 
return $url;
}
add_filter( 'woocommerce_get_endpoint_url', 'filter_woocommerce_get_endpoint_url', 10, 4 );

3. After setting the filter with the permalink we need to modify the new page with elementor. Once in the editor I selected the e-Addons Posts Query widget and dragged it to the page area.

Step 3 opens here, follow these steps to configure the widget correctly, only change what is mentioned below:

Go to the Query Tab of the query posts widget

Query

  • In query type select Post Type
  • In options> post type select order
  • in post status select Any

Query Filter

  • in "By" select Meta Key

in Mtakey Filters add new and modify as follows

  • in Post Field custom meta key select _customer_user
  • in Value Type select Numeric
  • in Compare operator select "="
  • in Post Field Value select User Field

If you do everything correctly in step 3, the user will be able to view the orders, otherwise if you do something wrong you get nothing. Here ends step 3.

4. Then go to the first tab of the widget entitled Content. Here you have to go to the menu item titled Post Items, and this is where I played with the Twig template. So the code I originally posted in my question now works.

{% set post = system.get.order_id|php('get_post') %}
{% set order = post.ID|php('wc_get_order') %}
{% for item in order.get_items %}
{% for download in order.get_downloadable_items %}

<div>{{post.ID}}</div>
  
{%endfor%}
{% endfor %}

Now, when I am on the order history page and click on view order I am redirected correctly to the specific order page which for example is mywebsite.com/account/test-page?order_id=xxxxxx

Related