Updating to Jump Start 1.2

Plugins

After you’ve updated your theme, make sure to also update all of our major plugins:

1. Theme Blvd Layout Builder
2. Theme Blvd Sliders
3. Theme Blvd Widget Areas
4. Theme Blvd Shortcodes
5. Theme Blvd Widget Pack

[divider]

Bootstrap 3

With the update to Bootstrap 3, comes a lot of style adjustments in our frontend elements. Below are some things to be aware of with this.

Starter child themes and CSS changes

If you used one of the starter child themes, there are a couple of changes you may want to make to your style.css to make things jive a bit better with Bootstrap 3.

1) Bootstrap now applies padding to lists, opposed to margin. So, you’ll want to find where the margin is removed from unordered lists of widgets:

.widget ul {
	margin: 0;
}

And change it so that the lists in widget set the padding to 0 instead.

.widget ul {
	padding: 0;
}

2) The responsive tablet viewport cutoff size is now 992, when previously it was 979. So, in your style.css, find the declaration for this:

@media (max-width: 979px) {

And change it so that’s it 992:

@media (max-width: 992px) {

Button gradients

In Bootstrap 3, buttons now come with a simplified style. However, we know that some of you will prefer the previous look with gradients applied to buttons. If you’d like this back, you can filter in the “tb-btn-gradient” body class, and let Jump Start do the rest.

So, from your child theme’s functions.php, you’d set it up like this:

function my_btn_gradient( $class ) {
	$class[] = 'tb-btn-gradient';
	return $class;
}
add_filter( 'body_class', 'my_btn_gradient' );

Tabs options are now simplified

We always hate stripping away features, but unfortunately Bootstrap has dramatically simplified how their tabs works. And so our [tabs] shortcode (provided with Theme Blvd Shortcodes plugin) no longer has many of the navigation options that previously existed.

You can no longer set tab navigation to display to the right, left or below the tab content.

[divider]

FontAwesome 4

Be aware that the theme now includes FontAwesome 4. View all current icons in the FontAwesome documentation:

http://fortawesome.github.io/Font-Awesome/icons/

Note that many icon names have changed in FontAwesome 4. Checkout this FontAwesome update guide to see what many icon names have been changed to.

In FontAwesome 4, they’ve made a lot of internal changes to how their CSS works. If you’ve manually coded any HTML in your website to use these icons like this:

<i class="icon-example"></i>

You’ll need to change these to they reflect the updated CSS class usage:

<i class="fa fa-example"></i>