I created a finished Angular 7 app that is compiled and working (it is a small game). I want to include it into a page of my Wordpress installation.

  1. Where do I put my compile output of the Angular app (the content of the dist folder after running ng build)?
  2. How does the HTML code in my Wordpress page (HTML that embeds the Angular app) look like?

1 Answers

0
Codev On Best Solutions

I made my solution working with iFrame:

In angular.json I configured for "prod"

"outputHashing": "none"

Then I built my Angular 7 app using the "prod" configuration.

I copied the build output into a sub directory "angular-app" inside the "wp-content" directory of my wordpress page. On the target page of my wordpress installation I inserted this custom HTML code:

<iframe id="angularFrame" title="My Angular App" frameBorder="0"
    src="http://wordpress-url.com/wp-content/angular-app/index.html" 
    width="600" height="600">
</iframe>

This displays my angular app on a wordpress page.