szthemes
PortfolioYouTubeProfile
Bootstrap Overlay Components - Responsive WordPress Plugin logo
O | C
Purchase Now

Bootstrap Modals
For WordPress Websites

Bootstrap Modals use to show modals or dialog boxes on WordPress sites. This Plugin is compatible with both versions of Bootstrap 3 and Bootstrap 4. But if you don't want to use Bootstrap in your website then it also provide the option. In other words you can use this Plugin with both types of websites Bootstrap and None Bootstrap websites.

Documentation

Content Examples : You can add content like images, heading, paragraph, lists, YouTube, vimeo, self-hosted videos, icons etc. through WordPress Editor. As well as you can use ShortCodes of other Plugins like Woo-Commerce to display content in Modals.


ImageYouTubeVimeoSelf HostedImage + TextShortCode

Appears On : You Can Triggered A Modal On - Click | Hover | On Page Load | On Page Leave | On Page Scroll. As well as you can also put value of delay showing and hiding the modal (ms).

OnPageLoadOnPageLeaveOnPageScrollOnMouseHoverOnButtonClickShow After DelayHide After Delay

Positions : Position to the Modal - | Center | Left | Right | Top-Center | Top-Left | Top-Right | Bottom-Center | Bottom-Left | Bottom-Right |

Top LeftTop CenterTop RightLeftCenterRightBottom LeftBottom CenterBottom Right

Border Radius : You can change border radius of modal by assigning value in pixels.

Border Radius NoneBorder Radius 8pxBorder Radius 16pxBorder Radius 32px

Shadow : You can show shadow behind the modal.

Box Shadow NoBox Shadow SmallBox Shadow NormalBox Shadow Large

Border : You can change border width and color of modal.

Border 1pxBorder 4pxBorder 8pxBorder 16px

Unlimited Modal Colors : You can change | Header Color | Body Color | Footer Color | Text Color | Buttons Color | Border Color | of a modal. There is no limit to choose colors.

#000000#7f7f7f#880015#ed1c24#ff7f27#fff200#22b14c#00a2e8#6AB344#a349a4#c3c3c3#b97a57#ffaec9#ffc90e#efe4b0#b5e61d#99d9ea#7092be#c8bfe7#6AB344#75b00f#3a0758#ffffff

Parts Colors : You can choose different colors for each part Of modals. There is no limit to choose colors.

Header ColorBody ColorFooter Color

BackDrop Colors : You can choose different colors for BackDrop Of modals. There is no limit to choose colors.

BackDrop Color RedBackDrop Color GreenBackDrop Color BlueBackDrop Color YellowBackDrop Color Orange

BackDrop Opacity : You can change opacity of BackDrop from 0 to 1.

Opacity 0.1Opacity 0.2Opacity 0.5Opacity 0.8Opacity 1Opacity 0

45+ Animation Effects On Show : You can show a modal with different animations effects.


FadeInDownBounceFlashPulseRubberBandShakeHeadShakeSwingTadaWobbleJelloHeartbeatBounceInBounceInDownBounceInLeftBounceInRightBounceInUpFadeInFadeInDownBigFadeInLeftFadeInLeftBigFadeInRightFadeInRightBigFadeInUpFadeInUpBigFlipFlipXFlipYLightSpeedInRotateInRotateInDownLRotateInDownRRotateInUpLRotateInUpRJackInTheBoxRollInZoomInZoomInDownZoomInLZoomInRZoomInUpSlideInDownSlideInLeftSlideInRightSlideInUp

32+ Animation Effects On Hide : You can hide a modal with different animations effects.


bounceOutbounceOutDownbounceOutLeftbounceOutRightbounceOutUpfadeOutfadeOutDownfadeOutDownBigfadeOutLeftfadeOutLeftBigfadeOutRightfadeOutRightBigfadeOutUpfadeOutUpBigflipOutXflipOutYlightSpeedOutrotateOutrotateOutDownLrotateOutDownRrotateOutUpLrotateOutUpRrollOutzoomOutzoomOutDownzoomOutLeftzoomOutRightzoomOutUpslideOutDownslideOutLeftslideOutRightslideOutUp

16+ Animation Timing Functions : You can change animation timing function of animations.

lineareaseIneaseOuteaseeaseInOutspeedyslowSpeedyeaseOutInCubicswingeaseOutCubiceaseOutCirceaseOutExpoeaseOutQuadeaseOutQuarteaseOutQuinteaseOutSine

Animation Duration : You can change animation duration in milliseconds by just adding value manually. These are just examples, you can assign any time value.

500ms1000ms1500ms2000ms2500ms2999ms

How To Create ?