0

I need to upload to an Amazon S3 bucket a website that has over 50 pages, and on each of them there is a navigation bar at the top that is inserted using php. But Amazon S3 bucket does not support php and I need to re-do the navigation bar with just Javascript. I made dropdown menus with Javascript that work fine on a single page.
But I would like to have a single file containing the dropdown menus, that is inserted in all the 50 pages, so that if I need to edit something I do it only once instead of 50 times.

I know how to insert some content in multiple pages using Javascript (I have used one of the answers to this post )

But this does not work if the content I insert is html code that is used to produce the dropdown menus that work with Javascript.

So my question is, is there a way to do such a thing with only Javascript, so that it will work on the Amazon S3 bucket?

Valerio
  • 189
  • 10
  • 2
    Your question is unclear. It is impossible to answer to it. You can include any javascript file you want, obviously. So what keeps you from loading the same menu creating script into each of those static html files and have it create that menu? – arkascha Jul 25 '23 at 17:35
  • Why not just use a hosting environment which supports php?? – ADyson Jul 25 '23 at 18:00
  • sorry if I am slow...I am very amateur as a programmer. My problem is this: there are two chunks of code. One is the html code that makes the list with the content of the dropdown menu, and using with various "class" and "id" inside. The other @arkasha is the javascript code that uses the the "class" and "id" to generate the actual functionality (clicking opens the menu, etc) and that I place at the end of the html file inside a tag. How do I include both chunks of code on every html page? with a single js file? – Valerio Jul 26 '23 at 03:52

2 Answers2

1

If you can't use PHP on S3 and you MUST put the website there, then a front-end framework like React might be the way to go. Make the navigation menu a React component, then it becomes easy to include it on every page. Otherwise, put the website somewhere else.

1

Let's say you've added the same script to every HTML file in your bucket:

<script src="jquery-1.6.1.js"></script>
<script src="MY_FILE.js"></script>

Now, in this custom JS file, you can add the following:

var $ = jQuery;
$(document).ready(function() { ...your code here... }

Using the above, you can insert your dropdown menu using whatever method you choose.

paul
  • 96
  • 4