I do understand there's no shortcodes, but where can

I do understand there's no shortcodes, but where can I adjust the Upgrade code to control how the options for upgrade or modify?

I'm using the Elegant Themes DIVI theme builder, and the generated code for Pro Sites doesn't conform nicely, placing it outside of the theme at the bottom (as shown in attached screenshot).

I'm capable of making adjustments once I know I'm working in the right areas, but I do have a couple of suggestions to enhance ProSites frontend:
1) With little effort, ProSites display could be adjusted easily if you wrapped it in a div with a specified ID so we could apply styles to it via CSS only.
2) It wouldn't be bad to have styles applied inline, and those inline styles could be an option in the ProSites settings.

  • brandon_dennis

    Okay, I should have delved into this a little more as I did find that the page is wrapped in a DIV "psts-checkout-output".

    However, with the Divi page builder, it wraps the psts-checkout-output before the Divi layout styles, which is where it causes an issue in my theme display. If the div could be just around the actual content instead of the whole page's content it would be more compatible with themes.

    As it is, my only option appears to be going through each option on the checkout page code in the plugin and adding a specific div ID so I can control that single block - but it's a bad practice since the next update would wipeout those changes.

  • Patrick

    Hey there @brandon_dennis

    I hope you are well today!

    Yep, I see what you mean. As soon as any content is added to the page using the Page Builder, the layout is thrown out of whack.

    That is likely due to a similar cause as detailed in this post where we were debugging a similar issue in another theme:

    So, the way around it for now is to simply add any custom content you want using the default WordPress editor instead of the Page Builder in Divi. It works just fine (screenshot)

    A new version of Pro Sites is in the works with better customization & layout options for the checkout page. We cannot provide any ETA for release yet though, sorry.

  • brandon_dennis

    Thanks for both of your time and info, Vaughan and Patrick! It's much appreciated and I continue to be amazed by the quality support provided here.

    I agree with you, Patrick, and have adjusted the layout of the Pro Site page using the default editor so as not to edit plugins or static files in case of future update conflicts.

    There are still some areas that this isn't a perfect solution - Divi's theme provides full-width sections for headers I'm using on other sites, and even if I use HTML in the default editor to mimic this consistency, it breaks the alignment of the ProSites checkout, etc.

    It's not even practical to edit this without code changes because if I attempt to end the content with an ID-specific div, I can only close that in the global headers. Anyway, in the big scheme of things, it's a minor issue that competent designers should be able to overcome, but I did want to mention my real-world experience and possibly easy solutions for the future.


Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.