Heredé este código en un sitio de Shopify. Trasladándolo y parte del código relacionado a un nuevo tema basado en Dawn. No crea que el tema es el problema en absoluto, sino que este código que ahora activa un "$" no es un error de función. Aquí hay un ejemplo de ese código:
$('.section__choose-texture').on('click', '.content', function ( ){ var current = $(this); $('.content').removeClass('active'); current.addClass('active'); $('#prodTextureItem').val(current.data('texture')); $('#productTexture').text(current.find('h3').text()); $('.section__choose-coffee').show(); var header_height = $('.site-header').height(), offset_top = $('.section__choose-coffee').offset().top, res = offset_top - header_height; $('html, body').animate({ scrollTop: res }, 'slow'); });Agregué una "función stepOne () {" en la parte superior y luego la cerré con un } seguido de una llamada a la función, pero el editor de Shopify dice que es un código incorrecto. Creo que eso se debe a que la función aparece en la línea uno de mi ejemplo.
Entonces, ¿cómo puedo hacer que esta función funcione correctamente? ¿Es necesario reescribir el código por completo? ¿O estaba en el camino correcto con mi idea?
La función $ no está integrada en JavaScript.
Proviene de la biblioteca jQuery .
Agregue esta etiqueta de secuencia de comandos antes de su secuencia de comandos para importarla:
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>Para usar la instrucción $, debe agregar archivos jquery o hacer referencia al proyecto.
<script src="jquery.js"></script> <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>