[Resolved] New Divi Integration & WooCommerce Views Issues

[Author]

Posts

[zacharyL]

I am trying to: Use Divi, WooCommerce & WC Wishlists plugin together

Link to a page where the issue can be seen: hidden link

I expected to see: The "Add to Wishlist" button

Instead, I got: Nothing

Summary of Issue

Ok, so this is still related to the issue in my previous ticket that I couldn't re-open (hidden link). Turns out, disabling & re-enabling Divi didn't actually "fix" the issue, but rather Toolset "forced" the WooCommerce Views settings back to what we initially were trying to avoid (Screenshot: hidden link). If I switch these back to the top 2 options, some of the issues in the previous ticket come back, plus a new one:

1. Unexpected WooCommerce loop output at top of site: hidden link

2. NEW - Single Product Template Completely Trashed: hidden link

3. SQL GROUP BY filter "IS" working now for some reason (SOLVED)

If I leave those 2 options as is (bottom radios using Toolset's Templates), I run into this issue:

1. Any output from plugins like WooCommerce Wishlist isn't showing: hidden link (should see a "Add to Wishlist" button: hidden link)

Questions

1. How do I get Toolset's Template's to be compatible with WooCommerce plugins that output things like "Add to Wishlist" buttons? How would this be useful if none of the WooCommerce plugins are compatible with Toolset's Layouts?

2. Do you have any further thoughts on why the site is exploding using the top radio options in the WooCommerce Views settings page?

3. Is there a legitimate reason why you can't use the top 2 WooCommerce Views radio options with Divi? Why is it forcing those options?

Everything is updated, I've tried deactivating plugins, switching themes, etc. This is a bit of a nightmare, especially when we're supposed to launch within a week lol.

P.S. It seems like the 12hr window to re-open tickets is a bit too short. I've had to fill out 2 completely new tickets (debug info, etc) just because my issue came back 24hrs later. Just a thought.

[Luo Yang]

Dear Zachary,

There are lots of questions in this thread, I am trying to answer them one by one.
Q1) How do I get Toolset's Template's to be compatible with WooCommerce plugins that output things like "Add to Wishlist" buttons? ...
For those kind of cases, I suggest you setup it as a shortcode, then put the shortcode into content and layout cells, for example the "Add to Wishlist" buttons:
1) add below codes into your theme/functions.php:

add_shortcode('add-to-wishlist-button', 'add_to_wishlist_button_func');
function add_to_wishlist_button_func($atts, $content) {
    ob_start();
    $GLOBALS['wishlists']->add_wishlist_form();
    $res = ob_get_contents();
    ob_get_clean();
    return $res;
}

2) use above shortcode in the content [add-to-wishlist-button]
It is only an example, you will need to customize it as what you want

Q2) Do you have any further thoughts on why the site is exploding using the top radio options in the WooCommerce Views settings page?
I assume we are talking about these options in the "WooCommerce Views" setting page:
WooCommerce Plugin Default Template (doesn't display layouts)
&
WooCommerce Plugin Default Archive Template (doesn't display layouts)

so if you use those options, then it will use template file from Woocommerce plugin to display the single product post and archive page.

See our document:

According to our document:
https://toolset.com/documentation/user-guides/getting-started-woocommerce-views/

I am not sure why it is exploding when you using the top radio options, I checked your screenshot:
hidden link
Is it the woocommerce shop page or single product page?
I just test it in my localhost with a fresh wordpress installation:
Woocommerce plugin + Woocommerce View plugin + original Divi theme
I can not see similar problem, see screenshot shop-page.JPG
I suggest yoccu try these:
1) Deactivate other plugins and switch to original Divi theme,
2) If the problem persists, please
provide a database dump file of your website, and describe detail steps to duplicate same problem, how and where I can see the problem, I need to test and debug it in my localhost,

Q3) Is there a legitimate reason why you can't use the top 2 WooCommerce Views radio options with Divi? Why is it forcing those options?
I assume we are talking about these options in the "WooCommerce Views" setting page:
WooCommerce Plugin Default Template (doesn't display layouts)
&
WooCommerce Plugin Default Archive Template (doesn't display layouts)

There isn't any legitimate reason, I just test it in my localhost with a fresh wordpress installation:
Woocommerce plugin + Woocommerce View plugin + original Divi theme
I can see those two options are check-able, see screenshot:
divi-woocommerce.JPG

[Luo Yang]

Thanks for the details, I am downloading the Duplicator Package file, will feedback if there is anything found

[Luo Yang]

Here are what I found:
Q1. Taxonomy archives aren't showing anything, and they're giving me a "Need to select a Layout" warning: hidden link
As the warning message, you will need to create a layout for the taxonomy archive page, and add a Views wordpress archive cell into the layout, see our document:
https://toolset.com/documentation/toolset-training-course/part-2-creating-layouts-for-archives/

Q2). I need a Custom Search on the Archive Pages
Yes, it is possible within Views plugin, for example in above Views wordpress archive cell, you can setup the custom search form, see our document:
Building Custom Searches for Any Content Type
https://toolset.com/documentation/user-guides/front-page-filters/

Q3) We personally prefer to still have a proper Header/Footer Parent Layout,
According to our new document:
https://toolset.com/documentation/recommended-themes/toolset-divi-integration/
The header and the footer are setup by Divi theme, so it is not recommended to setup them with Layouts plugin when you are using Divi theme. But if you agree, we can take it as a feature request.

Q4) Is it possible to use WooCommerce's default Archive Template AND have a Custom Search control the query?
Yes, I just tested it with your duplicator pacakage:
1) Enable the option "WooCommerce Plugin Default Archive Template (doesn't display layouts)" in in the WooCommerce Views settings page
2) Create a layout assigned it to archive page of post type "Products", add a wordpress archive cell in the layout, in the wordpress archive setup custom search form, it works fine in the front-end shop page. see above document:
https://toolset.com/documentation/toolset-training-course/part-2-creating-layouts-for-archives/

