diff --git a/app/models/page.rb b/app/models/page.rb
index 9289f8fd3..e8004a468 100644
--- a/app/models/page.rb
+++ b/app/models/page.rb
@@ -1,5 +1,5 @@
class Page < ApplicationRecord
- TEMPLATE_OPTIONS = %w[contained full_within_layout json].freeze
+ TEMPLATE_OPTIONS = %w[contained full_within_layout nav_bar_included json].freeze
TERMS_SLUG = "terms".freeze
CODE_OF_CONDUCT_SLUG = "code-of-conduct".freeze
diff --git a/app/views/pages/show.html.erb b/app/views/pages/show.html.erb
index 8d922e3b9..52f122524 100644
--- a/app/views/pages/show.html.erb
+++ b/app/views/pages/show.html.erb
@@ -24,6 +24,16 @@
<%= @page.title %>
+ <%= @page.processed_html.html_safe %>
+
+
+ <% elsif @page.template == "nav_bar_included" %>
+
+
+ <%= render "articles/sidebar" %>
+
+
+
<%= @page.title %>
<%= @page.processed_html.html_safe %>
diff --git a/cypress/e2e/seededFlows/adminFlows/pages/createPage.spec.js b/cypress/e2e/seededFlows/adminFlows/pages/createPage.spec.js
new file mode 100644
index 000000000..8ba3885b4
--- /dev/null
+++ b/cypress/e2e/seededFlows/adminFlows/pages/createPage.spec.js
@@ -0,0 +1,38 @@
+describe('Create a new page from the admin portal', () => {
+ beforeEach(() => {
+ cy.testSetup();
+ cy.fixture('users/adminUser.json').as('user');
+ cy.get('@user').then((user) => {
+ cy.loginAndVisit(user, '/admin/customization/pages');
+ });
+ });
+
+ it('Creates a page with the nav_bar_included template', () => {
+ cy.findByRole('link', { name: 'New page' }).click();
+
+ cy.findByRole('textbox', { name: 'Title' }).type('New page with nav bar');
+ cy.findByRole('textbox', { name: 'Slug' }).type('test-nav-bar');
+ cy.findByRole('textbox', { name: 'Description' }).type('Testing');
+
+ cy.findByRole('combobox', {
+ name: "Template Determines the way page's body will be embedded in the layout",
+ }).select('nav_bar_included');
+
+ cy.findByRole('textbox', { name: 'Body markdown' }).type('## Hello world');
+ cy.findByRole('button', { name: 'Create Page' }).click();
+
+ cy.findByText('Page has been successfully created.').should('exist');
+ cy.findByRole('link', { name: 'New page with nav bar' }).click();
+
+ // Check nav bar elements are displayed alongside the entered body markdown
+ cy.findByRole('link', { name: 'Nav link 0' });
+ cy.findByRole('link', { name: 'Reading List' });
+ cy.findByRole('heading', { name: 'Hello world', level: 2 });
+
+ // Check that the nav bar collapses in mobile screen size
+ cy.viewport('iphone-x');
+ cy.findByRole('link', { name: 'Nav link 0' }).should('not.exist');
+ cy.findAllByRole('button', { name: 'Navigation menu' }).first().click();
+ cy.findByRole('link', { name: 'Nav link 0' }).should('exist');
+ });
+});
diff --git a/db/seeds.rb b/db/seeds.rb
index a3a6ad271..e32b2bf8d 100644
--- a/db/seeds.rb
+++ b/db/seeds.rb
@@ -569,7 +569,7 @@ seeder.create_if_none(Page) do
body_markdown: Faker::Markdown.random,
slug: Faker::Internet.slug,
description: Faker::Books::Dune.quote,
- template: %w[contained full_within_layout].sample,
+ template: %w[contained full_within_layout nav_bar_included].sample,
)
end
end