What next http/3 By @osgood_   HTTP/3 is the most current protocol. An important difference in HTTP/3 is that it runs on QUIC, a new transport protocol. QUIC is designed for mobile-heavy Internet usage in which people carry smartphones that constantly switch from one network to another as they move about their day. This was not the case when the first Internet protocols were developed: devices were less portable and did not switch networks very often.   An important development for today's clients.   What is next? AI     By @BenPleysier   l understand the need for progression in certain sectors, obviously live streaming, for instance, is intensive and requires more application but lm not really addressing that as its not something l do or am familiar with. I still use a 'field" phone with a 3 foot ariel, I'm sure you're old enough to remember those. All lm saying is most websites, given the developer streamlines their code probably do not require the atom bomb approach. Going back to the original suggestion and comment regarding including additional http  calls, I would use that approach as l wouldnt have an excessive amount of http calls anyway, regardless of http 1 or http 2. However if l was producing a WordPress website then that may need http 2 given the usual 20 plus http requests, but is that just poor workmanship or an 'accepted' casualty of more developers relying on  bloated external widgets. ... View more

The problem is all relative. Much of what is happening today is not based on building small to medium company websites, which are the majority of projects, but those companies which "control' the web and influence just about everything to do with it. Particularly problematical for those web developers that are new or just plain naive. We have small groups of web developers doing their own thing, voicing their own opinions, each group are largely blinkered to anything else, making it more and more difficult to agree on anything about when to use this approach or that approach, it's now largely use an atom bomb approach for everything rather than a carefully considered approach.   What next http/3 when http/2 is abused so much that its no longer fast enough. http/1 was always fast enough for the majority and was never a problem until poor developers started overloading their pages with redundant code mostly as a result of frameworks and third party widgets which will always contain bloat. ... View more

I get your point about additional http requests but that's the modern way isn't it? According to gen Z web developers the more links to various scripts, cdns/local included on every page, even if they are not required for that page, the better is what lm currently witnessing.......so yes, whilst this should not be, it's obviously not a huge concern. By @osgood_   Not just Gen Z. It is what it is when the HTTP server is version 2 or higher. Please read up on it so that you can convey the correct message yourself. By @BenPleysier   I was referring to gen z as its those mostly who seem to enjoy over complicating web development by following ridiculous workflows used by multi billion dollar companies. For sure there are going to be a percentage of "grandad" web developers whose ability to think for themselves has long since faded who will follow trends. ... View more

I get your point about additional http requests but that's the modern way isn't it? According to gen Z web developers the more links to various scripts, cdns/local included on every page, even if they are not required for that page, the better is what lm currently witnessing.......so yes, whilst this should not be, it's obviously not a huge concern.   @L e n a wrote:    ......and it's not awkward to use this DW proprietary feature since @edinav24550678 already uses TEMPLATE, which is itself DW    2 wrongs don't make a right in my opinion. ... View more

  Please do what @BenPleysier suggested and add the Google Analytics 4 code just above the closing </body> tag of your main Template.dwt file.    By @Nancy OShea   Ben didn't suggest it, Lena did. The bloody big 'thumbs up' emoji is rather eye catching though! ... View more

If you're using several different templates, depending on the sections of your site, and since you're already using a proprietary aspect of DW, I'd advise you to use a LIBRARY element instead, which you'll then insert into each TEMPLATE.    By @L e n a   I'm probably missing something here but why not ditch the proprietary DW library item and just use a script tag:   <script src="google_ analytics.js"></script>   If you link that to every page in which you want the GA  code snippet to appear you then only have to update the google_analytics.js file, if needed. However I can't see it would need updating too frequently.....do Google regularly update it? I can't remember ever needing to update the scripts on any website on which I included the GA code. For sure they had a recent big update, I think, but prior to that I don't think anything changed, that I know of anyway, not that I paid too much attention to that side of things as none of my clients could ever be bothered to analyse their data.   I dont like proprietary solutions myself when not strictly necessary as they lock you into a workflow which can't be shared with other editors very easily. Given that DW is not currently being actively developed  I would not be advising anyone to lock themselves into a padlocked box just in case they need a quick escape route. ... View more

