Integrate HTML/CSS

Ionic Framework ionic-v3
1

Hi everyone! if i have a html / css template how to integrate it into my ionic project?

2

Is it an Ionic Theme that you have purchased?

See: https://market.ionicframework.com/themes

Also see: https://robferguson.org/blog/2017/11/12/theming-your-ionic-3-app/

3

No it is my own theme

4

I load CSS files that are not critical to the initial rendering of the App, asynchronously:

<!doctype html>
<html lang="en" dir="ltr">

<head>

  ...

  <!--
  <link type="text/css" rel="stylesheet" href="build/main.css">
  -->

</head>
<body>

  <ion-app></ion-app>

  <script src="build/polyfills.js"></script>
  <script src="build/vendor.js"></script>
  <script src="build/main.js"></script>

  <link rel="preload" href="build/main.css" as="style"
        onload="this.onload=null;this.rel='stylesheet'">
  <noscript><link rel="stylesheet" href="build/main.css"></noscript>
  
</body>

See: https://robferguson.org/blog/2018/04/17/optimising-the-performance-of-an-ionic-pwa-part-2/

5

Great! And for the html part of my based template??

Thanks a lot.

6

Just add your Ionic directives and your HTML markup to your page template:

<ion-header>

  <ion-navbar color="primary">
    <ion-title>
     Placeholder
    </ion-title>
  </ion-navbar>

</ion-header>

<ion-content padding>

  <p text-center>This is a placeholder page</p>

</ion-content>
7

Ok big thanks to you.