2

I want to use the latest Bootstrap CDN, but it defaults to 12 column layout. Is the only way to customize into a 16 col layout is to download and host files yourself?

Edit: I'm asking how to get bootstrap through a CDN. I use the bootstrap CDN from https://cdnjs.com/ and it works great, except it is 12-col layout.

batoutofhell
  • 1,279
  • 3
  • 12
  • 17
  • possible duplicate of [How to use bootstrap with 16 or 24 columns](http://stackoverflow.com/questions/11591185/how-to-use-bootstrap-with-16-or-24-columns) – Marc Apr 01 '15 at 16:51
  • Nope, completely different – batoutofhell Apr 02 '15 at 17:24
  • Using a public CDN when you need a heavily customized version is going to be an uphill battle. I'd suggest using a managed version of bootstrap (from npm, bower, etc.) and then use LESS for your customization needs. If you absolutely need a CDN, then consider a privately hosted one where you can upload shared resources and access them as needed. – Carrie Kendall Apr 15 '15 at 21:14

3 Answers3

6

There is really only 2 options to do this.

  1. You override bootstraps grid system with your own css file.

    <link rel="stylesheet" href="/cdn/path/to/bootstrap.css" />
<link rel="stylesheet" href="/my/path/overide_bootstrap.css" />

    This can be a tedious task and I would not recommend doing it this way.

  2. Customize Bootstrap and use your own version

    If you go to http://getbootstrap.com/customize/ you can customize and download a fully customized version of Bootstrap. Specifically for what you are looking for is located at http://getbootstrap.com/customize/#grid-system.

Once it has been downloaded you have a few options:

  1. Serve the files yourself from your own project.

  2. Use a free CDN service

    There are multiple CDN services that you can use, such as CloudFlare (https://www.cloudflare.com/features-cdn) or you can use cdnjs (https://github.com/cdnjs/cdnjs#adding-a-new-or-updating-an-existing-library)

I hope this helps!

Justin Ober
  • 839
  • 6
  • 14
  • This is the best solution tbh, majority of the css is hosted through the cdn and your customised grid is hosted locally. – MikeyBeLike Apr 16 '15 at 21:00
1

You can customize most of Bootstrap configs and default values.In your case you can set @grid-columns value in the .less.

However you can still get customized Bootstrap from http://getbootstrap.com/customize/#grid-system

Just set Number of columns in the grid. and click "Compile and Download" at end of the page.

Akram Berkawy
  • 4,920
  • 2
  • 19
  • 27
1

I think you can use cdn version of bootstrap and just go to customize and download only css with an adjusted grid system.

So you will have main bootstrap file from cdn, and overridden grid classes in your second file. Make sure to load cdn version first though.

iurii
  • 4,142
  • 2
  • 23
  • 28