It’s almost done! http://www.maximum-robot.co.uk/radio.html However, I’ve got two problems that I can’t figure out. As you can see, I’ve put a roll over image on all the station names and as you can also see, because I want the same thing “Mearns FM” in two places it doesn’t work! When you hover over the top image it rolls over the other one! Does anyone know how to fix this?   By @Gareth_Williams   Duplicate the MearnsFM_3.jpg rollover image and name it something else, like: MearnsFM_3_duplicate.jpg and use that for one of the rollover replacements.         The other thing is, for reasons I can’t understand, the link on “Nocturnal Frequency” includes a direction to the root folder on my computer or our website when I upload it. This is not in the code or the properties panel! Does anyone know what is happening here? Thanks again for your help. By @Gareth_Williams   Add https:// to the start of the external link: https://www.youtube.com/user/NocturnalFrequency1 ... View more

Hi Osgoog,   It's difficult to compete with free, and much of the internet is this way. Free email, searches, videos, music, WordPress themes, etc. It's becoming more and more difficult to convince individuals or a small business that spending extra money on developing a website is worth the money. And it will only get worse, not better. I think the best opportunties exist with/working for large, profitable companies, e.g., banks, insurance firms, hospitals, law firms, etc., managing their websites and online marketing, not building sites for private businesses.   By @Fun Seeker   I could not agree more, sounds like l could have written that reply myself. You either have to be very very good or very very bad to make any money from web development these days, in my opinion. Those in between like myself can't compete. For me it doesn't matter, l had 20 plus years of satisfaction and excitement. I can sit back now and watch it all unfold from a comfortable distance. I still take an interest in what's happening of course,  its difficult after so much investment in terms of time, to just walk away, for now that is. Hopefully lm still capable of giving back something to those who are less knowledgable and occasionally need some help.   I still purchase PVII's widgets every now and then. They're so damn good! They haven't developed anything new in a long time, and given the situation, it's not surprising. It makes no sense to divert time and resources into a program with a limited shelflife.  Thanks. By @Fun Seeker   I've never used a PVII extention BUT I do know both Al and Gerry were/are fully committed to producing the best and providing an excellent after sales experience. Sadly Al is no longer with us and with  DW no longer in active development , only bug and OS updates, hasn't exactly helped.   Time waits for no one, things move on, there's always someone else or something else on the horizon which is going to eventually "rain on your parade'. ... View more

The main container which holds all the page content "floats" on a pattened bacground of the page 'body'. The sidebar when not deployed butts up against the edge of the  container. Since the container is not at the edge of the screen there's a small gap where the sidebar's color is visible. Like I say, this is reminiscent of a design feature of the 2013 site, so I'm not complaining.  By @JoyceOdell     Right, the side bar should not really be inside the main container, it should sit outside of it in the <body> </body> container as its designed to work independently of everything else on the page by having a position of fixed.   If you want it to disappear completely and dont want to move the code then try amending the css to -120%:   .mainNav { position: fixed; height: 100%; top: 0; width: 30%; padding: 100px 0; background-color: #262626; transform: translateX(-120%); transition: transform 500ms ease-in-out; overflow: auto; }   ... View more

I use the program for my own projects and to help friends, not for professional purposes. With all the social media websites and WordPress themes, I don't see professional website design as a viable path, unless you specialize in high-end back-end coding/programming, which I don't.   By @Fun Seeker    Very wise words. It's about as tough now than it has ever been to get into web development at a professional level. I would not bother if l was starting over again, fortunately l"m not. It was fun while it lasted.   @Fun Seeker wrote:   If the coding is correct, I suspect that CSS variables will work when the files are uploaded onto the server. This is the first and only bump in the road. For everything else, Dreamweaver works just fine and is a pleasure to work with. I have a slew of Project Seven plugins/widgets, which I love and use on every project. I feel bad for them. Adobe's decision to abandon Dreamweaver pulled the rug out from under them.   The css variables will work without any issues regardless of if DW flags them up as errors.   PVII are still going as far as l know but must have been impacted somewhat  by Adobe's decision to discontinue DWs active development. DMX Zone, another DW extension developer, looked into the crystal ball and built their own editor. ... View more

