Articles on: Advanced Topics

Using Chamevo with Page Builder Plugins

If you’re customizing your WooCommerce product pages with page builder plugins like Elementor, the default WooCommerce hooks used by Chamevo are not accessible. Instead, you’ll need to place Chamevo manually using a shortcode.



1. Insert the Chamevo Shortcode


  • Use the shortcode:


[chamevo]


  • Add this shortcode in a Text widget or the appropriate block within your page builder layout.
  • This determines where the product designer will appear on your custom product page.




2. Configure Lightbox Display (Optional)


If you’d prefer the product designer to open in a lightbox instead of being embedded directly:


  1. From your WordPress dashboard go to Chamevo → Settings → General (Display)
  2. Locate Open Product Designer in…
  3. Select Lightbox (only working with sidebar layout) from the dropdown.
  4. Click Save Changes





Now, when customers click the customize button, the product designer will open in a lightbox for a cleaner experience.


3. Adjust WooCommerce Display Settings


From your WordPress dashboard:


  1. Go to Chamevo → Settings → WooCommerce → Product Page.
  2. Set Product Designer Position (e.g., Replace Product Image).
  3. Set Customization Button Position (e.g., After Short Description).
  4. Click Save Changes.





This ensures that the designer or customization button shows up in the correct spot when using Elementor or other page builders.With this setup, Chamevo integrates smoothly into any custom product page built with Elementor (or similar page builders).

Updated on: 01/12/2025

Was this article helpful?

Share your feedback

Cancel

Thank you!