Customizing Bootstrap 3 with LESS 
Bootstrap Layouts: Responsive Single-Page Design
Bootstrap 3: Advanced Web Development 

http://www.lynda.com/search?q=bootstrap

Bootstrap has good documentation for the most part...

Bill - recommend you break it up into pieces...  Focus first just on the grid and getting used to that.  It's not that difficult to get a good feel for it at least.  We have Lynda at work and there are some good tutorials there.  I would suspect there's a lot of free ones also.  

When you're ready to move past that piece the bootstrap documentation really shines but I also like going to bootsnipp.com where they have all these little snippets.  Good way to get ideas.

Patrik and David - both your points are good ones, the problem I had / am having is implementing Bootstrap in XPages. When I use Bootstrap nativly (i.e. creating the odd page in a text editor) the examples on bootstrap.com etc. are very good (as is lynda.com) - where it breaks for me is using it in an XPages app. As soon as I start I am not sure if I should use the Application Layout control - which creates a lot of setting that I often cannot make head or tail of, or should I use div's which seems to break other things :o) Don't get me started on using Date / Time pickers :o) Just when I think I have it working I cannot e.g. get glyphs to work (this is currently the problem I have on StackOverflow) - this now means I need to move from a DataView to a Repeat Control to get it to work.... Anyway, sorry to not add anything but complaints to your question Bill, I am assuming that perseverance will pay out (for me at least) . Greetings from Austia

Ursus,

How are you trying to get Bootstrap into XPages?  You should be using the latest Ext. Library.  Everything else should be abandoned.  Use the Library.  Bootstrap 3.2 is built in.

I would also avoid the application layout control. At least for a while to get started though I am NOT using it with my Bootstrap stuff at all and have no plans to.  I'm just typing in the HTML I want into the xpage editor.  Works really well.  I've not tried date/time pickers myself yet but I think we have in the day job done so.

There was a bug with the glyph stuff which I believe was fixed in the latest ext. library.  The CSS/JS aggregator was breaking directory links or something if I remember right.

You should have no problem using Repeat controls with the Bootstrap stuff.  I do that all day long really.  You do need to make sure you choose a bootstrap theme from the library of course.....

and found that interesting and I think I have a bit of an idea what to do. All of the XPages examples that I have found go back to before Bootstrap 3.2 was bundled into the Extension Library. Maybe I'm just not looking in the right places but I would like to build a layout control but I'm not even sure how to start. 

I create a new custom Control and go to the source editor but then what? I need really basic starting point on how to get the HTML into the control. Maybe I'm just a little thick in the head but I can't see how to do that. At this point I don't want to build it with the Extension Library BS application Layout.

Sorry but this is totally new territory for me. 

Bill,

I'm not totally sure I understand the disconnect here.  Are you aware that in the source pane of the XPage you can simply type in normal HTML?  <div></div> and all that stuff?  It sounds like you might not be.  You can put any valid HTML tags into the xpages source.   <fieldset>  is a good one for instance.

So you could create a new .nsf...  that uses the latest ext. library...  set the them to one of the bootstrap themes...  create an xpage..  and then go do the bootstrap website and take an example and copy the html directly into your xpages source.  Now if you do that some examples need to be modified slightly as the bootstrap examples are not alwars valid xml...  so you might have to close some tags...  or replace some characters with the xml equivalent.  But that's a decent way to get started really...

Below is one of my older custom controls that's just a little navBar in an application...  but just notice that you can have pure html inside the XPage.  The only real "XPages" stuff in here I think are a couple of links...  One link even brings back a value from a managed bean.  Using a repeat control for the "hamburger" icon seems a little silly...  I forget where I got that from. so don't let that confuse you.  I would litterally just take the example from the bootstrap website as a starting point of building a new one.

Now some bootstrap examples have the form tag...  I believe technically all of the xpage is inside a form tag by default.  So whenever I get one of those examples I change the <form> to <div> and keep the css styling.

Does that help?

==========

<?xml version="1.0" encoding="UTF-8"?>

<xp:view xmlns:xp="http://www.ibm.com/xsp/core">

<div class="navbar navbar-default navbar-fixed-top" role="navigation">

        <div class="navbar-header">

            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">

                <xp:text styleClass="sr-only" value="Toggle navigation" />

                <xp:repeat value="#{3}">

                    <span class="icon-bar" />

                </xp:repeat>

            </button>

        </div>

        <div class="collapse navbar-collapse">

            <ul class="nav navbar-nav">

            <li>

                <xp:link styleClass="navbar-brand" text="Home" value="/home.xsp" />

            </li>

            <li>

                <xp:link styleClass="navbar-brand" text="Admin"

                    value="/admin.xsp">

                    <xp:this.rendered><![CDATA[#{javascript:database.queryAccessRoles(session.getEffectiveUserName()).contains('[Admin]');}]]></xp:this.rendered>

                </xp:link>

            </li>

            </ul>

            <ul class="nav navbar-nav navbar-right">

                <li>

                    <xp:link styleClass="navbar-brand"

                        text="#{Exhibitor.name}" value="/home.xsp" />

                </li>

            </ul>

        </div>

</div>

</xp:view>

I finally figured that out. What was confusing me was some of the older posts (before BS was integrated into the extension library). I think I have got my toes in the water.