peterw

Solved by Chat GTP!

Settings" >>> "Advanced" >>> "Code Injection."
In the "Footer" section, paste the JavaScript code wrapped inside the <script> tags.
Save your changes and close the Code Injection panel.
Preview or publish your site to see the underlined links in the site navigation menu.

<script>
document.addEventListener('DOMContentLoaded', function() {
  var navLinks = document.querySelectorAll('.header-nav-item a');
  for (var i = 0; i < navLinks.length; i++) {
    navLinks[i].style.textDecoration = 'underline';
  }
});
</script>
 

Add this into Code Block
<style> a.scroll-down:before { content: "Next"; position: absolute; left: 50%; transform: TranslateX(-50%) rotate(-45deg); top: -20px; margin-left: -10px; } </style>  

Add to Code Block
<div class="scroll-down"></div> <style> .scroll-down { position: absolute; left: 50%; bottom: 10px; display: block; text-align: center; font-size: 20px; z-index: 100; text-decoration: none; text-shadow: 0; width: 13px; height: 13px; border-bottom: 2px solid red; border-right: 2px solid red; z-index: 9; left: 50%; -webkit-transform: translate(-50%, 0%) rotate(45deg); -moz-transform: translate(-50%, 0%) rotate(45deg); transform: translate(-50%, 0%) rotate(45deg); -webkit-animation: fade_move_down 4s ease-in-out infinite; -moz-animation: fade_move_down 4s ease-in-out infinite; animation: fade_move_down 4s ease-in-out infinite; } /*animated scroll arrow animation*/ @-webkit-keyframes fade_move_down { 0% { -webkit-transform:translate(0,-10px) rotate(45deg); opacity: 0; } 50% { opacity: 1; } 100% { -webkit-transform:translate(0,10px) rotate(45deg); opacity: 0; } } @-moz-keyframes fade_move_down { 0% { -moz-transform:translate(0,-10px) rotate(45deg); opacity: 0; } 50% { opacity: 1; } 100% { -moz-transform:translate(0,10px) rotate(45deg); opacity: 0; } } @keyframes fade_move_down { 0% { transform:translate(0,-10px) rotate(45deg); opacity: 0; } 50% { opacity: 1; } 100% { transform:translate(0,10px) rotate(45deg); opacity: 0; } } </style>