/intellij-bootstrap

Bootstrap 3 and Bootstrap 4 plugin for IntelliJ

Primary LanguageJava

Bootstrap IntelliJ Plugin

The IntelliJ Bootstrap plugin for Bootstrap 3 and Bootstrap 4. This plugin enhances productivity by providing live templates - lots of live templates! This plugin works for the following JetBrains products:

  • IntelliJ IDEA

  • WebStorm and PhpStorm

  • Android Studio

  • PyCharm

  • RubyMine

  • AppCode

  • CLion

  • Gogland

  • Rider

And supports Bootstrap 3.3.7 and Bootstrap 4.0.0-beta.

If you like the Bootstrap plugin, please consider donating: Donate

Plugin in action

Feel free to let me know what else you want added via the issues.

Suggestions, feedback and other comments welcome via @epragt on Twitter.

Installation (in 3 easy steps)

To install the plugin open your editor (IntelliJ) and hit:

1) File > Settings > Plugins and click on the Browse repositories button.

2) Look for Bootstrap 3 the right click and select Download plugin.

3) Finally hit the Apply button, agree to restart your IDE and you’re all done!

Usage

To use the plugin, open an editor, and start typing bs3- for Bootstrap 3, or bs4- for Bootstrap 4 templates followed by pressing CMD+J. A list of templates will show up. Alternatively, you can type e.g. alert, followed by CMD+J, to immediately show only the alert templates.

What’s new

Since 4.1.0 (15 April 2018)

  • Added new template (bs3-panel:default) thanks to cedriczie

Since 4.0 (1 Oct 2017)

  • Bugfixes

  • Initial Bootstrap 4 support (expect more to come soon)

Note: version 3.0 was skipped to better align with Bootstrap versioning

Since 2.4 (12 Mar 2017)

  • Added bs3-form-field:select, thanks to JQ

Since 2.3 (13 Feb 2017)

  • Bootstrap 3.3.7

  • Code will now be reformatted, thanks to Azeem Hassni.

Since 2.2.1 (7 Jan 2016)

Since 2.2 (14 Dec 2015)

  • upgraded to Bootstrap 3.3.6

Since 2.1 (22 Jul 2015)

Since 2.0 (26 May 2015)

  • Jade support

  • Small bugfixes

What’s included - contents

Alert

Component Snippet code Context

Alert

bs3-alert

HTML

Component Snippet code Context

Alert with alert link (warning)

bs3-alert-link

HTML

Alert

Component Snippet code Context

Alert (Danger)

bs3-alert:danger

HTML

Alert (Info)

bs3-alert:info

HTML

Alert (Success)

bs3-alert:success

HTML

Alert (Warning)

bs3-alert:warning

HTML

Badge

Component Snippet code Context

Badge

bs3-badge

HTML

Breadcrumbs

Component Snippet code Context

Breadcrumbs

bs3-breadcrumbs

HTML

Button-group

Component Snippet code Context

Button group

bs3-button-group

HTML

Button group (Vertical orientation)

bs3-button-group:vertical

HTML

Button-toolbar

Component Snippet code Context

Button toolbar

bs3-button-toolbar

HTML

Button

Component Snippet code Context

Full dropdown example

bs3-button:dropdown

HTML

Cdn

Component Snippet code Context

Bootstrap 3 CSS & JS CDN

bs3-cdn

HTML

Bootstrap 3 CSS CDN

bs3-cdn:css

HTML

Bootstrap 3 JavaScript CDN

bs3-cdn:js

HTML

Checkbox

Component Snippet code Context

Checkbox Input Field

bs3-checkbox

HTML

Clearfix

Component Snippet code Context

Clearfix

bs3-clearfix

HTML

Col

Component Snippet code Context

Column 1

bs3-col:1

HTML

Column 10

bs3-col:10

HTML

Column 11

bs3-col:11

HTML

Column 12

bs3-col:12

HTML

Column 2

bs3-col:2

HTML

Column 3

bs3-col:3

HTML

Column 4

bs3-col:4

HTML

Column 5

bs3-col:5

HTML

Column 6

bs3-col:6

HTML

Column 7

bs3-col:7

HTML

Column 8

bs3-col:8

HTML

Column 9

bs3-col:9

HTML

Container

Component Snippet code Context

Container

bs3-container

HTML

Container Fluid

bs3-container:fluid

HTML

Dismissable-alert

Component Snippet code Context

Dismissable alert (danger)

bs3-dismissable-alert:danger

HTML

Dismissable alert (info)

bs3-dismissable-alert:info

HTML

Dismissable alert (success)

bs3-dismissable-alert:success

HTML

Dismissable alert (warning)

bs3-dismissable-alert:warning

HTML

Feature

Component Snippet code Context

Carousel Rows

bs3-feature:carousel-rows

HTML

Carousel Rows

bs3-feature:carousel-rows-css

CSS

Beautiful image card with description

bs3-feature:image-card-with-description

HTML

Beautiful image card with description

bs3-feature:image-card-with-description-css

CSS

Thumbnail in gallery

bs3-feature:thumbnail

HTML

Thumbnail gallery

bs3-feature:thumbnail-gallery

HTML

Form

Component Snippet code Context

Form

bs3-form

HTML

Form-field

Component Snippet code Context

No description

bs3-form-field:button

HTML

No description

bs3-form-field:checkbox

HTML

No description

bs3-form-field:select

HTML

No description

bs3-form-field:text

HTML

No description

bs3-form-field:time

HTML

Form

Component Snippet code Context

Form (Horizontal)

bs3-form:horizontal

HTML

Form (Inline)

bs3-form:inline

HTML

Form (Label)

bs3-form:label

HTML

Icon

Component Snippet code Context

Font Awesome Icon

