Search code examples
wordpresswoocommercewoocommerce-subscriptionselementor

Display Elementor page to customer in Woocommerce My-Account


I have Woocommerce (Subscriptions) and Elementor. I'm trying to add a page/content within the Myaccount area of Woocommerce - new navigation menu item.

Creating the endpoint and navigation menu bit works without issue. The issue I'm facing is displaying a page created in elementor. One page (also created in elementor) works without issue while the other doesn't.

The page created in elementor is fairly simple that essentially creates 4 columns, 10 rows. Within each row there is button that uses shortcodes to get the button text and url to navigate to when pressed. This is all tested and works without issue when accessing the page directly.

If I use this code

$post = get_post(1114); 
$content = apply_filters('the_content', $post->post_content); 
echo $content;

on the endpoint to display the page the output is just a list of rows of text showing the table cells from left to right. This only shows the button text (no sign of the URL) and is not formatted in anyway like the page in the elementor editor is (or if accessed directly) e.g if the table is

H1    H2    H3    H4
R1a   R1b   R1c   R1d
R2a   R2b   R2d   R2d

The display is

H1
H2
H3
R1a
R1b
R1c
R1d
R2a
R2b
R2c
R2d

If I use the below code

$content = \Elementor\Plugin::$instance->frontend->get_builder_content_for_display( 1119);
echo $content;

the table largely displays correctly with all formatting etc. The one thing that isn't working is the button text. Instead of displaying the text returned by shortcode it just displays the shortcode.

I'm sure I'm just missing something that needs to be processed somewhere but I have no idea what it is and the Elementor pages don't give much away unfortunately.

Any help would be appreciated.


Solution

  • EDIT : The correct answer is that there is a dynamic button/dropdown next to the text field that I didn't notice before. Using this you can select shortcode and enter the shortcode details and it will display correctly without having to process manually.

    Not sure why it doesn't load correctly as above in the first place but to get around it I did the below. No sure this is the correct way to do this but it works.

    $content = \Elementor\Plugin::$instance->frontend->get_builder_content_for_display( 1013 );
        $content = process_subswitch_content_for_shortcodes( $content );
        echo $content;
    

    The below essentially searches the content returned from the get_builder_content_for_display function for '[subswitch' which is the start of the shortcodes in question (unable to just search for ] as elementor puts other [] in the content).

    function process_subswitch_content_for_shortcodes( $content ) {
    
        $keepprocessing = true;
        $searchstart_pos = 0;
        do {
    
            $startchar_pos = strpos( $content, "[subswitch", $searchstart_pos );
            if ( $startchar_pos == false ) {
                $keepprocessing = false;
            }
    
            $endchar_pos = strpos( $content, "]", $startchar_pos );
            $shortcode_request = substr( $content, $startchar_pos, $endchar_pos );
            if ( $shortcode_request == false ) {
                $keepprocessing = false;
            }
    
            $shortcode_content = do_shortcode( $shortcode_request );
            $content = str_replace( $shortcode_request, $shortcode_content, $content );
    
            $searchstart_pos = $endchar_pos;
    
        } while ( $keepprocessing ); 
    
        return $content;
    }
    

    I'd of course still like to know the way to load this directly so that it displays without having to process the shortcodes manually so to speak.