In my XPages application I want to add some $$ Domino forms and style them with Bootstrap. Since bootstrap is already enabled for the application so its available on the server I was thinkin of re-using them on these forms so I added the following formula in the HTML Head Content section:
"<meta charset=\"utf-8\">
<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">
<meta name=\"description\" content=\"\">
<meta name=\"author\" content=\"\">
<meta charset=\"utf-8\">
<link rel=\"shortcut icon\" href=\"/" + @WebDbName + "/favicon.ico\">
<title>Authentication Failure</title>
<!-- Bootstrap core CSS -->
<link href=\"../../xsp/.ibmxspres/.extlib/responsive/dijit/dbootstrap-0.1.1/theme/dbootstrap/dbootstrap.css\" rel=\"stylesheet\">
<link href=\"../../xsp/.ibmxspres/.extlib/responsive/bootstrap3/css/bootstrap.css\" rel=\"stylesheet\">
<script src=\"../../xsp/.ibmxspres/.extlib/responsive/jquery/jquery.min.js\"></script>
<script src=\"../../xsp/.ibmxspres/.extlib/responsive/bootstrap3/js/bootstrap.min.js\"></script>
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src=\"http://getbootstrap.com/assets/js/html5shiv.js\"></script>
<script src=\"http://getbootstrap.com/assets/js/respond.min.js\"></script>
<![endif]-->"
As a result any text I apply seems to be formatted with the Bootstrap CSS. But components like jumbotron are not formatted although I notice the jumbotron class defined in the bootstrap.min.css file.
Am I overlooking something?
I have a Bootstrap enabled Domino form that uses the following in the HTML Head Content (which works):
"<meta http-equiv='X-UA-Compatible' content='IE=Edge'>
<meta charset=\"utf-8\">
<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">
<!-- Bootstrap core CSS -->
<link rel=\"stylesheet\" type=\"text/css\" href=\"/xsp/.ibmxspres/.extlib/bootstrap/xsptheme/xsp.css\">
<link rel=\"stylesheet\" type=\"text/css\" href=\"/xsp/.ibmxspres/.extlib/bootstrap/bootstrap320/css/bootstrap.min.css\">
<link rel=\"stylesheet\" type=\"text/css\" href=\"/xsp/.ibmxspres/.extlib/bootstrap/xpages300.css\">
<script src='/xsp/.ibmxspres/.extlib/bootstrap/jquery/jquery-1.11.0.min.js'></script>
<script src='/xsp/.ibmxspres/.extlib/bootstrap/bootstrap320/js/bootstrap.min.js'></script>
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src=\"https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv-printshiv.js\"></script>
<script src=\"https://cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.min.js\"></script>
<![endif]-->"
So change your CSS link hrefs to start with /xsp (so, remove ../..) and see if it works.