OK, thanks. We're nearing the end, aren't we? By @Fun Seeker   We've been nearing the end for a few years now. I guess it's a case of when to jump ship before it sinks, taking you with it. By that l mean if its starting to impact on you personally as a professional  web developer because it lacks certain features that other editors, which are still being actively developed, feature it's time to consider your position. On the other hand if its not impacting on your ability to get the job done and you don't consider yourself a professional then there's no reason to panic. DW even when Adobe call end of life is likely to be usable for a few more years if you don't regularly update your OS. ... View more

  Thank you again for all of your help! I'll post again once the site goes up. By @JoyceOdell   No problem. There is no reason why the sidebar should not be completely off canvas if you implement it correctly.  ... View more

The current version of Xampp you are using, presumably you downloaded it recently is using php v7 or v8. The database connection and query code created in your Dreamweaver application by the default server behaviours is not compatible as the code uses mysql to connect/query which is why youre getting error feedback. Dreamweaver alone no longer has a way to use more up-to-date connection/querying such as mysqli or pdo.    You either need to purchase an extention for Dreamweaver from a 3rd party vendor which will give you some basic functionality to connect/query your database or write the code yourself. There are plenty of examples on YouTube which will walk you through the process. It's fairly simple enough if you have a few spare hours to allocate., you get to learn something in the process as we'll, rather than just using a pick and select extention, plus you save some money too, all is positive. ... View more

Well, the provisionary vertdict is that this is going to work. It turns out that the "breakable" behavior that I was concerned about only exists inside of Dreamweaver. The sidebare flashes but doesn't stay open, which makes editing its content a bit like flying blind. In a browser preview, however, everything works fine. By @JoyceOdell   I imagined that might be the case. I forget how DW renders pages in design view, live view etc as I dont use it any longer - you should always test in a real browser to see the results.   A tip for you whilst editing: Change transform: translateX(-100%); to transform: translateX(0); That should make the div visible. .mainNav { position: fixed; height: 100%; top: 0; width: 30%; padding: 100px 0; background-color: #262626; transform: translateX(-100%); transition: transform 500ms ease-in-out; overflow: auto; }   You should not really lose any font awesome icon if the library link is correctly attached to the page. If you can get that to work it has a hamburger icon you could use in place of those 3 lines in the navIcon <div>.   <i class="fa-solid fa-bars"></i>    However try this initially - Add the class of 'bar' to the 3 divs inside the navIcon <div>:     <div class="navIcon"> <div class="bar"></div> <div class="bar"></div> <div class="bar"></div> </div>   Then add the below css to your stylesheet:   .navIcon .bar { height: 1px; margin: 3px 0; background-color: #fff!important; }   Obviously get rid of the original css which styles those bars:   .navIcon div { height: 1px; margin: 3px 0; background-color: #fff; }   See if that helps. ... View more

I'd go along with the response from Jon. Get the text translated into their respective languages by a proper human translator (not some online translator because they usually only do a hack job) then use a database to store the languages. At the click of a button or change of a drop down menu you can then call the appropriate language from the database. Unfortunately if you have never worked with dynamic content and databases this might be out of your comfort zone.   Alternately if databases sound a bit scary you could store the languages for each page in a javascript array of objects and again once a button or drop down selection is chosen you can populate the page with the appropriate language. ... View more

"I did it my way ' comes to mind, which is fine because you feel comfortable in doing that and thats what we all did at some stage in our learning journey. There are more streamlined ways, like using server side include files for the navigation where by you would just update the one file and that file would be consumed into the pages that adopt it. However its most likely going to fall outside of your present comfort zone and knowledge for the time being.........so continue doing what you are doing and see if it satisfies your needs. ... View more

