Navigation to Collections not working on Translated Spanish page using Shopify Translate and Adapt

[teamgazelletay]

I've been attempting to resolve this on my end but I haven't seen anyone else have this issue on the forums and Shopify Support wasn't able to provide any solutions.

Our website: https://teamgazelle.com/

Our translated website using Shopify Translate and Adapt: https://teamgazelle.com/es 

I can navigate to pages in the footer and header but using our Find Your Team feature won't work at all on the translated page. 

If there was a way for me to at least view and compare the code between the two pages ? 

Any help would be greatly appreciated!

[rajweb]

Hey @teamgazelletay ,

Based on the issue you've described, it seems that the "Find Your Team" feature might not be working correctly on the translated version due to either script incompatibilities or untranslated code/configurations.

To investigate and resolve this issue, I'll need to:

1. Review the code used on both the primary and translated versions of the feature.
2. Test the functionality in a staging environment to identify any discrepancies.
3. Implement and test a fix to ensure the feature works seamlessly in all languages.

To proceed further, please contact me at [Your Email Address]. I'll be happy to assist you in resolving this issue and ensuring that your website operates as intended.

Looking forward to hearing from you.

Best Regards,

Rajat Sharma

[teamgazelletay]

I'd like to review the translated code myself. My post was primarily in request on how to find the code for the Spanish page. 

[teamgazelletay]

I've found the break in the code from the spanish page I just can't figure out where to edit this code. I need help finding the actual code editor for the translated pages beyond just the .json locales folder. I don't see the point of using this app if it makes navigation not functional 

[rajweb]

@teamgazelletay ,

The Shopify Translate and Adapt app works by modifying translations through JSON locale files, but it doesn’t directly create separate code files for each language. If your "Find Your Team" feature isn't working on the Spanish page, the issue likely stems from how the feature is implemented in the theme code or how it interacts with translations.

How to Locate and Edit the Code for Translated Pages:

1. Understand How the Feature Works

-The "Find Your Team" feature might be using JavaScript or Liquid code to generate dynamic content or navigate users.

-Translation issues typically arise if:

-URLs are hardcoded in the theme code (pointing only to the default language version).

- JavaScript fails to account for locale-specific functionality.

2. Where to Look for the Code:

- Theme Sections: Most Shopify themes use Liquid templates for dynamic features. Check these locations:

- Sections: Look for files under Sections (e.g., find-your-team.liquid or custom-section.liquid).

- Snippets: Sometimes smaller reusable code is in Snippets (e.g., team-finder.liquid).

- Assets: JavaScript files under Assets could control the feature’s behavior.

3. How to Test and Debug

- Open your Shopify admin and go to Online Store > Themes > Actions > Edit Code.

- Use the browser's developer tools (Ctrl+Shift+F / Cmd+Shift+F) to search for "Find Your Team" or specific keywords related to the feature (e.g., a heading, placeholder text, or JavaScript function name).

4. Key Areas to Edit for Translation Support

-  URLs: Check if the URLs for the "Find Your Team" functionality are hardcoded for the default language. Use the | t Liquid filter to dynamically fetch translated content.

- Locale Variables: Confirm that all text or data displayed by the feature is fetched dynamically via the .json locale files.

- JavaScript Variables: If JavaScript controls navigation, ensure it references the correct locale context by using Shopify's Shopify.locale object.

5. Preview Translated Code

-Translations do not create separate code files; instead, Liquid filters (like | t) dynamically pull content based on the active locale.

-To test:

-Set your store's language to Spanish (add ?locale=es to the URL if needed).

-Inspect the rendered HTML using the browser developer tools to trace which part of the Liquid or JavaScript code is breaking.

Would you like assistance in identifying the specific part of the code to debug? Please feel free to reach out via email so we can discuss the details, and I’ll be happy to assist further."

Let me know if you'd like to adjust it further!

Thanks

[teamgazelletay · Accepted solution]

Metafields in collections were getting translated which will break their navigation. Collection pages "test" and "true" need to be in default language despite being integrated into the translation pages. 

This is the largest issue I believe with this app. Certain integral things are not intuitive- whether there is a language switcher you can integrate (as far as I can tell theme dependent), what *should* be translated and what *should not* be- like the metafields that won't change regardless of language (brand color and as previously mentioned- test/ true statements for collections).