Ingest code in the header

I want to ingest code in the header, a language selection, but it is not visible in the page. It seems to be hidden under the header, under the Theme or some other element in the page.

I know that you have your own language selector mechanism, but it doesn't fit my interests.

The code I am trying to ingest is:

<!-- Add CSS to style the select element. You can customize the styling to fit your website's design:

css. This I added to the Custom CSS part. -->

#language-select { border: none; font-size: 16px; background-color: transparent; color: #fff; text-transform: uppercase; cursor: pointer; }

<!-- Add JavaScript to handle the language switch. You can use an event listener to detect when the user selects a different language and update the page accordingly. Here's an example using jQuery:

javascript -->

<script>

    $('#language-select').on('change', function() {

        var path = window.location.pathname;

        var page = path.split("/").pop();

        console.log( page );

        var language = $(this).val();

        window.location.href = '/' + language + '/' + page;

    });

</script>

<!-- In this example, the language code is appended to the URL of the current page. You'll need to adjust this code to match the URL structure of your website.

Finally, add the language switcher to your HTML header: -->

         <select id="language-select">

          <option value="en">English</option>

          <option value="fr">Français</option>

          <option value="es">Español</option>

        </select>

<!-- That's it! With these steps, you should be able to create a simple language switcher in your HTML header. -->

Have you added this to your website as per the instructions?

I have added that code that I find somewhere to be able to add a language selection that when you select a specific language I will forward the page to /language/pagename, for instances, /pt/orders.

There is a way to inject the code in the header or footer. I did it, but the language selection element is behind the Theme, it is not visible. Probable the Theme element is overlapping my element. There should be a way to integrate my language selection element in the header. Like it happens when I enable the squarespace language selector, it appears in the right part of the header, inside the Theme.

Sorry, If I do not explain very well. Please any doubt, ask me, but imagine you are talking with someone that select squarespace , because I do not have any experience with html and css.