add Text before button, and make them inline

I have applied your Code Snippet, and things got worse: no Text was shown, and no button was shown, as you can see here– https://prnt.sc/qGz3BEt4S7VN

You see, when I saw your code, I suspected that something is wrong with it, because I wanted to apply the Code to a WooCommerce hook, but I didn’t see anything in your Code related to WooCommerce hook.

The hook I want to apply it to, is any of:
— woocommerce_after_add_to_cart_button
— woocommerce_after_variations_form
— woocommerce_after_add_to_cart_form

But I did not see any of these WooCommerce hooks in your Code Snippet, thence I suspected that your code will not work.

Can you Please send me a Code Snippet that directly targets a WooCommerce hook, so that I can have the Text and button around the WooCommerce hook?

Needing to hear from you soon.

Regards.

Like I said earlier, this is what I want to achieve– https://prnt.sc/20kZX3ffC3Ux

Presently, this is what I have— https://prnt.sc/7RQlsEJUAryj

Even though I entered this your code:

//ADD TEXT AND POPUP BUTTON AFTER WOOCOMMERCE ADD TO CART BUTTON
add_action( 'woocommerce_after_add_to_cart_form', 'wpb_pcf_contact_form_button', 30 );
add_filter( 'wpb_pcf_button_html', function( $html ){
        $output =  '';
        $output .= 'Need more items? ';
        $output .=  $html;
        $output .=  '';
        return $output;
} );

And this CSS:

.wpb_pcf_button_wrapper {
    display: flex;
    align-items: center;
    gap: 20px;
}

Nothing still happens. It doesn’t yet align the Text and the button.

What I think could help, is to use a type of code which will echo the Text as a span, and echo the button shortcode in a span as well– where we can have something like:

echo  '<span class="before-btn-text>Need more items?</span> <span>[wpb-pcf-button]</span>'

Waiting to hear from you soon.

Regards.

1.) Please remove every custom code that you added.
I did not add any Custom Code. The only Code is the one you provided me, as you can see here– https://prnt.sc/Z5j6vWAVy7m0

2.) And tell me how you added the button on your product page? I mean by using our shortcode or any other ways?

I added the button using your WooCommerce hook:

add_action( 'woocommerce_after_add_to_cart_form', 'wpb_pcf_contact_form_button', 30 );

Give me a screenshot of the admin area where you added this.
Here’s the screenshot of the admin area where I added the code:

https://prnt.sc/Z5j6vWAVy7m0

For the CSS you provided, I added it in Additional CSS under Customizer. Here is it:
https://prnt.sc/Te0Akyrrrtid

Presently, this is what I have— https://prnt.sc/7RQlsEJUAryj

But this is what I expect to have– https://prnt.sc/20kZX3ffC3Ux

Please, help me with a Code straight up that will fix this issue once and for all.

Needing to hear from you soon.

Regards.

I tried the WooCommerce version of your Popup plugin. I realized that the normal one is even better, for some good reasons:

1.) With the normal one, I could use WooCommerce hooks to place it in my Single Product Page, and in my Product Loops.

Whereas, with this WooComerce version, I could place it on my Product Loops as you can see here–https://prnt.sc/2BOx41XOUoqD

But it doesn’t show on my Single Product Page, as you can see here– https://prnt.sc/8jm1PmNq6mIU

Even though I have checked it to show, as you can see here– https://prnt.sc/_nd39Pc7JnnL

2.) The normal one is Customizable beyond your default settings. For example, I could use WooCommerce hooks to place it anywhere around WooCommerce Templates, and I can add Texts, Icons, Images and other elements around the button, with the correct PHP Code snippets.

Whereas, there’s no way I can customize this WooCommerce version to add elements like Texts, Icons, Images and other elements around the button.

Or is there a way I can achieve such request with the WooCommerce version?

3.) I removed the WooCommerce version, and returned to the normal version.
Unfortunately, everything got worse:: I have added the PHP Code snippet you provided, as seen here– https://prnt.sc/BJeQKRwp1SpX

Then I added the CSS you provided, as seen here— https://prnt.sc/Ymm-GBhnUHtx

Yet, the Text and Button no longer shows again, as you can see from the Page— https://www.yomatdirectfromfarm.buylagospro.com/product/2-abuja-yams/

What’s the problem? — and how do I fix it?

Needing to hear from you soon

Regards.