Index: modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/monitor/monitor.component.ts
===================================================================
--- modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/monitor/monitor.component.ts	(revision 57505)
+++ modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/monitor/monitor.component.ts	(revision 57506)
@@ -164,13 +164,13 @@
         category.subCategories.forEach(subCategory => {
           if (subCategory.alias != null && subCategory.isPublic && subCategory.isActive) {
             subItems.push(new Item(subCategory.name, (
-              '/' + this.stakeholder.alias + '/' + this.activeTopic.alias + '/' + category.alias + '/' + subCategory.alias),
+              '/monitor/' + this.stakeholder.alias + '/' + this.activeTopic.alias + '/' + category.alias + '/' + subCategory.alias),
               null, null, false));
           }
         });
         const open = this.activeCategory.alias === category.alias;
         items.push(new Item(category.name, (
-          '/' + this.stakeholder.alias + '/' + this.activeTopic.alias + '/' + category.alias),
+          '/monitor/' + this.stakeholder.alias + '/' + this.activeTopic.alias + '/' + category.alias),
           subItems, null, open));
       }
     });
@@ -225,7 +225,7 @@
   }
 
   public navigateTo(stakeholder: string, topic: string, category: string = null, subcategory: string = null) {
-    let url = '/' + stakeholder + '/' + topic + ((category) ? ('/'
+    let url = '/monitor/' + stakeholder + '/' + topic + ((category) ? ('/'
       + category) : '') + ((subcategory) ? ('/' + subcategory) : '');
     return this._router.navigate([url]);
   }
Index: modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/home/home.component.ts
===================================================================
--- modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/home/home.component.ts	(revision 57505)
+++ modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/home/home.component.ts	(revision 57506)
@@ -46,6 +46,7 @@
             this.sideBarService.setHasSidebar(true);
             this.stakeholder = stakeholder;
             this.topic = null;
+            this.title.setTitle(stakeholder.index_name);
           }
         });
       });