I am sorry, I am originally from the Netherlands, but, unlike the boy and the dike, my finger is not big enough to stop this garbage from seeping through the firewall.   Unlike you, I have shown plenty of projects with the so-called 'proprietory scripts', that you falsely keep on harping about. If you are a proficient coder, you will be able to unlock every feature that we gratefully use in our projects.   That is all I am going to say to you on this subject.   By @BenPleysier   The only dubious responses l see are coming from yourself, more so recently..........maybe as a result of age. I apologise for having to say this because its uncomfortable for me to do so but I cant think of many professions in which an 80+ year old would still be employed and taken seriously. I mean lm beginning to doubt myself at 65. Again lm sorry l have to bring age into it but it becomes relevant when you keep on denying factual evidence and sensible reasoning.    Again l don't see what is false about mentioning niche propriety scripts which are unavailable to the majority. Think about it carefully, not even an experienced coder is likely to be able to quickly understand  niche workflows, it takes time to begin to understand the "unconventional'. I understand from reading posts in the Wappler forum that the team  has been reduced from 5 to 3 again. l wonder why. Maybe the recent recruits, if they were sourced from a conventional coding background could not adapt to a "foreign" workflow.quick enough to contribute positively. I don't know of course but it seems strange to downsize rather than expand, there may be other genuine reasons which have since been addressed in further posts for their departure, which l have subsequently missed. It's going to obviously be problematical for anyone regardless of experience to join and hit the ground running when parachuted into unfamiliar territory. Wappler needs years of experience to fully understand its capabilities, you most likely knew more than they did, given you were an early adopter. Yet you say any conventional coder could understand it without hesitation, which l obviously disagree with.   I'll still look forward to your responses in future posts of course, you are entitled to your opinions regardless of whether l think they hold any water or not.   Oh and l"m very much looking forward to my extended trial of Wappler........lol .   ... View more

