Custom Shortcodes in X Theme via add_shortcode()

I am trying to create custom shortcodes to display my WooCommerce cart total in different locations. I have the WooCommerce side of things figured out and if I just use add_action() I am able to include the information I wish to display in select WooCommerce areas, however I am trying to create a custom shortcode so that I can display the shopping cart total in a separate X Theme column. Whenever I try to use add_shortcode() and include the shortcode in a Pro builder page, I am able to save the builder once and then it will load on the front end once. However, if I try to save that page with my custom shortcode again, after attempting to save I always see the notification “Uh oh, failed to save” and I am unable to save and re-publish the page.

I am using a previous Themeco answer as the basis for building my custom shortcode as seen here:

I have tried putting the shortcode creation PHP into my child theme functions.php and in the Code Snippets plugin but both make my page “un-saveable.” Any help would be greatly appreciated.

You can see the code I am using based on that Themeco forum answer and then my shortcode in a text element in the screenshots below. I was unable to capture the error message when saving the page but it is just the generic “Uh oh, failed to save” that happens when any Pro builder page fails to save.

Thank you!

shortcode

Hi @Hyperbits,

Thank you for writing in, I tried to use your very own code on my dev site and I did not encounter the issue, there must be a conflict somewhere, try placing your shortcode on a RAW Content element and on that RAW Content element, turn on the Disable Preview option so it’s not going to affect the builder.

Here is a better solution, instead of using a custom shortcode. Use the Dynamic Content feature, among the things that the dynamic content can do is to output the cart total, try this code {{dc:woocommerce:cart_total_raw}} instead of custom shortcode.

Hope it helps,
Cheers!

Hi @friech,

Thank you for the Dynamic Content info, very helpful and no more problems saving! Using {{dc:woocommerce:cart_total_raw}}, the total on the right in the screenshot below does show the cart total and it even updates after I enter a coupon code when the page refreshes. However, with Woocommerce, if I click “remove,” on the entered coupon only the Woocommerce area on the left reloads (with the total going back to $2,297) the total circled in yellow stays the same ($1897). Is there a way to make the dynamic content reload when Woocommerce reloads or would it just require a full page refresh of the X page to update the cart total dynamic content when the coupon code is removed?

Thank you!

Hello, @Hyperbits,

The features that you want it would require custom development. I would suggest you contact a developer who can assist with your concern. Please note that we don’t provide custom developent support. It is out of the support scope.

Thanks for understanding

Thank you @prakash_s,

I have transferred these pages over from our staging site to our live site and now I am running into the “Uh oh! Failed to save” error when using the Pro builder to “Publish” and save. If I choose “Publish” from “Quick Edit” on the non-X Theme WordPress pages menu, I am able to publish the pages just fine but only unable to publish from within the Pro builder. I just tested again on staging and publishing works for these pages in the Pro Builder, it is only now on the Live site that I am unable to publish these pages after making updates in the Pro builder. The console errors are shown below

Thank you.

Hi @Hyperbits,

There might be some different reasons behind your issue, I would like to suggest troubleshoot the following common issue to help us to recognize the reason.

1.Plugin Conflict
2.Theme Update related issue
3.Child Theme Related issue
4.CSS/JS Customization
5.Disabling Cache

If you discover that an issue is coming from a custom code or 3rd party plugin, kindly consult with a developer or contact the plugin author. Please note that we do not provide support for custom codes and 3rd party plugins.
If the above points do not resolve your issue, please provide login credentials for your site in a secure note to examine it further, including:

– WordPress Site URL & Login URL
– WordPress Admin username/password

To create a secure note, click the key icon underneath any of your posts.

Thanks

Thank you @tristup

I have gone through the 5 troubleshooting steps you recommended and unfortunately the saving issue is still happening. In the Pro Builder, if I change the pages to “Draft,” save updates, switch back to “Publish” and then click save again, my changes save and my page updates even though the error still says “Uh oh! Failed to save.” So this set up works but it appears something is still amiss as the Pro builder is not recognizing that the page is saving even though it is. I have added login credentials in a secure note.

This issue is happening on pages:

Masterclass Complete Checkout
Masterclass Coaching Checkout
Bootcamp checkout

Please let me know if you need any additional information.

Thank you!

Hello @Hyperbits,

Please go to Tools > Site Health and make sure to resolve the 1 critical issue and some other performance issues. These issues highly affect the builder. You may need to contact your hosting provider for further assistance in resolving some of the server issues.

Kindly let us know how it goes.

Hi @ruenel,

This is a brand new issue with WooCommerce and the loading of dynamic content for the cart total. In fact, right when I started using the dynamic content and this issue started, I started receiving “fatal error” messages from WordPress for the dynamic content element as shown in the screenshot below. I understand the issue you pointed to in your last message is an improvement that needs to be made, however, we have been using jQuery migrate for some time now (mostly due to the fact that “The Grid” plugin uses some jQuery that is out of date and needs jQuery migrate as a bridge to function.

I was instructed by @friech earlier to use the Dynamic Content element instead of a custom shortcode as it would work better with X Theme, however, using Dynamic Content, I am still unable to save pages (when I delete the dynamic content element in the page, I am able to save with no issue). Is there some other way I should be using the Dynamic Content element so that it saves properly in the builder?

**As a follow up detail, it appears that I am able to save one page that uses the “cart total” Dynamic Content element, but if I try to use the Dynamic Content element on any additional pages, I am unable to save those additional pages.

Here is the fatal error message from WordPress related to Dynamic Content:

Thank you.

Hello @Hyperbits,

The dynamic content to get the cart total will only work on the Check Out page that is assigned as your WooCommerce checkout page in WooCommerce > Settings > Advanced > Page Setup. You cannot this dynamic content on any ordinary pages.

Best Regards.

If using dynamic content as suggested by @friech can only be used on the WooCommerce designated checkout page as @ruenel has suggested, it seems that my other option would be the custom shortcode that I was trying to use originally. I have tried to use the shortcode in a RAW content element as suggested and it works as long as it is only used on one page. However, when I try to include the shortcode on more than one page, then I get the “Uh oh! Failed to Save” error when I try to save the page in the builder. It would be nice to have a way to display the cart total wherever I choose on any page and the shortcode was my solution for doing that. Is there a way to include this cart total shortcode on multiple pages in X Theme? If not, is there another method that works with X Theme for displaying the cart total on more than one page?

Thank you!

Hi @Hyperbits,

I have checked the pages where you are having the issue while saving the content but didn’t replicate the issue. I have also found the [x_custom_shortcode_name] shortcode used in the Masterclass Complete Checkout page but didn’t find the definition of the shortcode in your child theme, and that is why it is not working. If you trying to show the Cart Total, you can use the following Dynamic Content tag on any pages instead of any shortcode.

{{dc:woocommerce:cart_total_raw}}

{{dc:woocommerce:cart_total}}

Hope it helps.
Thanks

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.