@@ -77,7 +78,7 @@
 
   public createTopic(element) {
     if(this.topic.name && this.topic.name !== '') {
-      this.topic.alias = this.topic.name.toLowerCase().replace(' ', '_');
+      this.topic.alias = this.topic.name.toLowerCase();
       this.stakeholder.topics.push(this.topic);
       this.close(element);
     } else {
Index: modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/topic/topic.component.html
===================================================================
--- modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/topic/topic.component.html	(nonexistent)
+++ modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/topic/topic.component.html	(revision 57506)
@@ -0,0 +1,125 @@
+<aside *ngIf="stakeholder" id="sidebar_main">
+  <div class="sidebar_main_header">
+    <div class="uk-padding-small">
+      <img class="uk-margin-bottom" *ngIf="stakeholder.logoUrl" [src]="stakeholder.logoUrl">
+      <div class="uk-text-bold">{{stakeholder.index_name}}</div>
+      <div>Admin Dashboard</div>
+    </div>
+  </div>
+  <div class="menu_section">
+    <ul>
+      <li [class.current_section]="analysisOpen"
+          [class.act_section]="analysisOpen"
+          title="Analysis Indicators"
+          class="submenu_trigger">
+        <a [routerLink]="" (click)="analysisOpen = !analysisOpen">
+          <span class="menu_icon"><i class="material-icons">donut_large</i></span>
+          <span class="menu_title">Analysis Indicators</span>
+        </a>
+        <ul [style.display]="(analysisOpen?'block':'none')">
+          <ng-template ngFor [ngForOf]="stakeholder.topics" let-topic let-j="index">
+            <li>
+              <a [routerLink]="topic.alias">
+                <span *ngIf="topic.icon" class="menu_icon uk-margin-small-right"><i
+                  class="material-icons">{{topic.icon}}</i></span>
+                <span class="menu_title">{{topic.name}}</span>
+              </a>
+            </li>
+          </ng-template>
+          <li>
+            <a [routerLink]="" (click)="newTopicOpen()">
+              <span class="menu_icon"><i class="material-icons">add</i></span>
+              <span class="menu_title">Create new Topic</span>
+            </a>
+            <div uk-drop="mode: click; offset: -2; delay-hide: 0" #newTopic
+                 class="uk-padding-large uk-padding-remove-vertical uk-padding-remove-right uk-drop">
+              <div *ngIf="topic">
+                <div class="md-card">
+                  <div class="md-card-content uk-position-relative">
+                    <a [routerLink]="" class="uk-position-top-right">
+                      <i (click)="close(newTopic)" class="material-icons">close</i>
+                    </a>
+                    <div class="uk-grid-small" uk-grid>
+                      <div class="uk-width-1-1">
+                        <label class="uk-text-bold">New Topic</label>
+                        <input class="uk-input uk-form-small" [(ngModel)]="topic.name"
+                               [class.uk-form-danger]="!valid" type="text">
+                      </div>
+                      <div class="uk-width-1-2">
+                        <select class="uk-select uk-form-small" [(ngModel)]="topic.isPublic">
+                          <option [value]="true">Public</option>
+                          <option [value]="false">Private</option>
+                        </select>
+                      </div>
+                      <div class="uk-width-1-2">
+                        <select class="uk-select uk-form-small"  [(ngModel)]="topic.isActive">
+                          <option [value]="true">Active</option>
+                          <option [value]="false">Inactive</option>
+                        </select>
+                      </div>
+                    </div>
+                    <hr>
+                    <div class="uk-grid-small uk-child-width-1-2" uk-grid>
+                      <div>
+                        <button class="md-btn md-btn-small" (click)="close(newTopic)">Cancel</button>
+                      </div>
+                      <div>
+                        <button class="md-btn md-btn-small md-btn-primary uk-float-right" (click)="createTopic(newTopic)">Create</button>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </li>
+        </ul>
+      </li>
+    </ul>
+  </div>
+</aside>
+<div id="page_content" click-outside-or-esc targetId="page_content" (clickOutside)="toggleOpen($event)">
+  <div id="page_content_inner">
+    <h4 class="uk-text-bold">
+      Customise your Monitor Dashboard!
+    </h4>
+    <div class="uk-text-large uk-margin-bottom">
+      <div>
+        Modify or add new topics, categories and content.<br><br>
+        Start your navigation through the <span class="md-color-blue-700">left side menu!</span>
+      </div>
+      <div class="uk-margin-small-top uk-margin-small-bottom uk-margin-large-left">
+        <svg xmlns="http://www.w3.org/2000/svg" width="27" height="88" viewBox="0 0 27 88">
+          <g id="Group_749" data-name="Group 749" transform="translate(-872.168 -490.5)">
+            <text class="fill_text" id="OR" transform="translate(872.168 540.271)" font-size="18"
+                  font-family="OpenSans-Bold, Open Sans" font-weight="900" opacity="0.8">
+              <tspan x="0" y="0">OR</tspan>
+            </text>
+            <line class="stroke_line" id="Line_225" data-name="Line 225" y2="30" transform="translate(885.5 490.5)"
+                  fill="none" stroke="#000" stroke-width="1" opacity="0.2"/>
+            <line class="stroke_line" id="Line_226" data-name="Line 226" y2="30" transform="translate(885.5 548.5)"
+                  fill="none" stroke="#000" stroke-width="1" opacity="0.2"/>
+          </g>
+        </svg>
+      </div>
+      <div class="uk-width-1-1">
+        Select one of the <span class="md-color-blue-700">topics below</span>!
+      </div>
+    </div>
+    <div class="uk-child-width-1-3@m uk-child-width-1-1@s uk-grid-medium" uk-grid uk-height-match="target: .target">
+      <ng-template ngFor [ngForOf]="stakeholder.topics" let-topic>
+        <div>
+          <a [routerLink]="topic.alias">
+            <div class="md-card target">
+              <div class="md-card-content">
+                <h6 class="uk-text-bold">{{topic.name}}</h6>
+                <div class="uk-text-secondary">
+                  {{topic.description}}
+                </div>
+              </div>
+            </div>
+          </a>
+        </div>
+      </ng-template>
+    </div>
+  </div>
+</div>
Index: modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/topic/topic.component.ts
===================================================================
--- modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/topic/topic.component.ts	(nonexistent)
+++ modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/topic/topic.component.ts	(revision 57506)
@@ -0,0 +1,97 @@
+import {Component, OnDestroy, OnInit} from '@angular/core';
+import {ActivatedRoute, Router} from '@angular/router';
+import {Title} from '@angular/platform-browser';
+import {EnvProperties} from '../openaireLibrary/utils/properties/env-properties';
+
+import {ErrorCodes} from '../openaireLibrary/utils/properties/errorCodes';
+import {ErrorMessagesComponent} from '../openaireLibrary/utils/errorMessages.component';
+import {Stakeholder, Topic} from "../utils/entities/stakeholder";
+import {SideBarService} from "../library/sharedComponents/sidebar/sideBar.service";
+import {StakeholderService} from "../services/stakeholder.service";
+
+declare var UIkit;
+
+@Component({
+  selector: 'topic',
+  templateUrl: './topic.component.html',
+})
+export class TopicComponent implements OnInit, OnDestroy {
+  public status: number;
+  public loading: boolean = true;
+  public errorCodes: ErrorCodes;
+  public stakeholder: Stakeholder;
+  public analysisOpen: boolean = true;
+  private errorMessages: ErrorMessagesComponent;
+  public topic: Topic;
+  public valid = true;
+  public properties: EnvProperties;
+
+  constructor(
+    private route: ActivatedRoute,
+    private router: Router,
+    private title: Title,
+    private sideBarService: SideBarService,
+    private stakeholderService: StakeholderService) {
+    this.errorCodes = new ErrorCodes();
+    this.errorMessages = new ErrorMessagesComponent();
+    this.status = this.errorCodes.LOADING;
+  }
+
+  public ngOnInit() {
+    this.route.data
+      .subscribe((data: { envSpecific: EnvProperties }) => {
+        this.properties = data.envSpecific;
+        this.route.params.subscribe( params => {
+          this.stakeholderService.getStakeholderAsObservable().subscribe(stakeholder => {
+            if (stakeholder) {
+              this.sideBarService.setHasSidebar(true);
+              this.stakeholder = stakeholder;
+              this.topic = this.stakeholder.topics.filter(topic => topic.alias === params['topic'])[0];
+              this.title.setTitle(stakeholder.index_name);
+              if(!this.topic) {
+                this.navigateToError();
+              }
+            }
+          });
+        });
+      });
+  }
+
+  public ngOnDestroy() {
+  }
+
+  public newTopicOpen() {
+    this.topic = new Topic(null, null, null,true, true);
+    this.valid = true;
+  }
+
+  public close(element) {
+    UIkit.drop(element).hide();
+  }
+
+  get open(): boolean {
+    return this.sideBarService.open;
+  }
+
+  public toggleOpen(event = null) {
+    if (!event) {
+      this.sideBarService.setOpen(!this.open);
+    } else if (event && event['value'] === true) {
+      this.sideBarService.setOpen(false);
+    }
+  }
+
+  public createTopic(element) {
+    if(this.topic.name && this.topic.name !== '') {
+      this.topic.alias = this.topic.name.toLowerCase();
+      this.stakeholder.topics.push(this.topic);
+      this.close(element);
+    } else {
+      this.valid = false;
+    }
+  }
+
+  private navigateToError() {
+    this.router.navigate(['/error'], {queryParams: {'page': this.router.url}});
+  }
+}
Index: modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/topic/topic.module.ts
===================================================================
--- modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/topic/topic.module.ts	(nonexistent)
+++ modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/topic/topic.module.ts	(revision 57506)
@@ -0,0 +1,30 @@
+import {NgModule} from '@angular/core';
+import {CommonModule} from '@angular/common';
+
+import {FreeGuard} from '../openaireLibrary/login/freeGuard.guard';
+import {PreviousRouteRecorder} from '../openaireLibrary/utils/piwik/previousRouteRecorder.guard';
+
+import {PiwikService} from '../openaireLibrary/utils/piwik/piwik.service';
+import {TopicComponent} from "./topic.component";
+import {TopicRoutingModule} from "./topic-routing.module";
+import {ModalModule} from "../openaireLibrary/utils/modal/modal.module";
+import {RouterModule} from "@angular/router";
+import {FormsModule} from "@angular/forms";
+
+@NgModule({
+  imports: [
+    CommonModule, TopicRoutingModule, ModalModule, RouterModule, FormsModule
+  ],
+  declarations: [
+    TopicComponent
+  ],
+  providers: [
+    FreeGuard, PreviousRouteRecorder,
+    PiwikService
+  ],
+  exports: [
+    TopicComponent
+  ]
+})
+export class TopicModule {
+}
Index: modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/topic/topic-routing.module.ts
===================================================================
--- modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/topic/topic-routing.module.ts	(nonexistent)
+++ modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/topic/topic-routing.module.ts	(revision 57506)
@@ -0,0 +1,20 @@
+import {NgModule} from '@angular/core';
+import {RouterModule} from '@angular/router';
+import {FreeGuard} from '../openaireLibrary/login/freeGuard.guard';
+import {PreviousRouteRecorder} from '../openaireLibrary/utils/piwik/previousRouteRecorder.guard';
+import {TopicComponent} from "./topic.component";
+
+@NgModule({
+  imports: [
+    RouterModule.forChild([
+      {
+        path: '',
+        component: TopicComponent,
+        canActivate: [FreeGuard],
+        canDeactivate: [PreviousRouteRecorder]
+      }
+    ])
+  ]
+})
+export class TopicRoutingModule {
+}
Index: modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/app-routing.module.ts
===================================================================
--- modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/app-routing.module.ts	(revision 57505)
+++ modules/uoa-monitor-portal/trunk/monitor_dashboard/src/app/app-routing.module.ts	(revision 57506)
@@ -8,11 +8,6 @@
 
 const routes: Routes = [
   {
-    path: ':stakeholder',
-    loadChildren: './home/home.module#HomeModule',
-    resolve: {envSpecific: EnvironmentSpecificResolver}
-  },
-  {
     path: 'monitor',
     loadChildren: './monitor/monitor.module#MonitorModule',
     resolve: {envSpecific: EnvironmentSpecificResolver}
@@ -29,6 +24,16 @@
   },
   {path: 'error', component: OpenaireErrorPageComponent, resolve: {envSpecific: EnvironmentSpecificResolver}},
   {
+    path: ':stakeholder',
+    loadChildren: './home/home.module#HomeModule',
+    resolve: {envSpecific: EnvironmentSpecificResolver}
+  },
+  {
+    path: ':stakeholder/:topic',
+    loadChildren: './topic/topic.module#TopicModule',
+    resolve: {envSpecific: EnvironmentSpecificResolver}
+  },
+  {
     path: '**',
     pathMatch: 'full',
     component: OpenaireErrorPageComponent,