On the other hand, quite a bit of the mysterious other code in that .css file has to do with animations. So deleting it might disable the sidebar. But we'll see.  Q: is there any way to edit a post once posted, or do you just have to add corrections, like this? By @JoyceOdell   No it won't disable the sidebar as the little bit of javascript at the end of the page and the css l provided is responsible for that working correctly.   The font awesome css is a linked file from a content delivery network CDN. You dont really need to open/view that file at all. The only item on the page that's linked to the font awesome css is the down angle alongside of the top level links in the sidebar. Removing the css will result in the down angles not appearing.   As for editing posts after they have been posted  l believe you need to convince the forum management that you are a genuine nice person by posting frequently then l think you get to have certain privileges, like editing your posts. I'm not a moderator, they would have more accurate information about posting  lm sure. ... View more

  2nd half of the question; is there a way to *detach* a .css style sheet from a page or a template?  The Tools menu helps you attach a new one. But I don't see a command to allow you to get rid of one. Or does just saving one under a new name, and deleting the original get rid of the link? By @JoyceOdell   Can you just not open the file in code view and comment out or delete the link to the css file? Its a long time since I last used the DW editor so I forget how it works in cases of template (.dwt) files if that is what you are using as I think it locks you out of non-editing regions, in some instances. Have a go at tackling it in code view to see if you have editing access to remove the link. If the link is not accessible in a child page of a template you can get rid of it from its parent .dwt file. ... View more

  So far, I'm finding this solution a bit fragile. I have my work page saved, and the (blank)icon does function, in that it makes the sidebar move in or go away on a click. But if I make any further change at all, even just the color of the sidebar text, and it stops functioning until I undo it. My last couple of attempts I've needed to just close the template and re-open it to get back to the beginning.   By @JoyceOdell   That's really nothing to do with the solution. You're most likely struggling to deploy it amongst your existing code and that unless you know what you are doing can bring some teething problems.   I tend to suspect that part of this may have to do with the import of the code that you posted. It produced a new .css page with no line breaks and no returns. Just a wall of text. Even though I copied the relevant parts of the code and put them into what appeared to be the proper areas of my base template's .css file as well as into the source code page with the main design elements included.    By @JoyceOdell   I have no idea what you are doing, it's a simple case of copying and pasting and that doesnt generate new css files. All this should be executed whilst in code view.   I suspect that I need to edit that weird .css sheet and reformat it into proper groups where you can find the different elements. It seems a bit premature to start flailing about things as they stand right now.    Which brings up a seperate question. Is there a limit to how many different .css sheets a page or template should be linked to? I know that it's not limited to one, since there are things like the fancybox plug-in which comes with its own .css style sheet, too. So attaching additional style sheets isn't necessesarily a problem in itself. But conflicts between style sheets may very well be.   By @JoyceOdell   No there is no limit to how many css files you can have attached to the page. Infact these days GEN Z says the more the merrier and in your case its probably wise to isolate the off-canvas navigation css which will avoid any potential copy and pasting issues.   Yes its true that when using sources acquired from  ABC & D there could well be css conflicts. You just need to be aware and keep your eye on the ball. ... View more

  If my video does not show you the code step by step, then please excuse my negligence in not providing assistive technology.    By @BenPleysier   Does your code use specific non-open-source workflows or not? I assume it does or there would not be 'dmx-view' include in it, I think I saw. Therefore I do not have access to the Wappler specific script/s so its not only useless to me but pretty much everyone else for quick evaluation/testing purposes as the code is not available to use as its a video (I would have to type all the code out just to decide if its any use or not) nor is the script/s available that are needed, absolutely pointless! Maybe consider git-hubbing it and providing a link, you have an account......oh no you cant as its not open source!     You could entertain yourself with a 14 day free version. This should give you plenty of time to follow my 7 minute long video. You will then discover that there are no licensing issues, a fact that I have told you umpteen times and you still keep ruminating your own ill-advised view.   Better still, follow along using Dreamweaver and version 5.3 of Bootstrap. The visible code can be used; the SSI may need to be adjusted to suit the server model. I haved used NodeJS By @BenPleysier   Right and when you post another video in 15 days time and  I want to evaluate I assume the people at Wappler will extend the trial. Please let them know - I'm sure they will be thrilled to know its me you're giving away an extended trial to......as if, come on be sensible please, it just doesnt work does it.   If there are no licencing issues then why arent you free to post the complete code here or on your github page or is this solution so chaotic that its unlikely that anyone here is ever going to use it. I mean come on who  in this forum is going to be using node js and ejs?    I for one can't remember too many posts, if any, enquiring about that workflow.       Please do not drown when you are doing your deep diving. Either way, I could not care two hoots about your conclusion, it is going to be rubbish as usual.   By @BenPleysier   Blinkered view. Not much of a surprise to me.     Interestingly, you still keep up with our community (the one that you claim, removes posts that are critical of the product) to be able to incorrectly cite the problems with documentation. Did you notice that most of these problems are posted by ex-Bubblers. You will see no complaints from ex-Dreamweavers, we are used to a perceived  'lack of documentation'.     By @BenPleysier   Actually quite a few of those that have been using the application since day 1 arent happy with the documentation, not just those who have recently discovered it. Some people if they have come from a well documented application might well expect more, or is that a crime to do so?      ... View more

Maybe I should put the style="white-space: nowrap" code on the first column as well? Anyway, I will try that tomorrow! Thanks again. By @Gareth_Williams   Thats where the image goes, right? But you could do that, whatever is longer, the text in that first column, or the image will determine the width of the cell. ... View more

It almost worked! The middle column with the three rows fits the text content as intended but the third column takes all the rest of the space, shoving the first column to as small as it can go and therefor ignoring the width value of the first column! http://www.maximum-robot.co.uk/LayOut6.html By @Gareth_Williams   It will only work assuming you have the image present in the first column. If there is no image then yes that 3rd column will try and consume as much space as it can get, its very greedy! ... View more

