Navigation Bar connected to content

I am making a nextcloud app and don’t know, how i can combine the navigation elements with the content elements. I used the generated app-skeleton from nextcloud.

Maybe somebody can help me out here :slight_smile:

I suspect you are talking about a custom Vue frontend?

What exactly are you trying to integrate? The top row with the list of apps is out of your direct control.

No not a vue App, my template looks like this:

style('bsissue', 'style');

<!DOCTYPE html><html>
		<meta http-equiv="content-type" content="text/html; charset=utf-8">

<div id="app-navigation">
		<?php print_unescaped($this->inc('navigation/index')); ?>
<div id="app-content">
		<?php print_unescaped($this->inc('content/index')); ?>

But I want to change the app-content, if i click on something in my navigation bar

So, you are building a multi-page application, am I right?

You will have to create individual templates for all views and register them with various routes. Then, you can link to these routes in the dynamically generated (in PHP) pages.

I can give you an example of an app that used a MPA in the past: The cookbook app used a PHP-only solution but migrated to Vue in the meantime. You can browse the history of the app to get some inspirations.

Another point that I was a bit surprised: It seems strange to have the <html> and <head> tags in the template. I suspect this will result in a broken HTML code delivered to the user.
You might want to manually check the HTML output to be sure.

yes that helped a lot, now I could connect it correctly.
Thank you very much :slight_smile:

1 Like