How can I set default property values for twitter bootstrap popover?

Bootstrap V2 - View the JSFiddle

You can log the defaults to see all the defaults set by Bootstrap 2 using:

console.log($.fn.popover.defaults); // Log default values to the console

You can override the defaults set by Twitter Bootstrap 2 using the following:

// Make sure jQuery is loaded before trying to override the defaults!
$.fn.popover.defaults.trigger = 'hover';   // Set the default trigger to hover
$.fn.popover.defaults.placement = 'right'; // Set the default placement to right
$.fn.popover.defaults.html = true;         // Set the default html (parse html) to true

View the JSFiddle here


Bootstrap V3 - View the JSFiddle

You can log the defaults to see all the defaults set by Bootstrap 3 using:

console.log($.fn.popover.Constructor.DEFAULTS); // Log default values to the console

You can override the defaults set by Twitter Bootstrap 3 using the following:

// Make sure jQuery is loaded before trying to override the defaults!
$.fn.popover.Constructor.DEFAULTS.trigger = 'hover';   // Set the default trigger to hover
$.fn.popover.Constructor.DEFAULTS.placement = 'right'; // Set the default placement to right
$.fn.popover.Constructor.DEFAULTS.html = true;         // Set the default html (parse html) to true

View the JSFiddle here


Bootstrap V4 - View the JSFiddle

The syntax varies slightly from Bootstrap 3:

$.fn.popover.Constructor.Default.html = true;

Default Values

By default the values are set to the following (they are the same in Boostrap 2 & 3):

animation: true
container: false
content: ""
delay: 0
html: false
placement: "right"
selector: false
template: "<div class="popover"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>"
title: ""
trigger: "hover"

For doing this with AngularJS refer to: http://angular-ui.github.io/bootstrap/#/tooltip

E.g.: $tooltipProvider.options({'placement': 'right'})