Q5) Is there a legitimate reason why I can't assign a parent to a Child Layout that has a WordPress Archive Cell in it?
When you edit a layout for archive page, you should be able to see the warning message:
If you want to design layouts for the entire page, you need to integrate Layouts into the theme
Since the Divi theme isn't full integrate with Layouts plugin, for the same reason of Q3), the header and the footer are setup by Divi theme, so you can not assign "a parent layout to a Child Layout that has a WordPress Archive Cell in it"

[zacharyL]

Ok, we're getting closer, but still have some major issues:

Q3) - "We personally prefer to still have a proper Header/Footer Parent Layout"

- RE: I'd like to put this "option" in as a feature request, but see Q5 below, as that might be a better approach for you guys.

Q4) - "Is it possible to use WooCommerce's default Archive Template AND have a Custom Search control the query?"

- RE: I did this, but it does not appear that WooCommerce's templates are being used. See here: hidden link - If you disable Toolset's Views/Layouts/WooCommerce Views, you'll see what WooCommerce's output actually looks like: hidden link

Q5) - "Is there a legitimate reason why I can't assign a parent to a Child Layout that has a WordPress Archive Cell in it?"

- RE: Understood. What is the process for integrating Divi into Layouts the proper way? We use a Divi Child theme, and if possible, I'd like to add the proper code to allow me to manually put in Divi's components for maximum flexibility. I completely understand why you've gone the route of letting 3rd party themes control whatever they want and only have Toolset control the content area. That seems like the most reliable way to support third party themes, so if there's a formal process I can take to modify Divi's behavior to allow for parent/child layouts, please let me know.

Q6) The "Single Product" template is missing it's description (Missing: hidden link - Visible: hidden link). What's even weirder, if I leave the WooCommerce Views settings like so (hidden link), create a Single Product Layout like so (hidden link), I get undesired output in the Description area: hidden link

Keep in mind all this is on a completely blank slate (my duplicator package) with Divi 3.0/Toolset/WooCommerce/WooCommerce Views.

[Luo Yang]

Q4) but it does not appear that WooCommerce's templates are being used

If are using the Layout to design the archive page, that means Layouts plugin will take over the content area of archive page, so you will need to design the items of result from scratch,
https://toolset.com/documentation/user-guides/getting-started-woocommerce-views/

the WooCommerce's default Archive Template will take effect on the archive page except the content area.

Q3 & Q5) What is the process for integrating Divi into Layouts the proper way?
It is the document I mentioned above:
https://toolset.com/documentation/recommended-themes/toolset-divi-integration/
If you need to fully integrate your theme with Layouts plugin, please check our document:
https://toolset.com/documentation/user-guides/develop-layouts-based-themes/
How to develop Layouts-based themes

Q6) It is new question, please create new thread for each new question, that will help other users to find the answers. thanks

[zacharyL]

Ok, I will open a new ticket for the Missing Product Description issue.

1. Regarding the "Use WooCommerce's Default Templates" WooCommerce Views settings, what exactly is the point of that setting if Divi takes over the Header/Footer and Toolset takes over the Content Area. What is there left for WooCommerce's default templates to display?

Here's the scenario explained where Toolset/WooCommerce becomes a time sink:

2. I want to use Toolset to design most of the site, except what Divi controls (Header/Footer).

3. WooCommerce's styles for Archive/Single are just fine out of the box, so I really don't want to have to "recreate" them in Toolset for no reason.

4. Plugins like "WooCommerce Wishlist" don't seem to be supported out of the box, and I wouldn't be surprised if there are many other plugins that suffer from this problem. The whole point of using Toolset is to be able to build a site without knowing code, but it seems that I still have to write custom code to support things like the "Add to Wishlist" button, like in your shortcode example above. This effectively makes it impossible to use many WooCommerce plugins unless you're a programmer. Am I missing something here?

Thanks for all your help.

[Luo Yang]

1) What is there left for WooCommerce's default templates to display?
WooCommerce's default templates will display the page/post except the content area.

2) I want to use Toolset to design most of the site, except what Divi controls (Header/Footer).
As I mentioned above: please follow our document to design your website.
https://toolset.com/documentation/recommended-themes/toolset-divi-integration/

3) Since you are using layouts/Views wordpress archive cell to design the content area of archive page, you will need to design the item of the view's loop. see our document:
https://toolset.com/documentation/toolset-training-course/part-2-creating-layouts-for-archives/

4) There isn't such a feature within Toolset plugins for what you are going to achieve:
Plugins like "WooCommerce Wishlist" don't seem to be supported out of the box

If you agree, we can take take it as a feature request,

[zacharyL]

Ok, I think I've wrapped my head around what all is going on now. Thanks very much for your help on this ticket.

I would like for you guys to look into why WC Wishlist doesn't seem to automatically output its "Add to Wishlist" button within the WooCommerce Views Shortcodes you already have available. I'm sure this is an issue for more people than just me. You may just be missing a WordPress Action that Wishlists is using that you should include in your Shortcodes.

Other than that, you may close this ticket if you want. Thanks.

[Luo Yang]

Yes, you are right:
WC Wishlist doesn't automatically output its "Add to Wishlist" button within the WooCommerce Views Shortcodes.

And I forward it to our supporter Beda, he manages the feature requests of Views plugin, but there isn't any ETA for it, I suggest you subscribe to our blog to get the updated news:
https://toolset.com/blog/

[zacharyL]

Thanks for reporting that. I'll keep an eye on the blog.