Bookmarks in a web editor allow you to move around the code easier, whilst in code view. You can bookmark a spot in the code or side gutter with an icon, give the bookmark a name/description and then select it from a dedicated bookmark panel in the editor, which will jump you to the exact spot designated by the bookmark in the code. Many editors have this facility but DW probably doesn't, otherwise I would assume it would be a well known feature to those who use the application frequently. ... View more

Right now, getting the internal lines back into the navIcon seems to be the most pressing issue. Have you any sufggestions as to what may be going on, there?   By @JoyceOdell   Without seeing your code I cant tell, no-one can. If you're prepared to upload your page and share a link I'm sure one of us can provide further suggestions. ... View more

  Inexperienced site owners often don't know what questions to ask. If they did, they never would have used FRAMES.   By @Nancy OShea   Well it's pretty clear to me what they were asking, regardless of experience or no experience. They certainly were not asking how they could have the same navigation on each page, without having to code it each time.     I can think of only one reason for embracing a FRAMED website and that's for consistency.  The idea of having the same sitewide navigation, header & footer surrounded by unique content seemed like a good idea at the time.  But as we learned later, it came at considerable penalty to site owners & visitors alike.    Fast forward to 2024, Server-side Includes achieve roughly the same advantages without the penalties of FRAMES.   I think it's a good option, whether or not the OP asked for it.   By @Nancy OShea   Well another good reason (for some) is to negate a page refresh each time a link is clicked although these days given the speed of the internet in most 'civil' areas I personally don't find it a deal breaker and to be honest it's a lot more stable and simpler than any of these newer techniques that are being used by GEN Z only to find somewhere down the line they don't work quite as well as expected and end up having to use a framework ontop of a framework ontop of a framework, thats if one has been invented yet to solve the potential issues. In my view you can't beat tried and tested - stick with the multiple page applications and you can't go far wrong. Less headaches = less frameworks, in my opinion.   Plus theres a lot more to this than meets the eye, it's not just about including the content by way of an include file or any other means, there are other issues to consider, which may or may not be a deal breaker.   Any way the OP says they may consider using php to solve the issue, well I hope they are going to use ajax to soften the page transitions, given they were asking about framesets......hummmmm   ... View more

  So, back to the original question. I am to assume that there is no way that plain .css will enable me to create an openable and closable sidebar? By @JoyceOdell   Wrong - sort of. I expect it can be done with plain css but usually it's done with a bit of javascript too! Might not be exactly what you want but copy the code below and insert it into a new Dreamweaver document, view in a browser, click onto the burger icon then 'Link 4' - its scrollable, however many links you include:     <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Off Canvas Sidebar Navigation</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"> <style> * { box-sizing: border-box; } body { font-family: helvetica, sans-serif; margin: 0; } header { display: flex; background-color: #000; justify-content: space-between; align-items: center; padding: 15px 30px; position: fixed; width: 100%; top: 0; } .siteName h2 { margin: 0; padding: 0; color: #fff; } .navIcon { display: flex; flex-direction: column; border: 1px solid #fff; border-radius: 6px; width: 40px; padding: 5px 8px; cursor: pointer; } .navIcon div { height: 1px; margin: 3px 0; background-color: #fff; } .mainNav { position: fixed; height: 100%; top: 0; width: 30%; padding: 100px 0; background-color: #262626; transform: translateX(-100%); transition: transform 500ms ease-in-out; overflow: auto; } .mainNav h3 { font-size: 30px; margin: 0 0 25px 100px; padding: 0; color: #fff; } .mainNav ul { list-style: none; margin: 0; padding: 0; } .mainNav li { list-style: none; margin: 15px 0; padding: 0; } .mainNav.slideInOut { transform: translateX(0) } .mainNav > ul { background-color: #262626; padding: 0 50px 0 100px; } .mainNav a { text-decoration: none; color: #fff; font-size: 20px; margin: 0; padding: 0; } .mainNav a:hover { color: #737373; } .topLevelLink { display: flex; justify-content: space-between; } .subLevelLinks { margin: 0 0 0 20px!important; padding: 0; display: none; } .currentLink { color: #e68a00!important; } .mainContent { width: 90%; margin: 100px auto 0 auto; } .fa-arrow-right { color: #fff!important; } </style> </head> <body> <header> <div class="siteName"><h2>SomeSite</h2></div> <div class="navIcon"> <div></div> <div></div> <div></div> </div> </header> <nav class="mainNav"> <h3>Contents</h3> <ul> <li><a href="#" class="topLevelLink"><span>Link 1</span><i class="fa-solid fa-angle-down"></i></a> <ul class="subLevelLinks"> <li><a href="#"> SubLink 1.1</a><li> <li><a href="#"> SubLink 1.2</a><li> <li><a href="#"> SubLink 1.3</a><li> <li><a href="#"> SubLink 1.4</a><li> <li><a href="#"> SubLink 1.5</a><li> </ul> </li> <li><a href="#" class="topLevelLink"><span>Link 2</span><i class="fa-solid fa-angle-down"></i></a> <ul class="subLevelLinks"> <li><a href="#"> SubLink 2.1</a><li> <li><a href="#"> SubLink 2.2</a><li> <li><a href="#"> SubLink 2.3</a><li> <li><a href="#"> SubLink 2.4</a><li> <li><a href="#"> SubLink 2.5</a><li> </ul> </li> <li><a href="#" class="topLevelLink"><span>Link 3</span><i class="fa-solid fa-angle-down"></i></a> <ul class="subLevelLinks"> <li><a href="#"> SubLink 3.1</a><li> <li><a href="#"> SubLink 3.2</a><li> <li><a href="#"> SubLink 3.3</a><li> <li><a href="#"> SubLink 3.4</a><li> <li><a href="#"> SubLink 3.5</a><li> </ul> </li> <li><a href="#" class="topLevelLink"><span>Link 4</span><i class="fa-solid fa-angle-down"></i></a> <ul class="subLevelLinks"> <li><a href="#"> SubLink 4.1</a><li> <li><a href="#"> SubLink 4.2</a><li> <li><a href="#"> SubLink 4.3</a><li> <li><a href="#"> SubLink 4.4</a><li> <li><a href="#"> SubLink 4.5</a><li> <li><a href="#"> SubLink 4.6</a><li> <li><a href="#"> SubLink 4.7</a><li> <li><a href="#"> SubLink 4.8</a><li> <li><a href="#"> SubLink 4.9</a><li> <li><a href="#"> SubLink 4.10</a><li> <li><a href="#"> SubLink 4.11</a><li> <li><a href="#"> SubLink 4.12</a><li> <li><a href="#"> SubLink 4.13</a><li> <li><a href="#"> SubLink 4.14</a><li> <li><a href="#"> SubLink 4.15</a><li> <li><a href="#"> SubLink 4.16</a><li> <li><a href="#"> SubLink 4.17</a><li> <li><a href="#"> SubLink 4.18</a><li> <li><a href="#"> SubLink 4.19</a><li> <li><a href="#"> SubLink 4.20</a><li> <li><a href="#"> SubLink 4.21</a><li> <li><a href="#"> SubLink 4.22</a><li> <li><a href="#"> SubLink 4.23</a><li> <li><a href="#"> SubLink 4.24</a><li> <li><a href="#"> SubLink 4.25</a><li> </ul> </li> <li><a href="#" class="topLevelLink"><span>Link 5</span><i class="fa-solid fa-angle-down"></i></a> <ul class="subLevelLinks"> <li><a href="#"> SubLink 5.1</a><li> <li><a href="#"> SubLink 5.2</a><li> <li><a href="#"> SubLink 5.3</a><li> <li><a href="#"> SubLink 5.4</a><li> <li><a href="#"> SubLink 5.5</a><li> </ul> </li> <li><a href="#" class="topLevelLink"><span>Link 6</span><i class="fa-solid fa-angle-down"></i></a> <ul class="subLevelLinks"> <li><a href="#"> SubLink 6.1</a><li> <li><a href="#"> SubLink 6.2</a><li> <li><a href="#"> SubLink 6.3</a><li> <li><a href="#"> SubLink 6.4</a><li> <li><a href="#"> SubLink 6.5</a><li> </ul> </li> <li><a href="#" class="topLevelLink"><span>Link 7</span><i class="fa-solid fa-angle-down"></i></a> <ul class="subLevelLinks"> <li><a href="#"> SubLink 7.1</a><li> <li><a href="#"> SubLink 7.2</a><li> <li><a href="#"> SubLink 7.3</a><li> <li><a href="#"> SubLink 7.4</a><li> <li><a href="#"> SubLink 7.5</a><li> </ul> </li> </ul> </nav> <main class="mainContent"> <p>Main Content</p> <p>Main Content</p> <p>Main Content</p> <p>Main Content</p> <p>Main Content</p> <p>Main Content</p> <p>Main Content</p> <p>Main Content</p> <p>Main Content</p> <p>Main Content</p> </main> <script> const mainNav = document.querySelector('.mainNav'); const navIcon = document.querySelector('.navIcon'); navIcon.onclick = function() { mainNav.classList.toggle('slideInOut') } let topLevelLink = document.querySelectorAll('.topLevelLink'); const subLevelLinks = document.querySelectorAll('.subLevelLinks'); topLevelLink.forEach(function(topLevelLink, index) { topLevelLink.onclick = function() { topLevelLink = document.querySelectorAll('.topLevelLink'); topLevelLink.forEach(function(topLevelLink) { topLevelLink.classList.remove('currentLink') }) this.classList.add('currentLink') if(subLevelLinks[index]) { subLevelLinks.forEach(function(subLevelLink) { subLevelLink.style.display = "none"; }) subLevelLinks[index].style.display = "block"; } } }) </script> </body> </html>             ... View more