bs3-icon

HTML

Glyphicon

bs3-icon:glyphicon

HTML

Image

Component Snippet code Context

Image

bs3-image

HTML

Input

Component Snippet code Context

Input (Form Input)

bs3-input

HTML

Horizontal Form Input Field

bs3-input:h

HTML

Jumbotron

Component Snippet code Context

Jumbotron

bs3-jumbotron

HTML

Label

Component Snippet code Context

Label

bs3-label

HTML

Label (Danger)

bs3-label:danger

HTML

Label (Default)

bs3-label:default

HTML

Label (Info)

bs3-label:info

HTML

Label (Success)

bs3-label:success

HTML

Label (Warning)

bs3-label:warning

HTML

List-group

Component Snippet code Context

List group

bs3-list-group

HTML

List group with Badges

bs3-list-group:badges

HTML

List Group with Content

bs3-list-group:content

HTML

Linked List Group

bs3-list-group:linked

HTML

Media-object

Component Snippet code Context

Media object (single entry)

bs3-media-object

HTML

Example media object

bs3-media-object:example

HTML

Modal

Component Snippet code Context

Modal Dialog Box

bs3-modal

HTML

Navbar

Component Snippet code Context

Navbar

bs3-navbar

HTML

Navbar (Basic)

bs3-navbar:basic

HTML

Navbar (Brand)

bs3-navbar:brand

HTML

Navbar (Fixed Bottom)

bs3-navbar:fixed-bottom

HTML

Navbar (Fixed Top)

bs3-navbar:fixed-top

HTML

Navbar (Form)

bs3-navbar:form

HTML

Navbar (Inverse)

bs3-navbar:inverse

HTML

Navbar (Link)

bs3-navbar:link

HTML

Navbar (Links)

bs3-navbar:links

HTML

Navbar (Responsive)

bs3-navbar:responsive

HTML

Navbar (Static Top)

bs3-navbar:static-top

HTML

Navbar (Text)

bs3-navbar:text

HTML

Page-header

Component Snippet code Context

Page Header

bs3-page-header

HTML

Pager

Component Snippet code Context

Pager

bs3-pager

HTML

Pager (Aligned)

bs3-pager:aligned

HTML

Pagination

Component Snippet code Context

Pagination

bs3-pagination

HTML

Pagination (Large)

bs3-pagination:large

HTML

Pagination (Small)

bs3-pagination:small

HTML

Panel

Component Snippet code Context

Panel

bs3-panel

HTML

Panel (Danger)

bs3-panel:danger

HTML

Panel with footer

bs3-panel:footer

HTML

Panel with heading

bs3-panel:heading

HTML

Panel (Info)

bs3-panel:info

HTML

Panel (Primary)

bs3-panel:primary

HTML

Panel (Success)

bs3-panel:success

HTML

Panel with table

bs3-panel:table

HTML

Panel (Warning)

bs3-panel:warning

HTML

Pills

Component Snippet code Context

Pills

bs3-pills

HTML

Pills (With dropdown menu)

bs3-pills:dropdown

HTML

Pills (Justified)

bs3-pills:justified

HTML

Pills (Vertical)

bs3-pills:vertical

HTML

Progress-bar

Component Snippet code Context

Basic progress bar

bs3-progress-bar

HTML

Progress bar (danger)

bs3-progress-bar:danger

HTML

Progress bar (info)

bs3-progress-bar:info

HTML

Progress bar with label

bs3-progress-bar:label

HTML

Stacked progress bar

bs3-progress-bar:stacked

HTML

Striped progress bar

bs3-progress-bar:striped

HTML

Animated striped progress bar

bs3-progress-bar:striped-animated

HTML

Progress bar (success)

bs3-progress-bar:success

HTML

Progress bar (warning)

bs3-progress-bar:warning

HTML

Radio

Component Snippet code Context

Radio Form Field

bs3-radio

HTML

Responsive-embed

Component Snippet code Context

Responsive embed of video (16:9)

bs3-responsive-embed:16:9

HTML

Responsive embed of video (4:3)

bs3-responsive-embed:4:3

HTML

Row

Component Snippet code Context

Row

bs3-row

HTML

Select

Component Snippet code Context

Select Box Form Field

bs3-select

HTML

Horizontal Form Select Box Field

bs3-select:h

HTML

Submit

Component Snippet code Context

Submit Button for Form

bs3-submit

HTML

Submit Button for Horizontal Forms

bs3-submit:h

HTML

Table

Component Snippet code Context

Table

bs3-table

HTML

Table (Bordered)

bs3-table:bordered

HTML

Table (Condensed)

bs3-table:condensed

HTML

Table (Hover)

bs3-table:hover

HTML

Table (Responsive)

bs3-table:responsive

HTML

Table (Striped)

bs3-table:striped

HTML

Tabs

Component Snippet code Context

Tabs

bs3-tabs

HTML

Tabs (With dropdown menu)

bs3-tabs:dropdown

HTML

Tabs (Justified)

bs3-tabs:justified

HTML

Template

Component Snippet code Context

Bootstrap 3 HTML5 Template

bs3-template:html5

HTML

Bootstrap 3 Starter Template

bs3-template:starter

HTML

Thumbnail

Component Snippet code Context

Thumbnail

bs3-thumbnail

HTML

Thumbnail with content

bs3-thumbnail:content

HTML

Well

Component Snippet code Context

Well

bs3-well

HTML

Well (large)

bs3-well:large

HTML

Well (small)

bs3-well:small

HTML

License

Bootstrap 3 - IntelliJ Plugin is open-sourced software licensed under the MIT license.

This plugin is based on bootstrap-3-phpstorm-plugin by @JasonMortonNZ, who did all of the hard work of creating most of the templates.