Sell Theme: How To Add A Custom Page Header Sell Theme: How To Add A Custom Page Header
  1. JuniperCommerce
  2. JuniperWeb
  3. "How To"

Sell Theme: How To Add A Custom Page Header

Requirements:

- Entry-level experienceor a willingness to learn HTML & CSS.

Custom page headers can be added to the top of any page by using HTML & CSS.

  1. Once inside the Juniper Web admin portal, using the menu on the left-hand side, click "Website" > "Pages"
  2. Click the desired page to go into the editor
  3. Add a Paragraph or similar UI element.
  4. Click the newly added element, then within the editor click the Source Code iconmceclip0.png
  5. Paste in your HTML / CSS
  6. Save and Publish your draft.
  7. Navigate back to the frontend of your Juniper Web site and refresh the page. You may be required to clear your cache to see the changes.

    Custom_Header.gif

The following frameworks and libraries can be utilized in your code...

BootStrap framework

FontAwesome & Orion icon libraries

Sample Page Header Code

<section class="hero">
<div class="container">
<ol class="breadcrumb justify-content-center">
<li class="breadcrumb-item"><a href="/">Home</a></li>
<li class="breadcrumb-item active">Contact</li>
</ol>
<div class="hero-content pb-5 text-center">
<h1 class="hero-heading">Contact</h1>
<div class="row">
<div class="col-xl-8 offset-xl-2">
<p class="lead text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
</div>
</div>
</div>
</section>
Need further support? Submit a request