We followed "https://helpx.adobe.com/experience-manager/using/AEM63_favicon.html" to assign a favicon to each adaptive form.
1. The folder /etc/designs/ does not exists so we create this folder (sling:folder)
2. added a cq:page with our project name and added a favicon to this page as a child.
Updated our adaptive form:
3. /content/forms/af/<project name>/<adaptive form name>/jcr:content
4. added node "cq:designPath" of type String with value "/etc/designs/<project name>"
Yeah.. FavIcon is now available
Issue is that we get an additional CSS file in the html <head> that does not exists and the browser console report this error.
Refused to apply style from 'https://<server>:<port>/etc/designs/<project name>.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
Actual the browser is trying to load the file, but the server respond with a 404 as the file does not exists. (log file entry in "request.log")
We found a solution, but not sure if this is according to the preferred methods
We notice that the "head.html" in libs is importing a file "customheaderlibs.html" for us to add values to the head tag
1. We created a new hidden component "apps.<project name>.components.pagefavicon" with
2. In the component we added a file "pagefavicon.html" with 1 line of code:
Now we have created 1 level of indirection.
3. added a file "customheaderlibs.html" to the same component. In the file we added 2 lines of code:
<link rel="icon" type="image/vnd.microsoft.icon" href="/etc/designs/<project name>/favicon.ico">
<link rel="shortcut icon" type="image/vnd.microsoft.icon" href="/etc/designs/<project name>/favicon.ico">
4. Navigated to "/content/forms/af/<project name>/<adaptive form name>/jcr:content"
5. edited sling:resourceType with a new value "/apps/<project name>/components/pagefavicon"
6. Now the favicon is appearing.