What l need to evaluate the whole process is access to the complete code, not just bits of it. That l guess is not possible because of licensing issues when posting non open source solutions, which really makes the whole thing irrelevant and pointless in determining if the solution is any good or not. I need to go through a deeper dive to come to my own conclusions. It's like showing us a picture of a cake you're eating and informing us it tastes great, in your opinion.   If this thing is so great then get it out there because to me it looks like it could be struggling to maintain a user base due to poor documentation, thats not me saying that, it's those who are using it.......well yeah l can understand why as l said the best kept secret no one is using because they don't know how and are giving up.........hummmm   Your posting is not realistic for the majority, l would go so far to say all, in this forum to deploy or test. ... View more

I'm not sure where SSI or Ben's off canvas navigation fit in.  By @osgood_   I guess that a bit of handholding never hurt anyone. So here goes.   This is the layout page that has a section that imports the content from the content pages. The layout page does not get refreshed, the content is dynamic. No this is not a SPA. It does make use of SSI using NodeJS/Express (JavaScript)     This is as close as you can get to imitating the frameset, using modern methods.   The only way l know is to either load the content or create a single page application By @osgood_   Time to catch up!   By @BenPleysier   To me that is a 'single page application' - more or less what you can do in React or Vue using the router library. You call it SSI, I don't, although coming from a Wappler background might be confusing the issue for you as that bit of software is somewhat prone to its own interpretation of just about everything. It's NOT going to help the OP is it as it is obviously using some Wappler based workflows - so stop continually posting niche solutions which have no relevance to what the OP can achieve using software outside that particular program.    Or at least post a working code sample here so everyone can evaluate it and use it, are you actually allowed to do that since the components/scripts used are not open source? It's like the best kept secret no one uses...........hmmmm.......go figure.           ... View more