Navigation Bar connected to content

💻 Development app dev
1

Hello,
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:

2

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.

3

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

 <?php
style('bsissue', 'style');
?>

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

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

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

4

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.

5

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

1 Like