Community

How to find and edit FoxyCart templates?

Hi, I have a situation where I need to redesign cart flow pages, but the problem is that they are not coming from within my code but are coming from FoxyCart directly. Is there a way to edit those templates ? Following is the code in my checkout template …

                {% include 'svg.inc.twig' %}
                {% import "utils.inc.twig" as utils %}
                {% embed 'checkout.inc.twig' %}
                {% endembed %}

Where do I find these files and edit them? Especially utils.inc.twig. Upon searching, came to know that .twig files are template engine files and also found utils.inc.twig on gitHub but I want to edit it and other files locally. How can I do that ?

Thanks,
Ronak

This thread talks about editing the css and inserting a text line in the output

From the discussion there it seems perhaps the tpl files are not local, meaning on your machine, but they usually are in Modx. Can you find them in your filesystem?

I can not open the above thread,it shows the site cant be reached. Is that page down ?

No its loading fine, let me know I could copy and paste the contents, but its a lot so let me know

Ok well let me try to simplify it here.

First off, in your file system (in Modx manager) under assets you should be able to find the files. They will be local. The dev in that thread mentions that they can sometimes be overwritten by updates, that’s the danger of editing local files, so keep a backup of the edit. However that may not be a common problem.

Second, he gives this code if you want to add text information into the form, using Twig’s embed function, “which allows you to overwrite blocks within the template without needing to make use of the complete raw template”, that might be as function to look into as far as other changes:

As an example of adding in the additional text line you described, that would look like this - with the first and last embed lines appearing within the default checkout template already, so you’d replace those with this:

{% embed 'checkout.inc.twig' %}{% block login_register %}{{ parent() }}<p class="spam-note">Enter email to receive your receipt. No spam ever.</p>{% endblock %}{% endembed %}

After doing that, you’ll see the text appear right below the login section of the checkout. You can then add styles to your checkout to make that look exactly as you want.

Then, for css changes, he mentions using the right selectors to get around default styles:

The issue you'll be running into there is the CSS style specificity. While your styles will be present, the default styles will be overwriting them. Try specifying your selector as `#fc .fc-password-action--guest .fc-password-action--button-container .fc-button-link { }`


That will both ensure your styles are more specific, and only apply to the "proceed as a guest" link.

Again, these files should be local, and there is some danger of occasional overwrites.