Ajout de Bootstrap à un formulaire Domino

Question

Dans mon application XPages, je souhaite ajouter des formulaires Domino $$ et les styler avec Bootstrap. Depuis bootstrap est déjà activé pour l'application si elle est disponible sur le serveur que j'étais thinkin de les réutiliser sur ces formes si j'ai ajouté la formule suivante dans la section Contenu Head HTML:

"<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]-->" 

En conséquence tout texte Je applique semble être formaté avec le CSS Bootstrap. Mais les composants comme jumbotron ne sont pas formatés bien que je remarque la classe jumbotron définie dans le fichier bootstrap.min.css.

Est-ce que je regarde quelque chose?

Answer 1

J'ai un Bootstrap activé forme Domino qui utilise les éléments suivants dans le contenu HTML Head (qui fonctionne):

"<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]-->" 

donc changer votre lien CSS HREF pour commencer/XSP (donc, enlever ../ ..) et voir si cela fonctionne.

Answer 2

Le temps d'exécution XPages a le code de reconnaître le chemin « /xsp/.ibmxspres » et courir à travers tous ResourceProviders définis pour trouver où charger la ressource pertinente à partir. Dans ce cas, le ".extlib" suivant identifie qu'il fait partie du plugin Extension Library.

OSGi lui permet d'extraire la ressource pertinente du plug-in.

Avec un formulaire standard Domino, vous n'avez pas non plus de ceux-ci, il ne sait pas où les fichiers sont et ne pouvaient pas les extraire si elle l'a fait. Si vous téléchargez ExtLib à partir d'OpenNTF, vous pouvez décompresser le plugin correspondant ("com.ibm.xsp.theme.bootstrap") avec tout ce que vous utilisez normalement pour extraire les fichiers zip - un jar est une autre archive comme un zip. Vous pouvez ensuite extraire les fichiers d'amorçage et les utiliser en conséquence. Cela vaut probablement la peine de les placer sur le serveur, dans le dossier \ domino \ html car il y a un nombre maximum d'éléments de conception et NSF peut contenir.