Modals

[vc_row][vc_column][vc_custom_heading text=”Modals Shortcodes” use_theme_fonts=”yes” el_class=”shorter”][vc_column_text]Modals are streamlined, but flexible, dialog prompts with the minimum required functionality and smart defaults.
Toggle a modal via JavaScript by clicking the button below. You can build with Ultimate Addons Modal shortcodes.[/vc_column_text][/vc_column][/vc_row][vc_row][vc_column][vc_separator color=”custom” gap=”tall” gradient=”yes”][vc_custom_heading text=”Default” font_container=”tag:h4|text_align:left” use_theme_fonts=”yes”][ultimate_modal modal_title=”Default Modal Title” btn_size=”lg” btn_bg_color=”#0088cc” modal_on_align=”left” btn_text=”Launch Default Modal” modal_size=”medium” modal_style=”overlay-zoomin” overlay_bg_color=”” overlay_bg_opacity=”80″ modal_border_style=”solid” modal_border_width=”1″ modal_border_color=”” modal_border_radius=”6″ el_class=”clearfix” header_text_color=”” btn_txt_color=”#ffffff”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus.[/ultimate_modal][/vc_column][/vc_row][vc_row][vc_column][vc_separator color=”custom” gap=”tall” gradient=”yes”][vc_custom_heading text=”Optional Sizes” font_container=”tag:h4|text_align:left” use_theme_fonts=”yes”][vc_row_inner][vc_column_inner width=”1/4″][ultimate_modal modal_title=”Large Modal Title” btn_size=”md” btn_bg_color=”#0088cc” modal_on_align=”left” btn_text=”Launch Large Modal” modal_size=”container” modal_style=”overlay-zoomin” overlay_bg_color=”” overlay_bg_opacity=”80″ modal_border_style=”solid” modal_border_width=”1″ modal_border_color=”” modal_border_radius=”6″ header_text_color=”” btn_txt_color=”#ffffff”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus.[/ultimate_modal][/vc_column_inner][vc_column_inner width=”1/4″][ultimate_modal modal_title=”Medium Modal Title” btn_size=”md” btn_bg_color=”#0088cc” modal_on_align=”left” btn_text=”Launch Medium Modal” modal_size=”medium” modal_style=”overlay-zoomin” overlay_bg_color=”” overlay_bg_opacity=”80″ modal_border_style=”solid” modal_border_width=”1″ modal_border_color=”” modal_border_radius=”6″ header_text_color=”” btn_txt_color=”#ffffff”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus.[/ultimate_modal][/vc_column_inner][vc_column_inner width=”1/4″][ultimate_modal modal_title=”Small Modal Title” btn_size=”md” btn_bg_color=”#0088cc” modal_on_align=”left” btn_text=”Launch Small Modal” modal_style=”overlay-zoomin” overlay_bg_color=”” overlay_bg_opacity=”80″ modal_border_style=”solid” modal_border_width=”1″ modal_border_color=”” modal_border_radius=”6″ header_text_color=”” btn_txt_color=”#ffffff”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus.[/ultimate_modal][/vc_column_inner][vc_column_inner width=”1/4″][ultimate_modal modal_title=”Block Modal Title” btn_size=”md” btn_bg_color=”#0088cc” modal_on_align=”left” btn_text=”Launch Block Modal” modal_size=”block” modal_style=”overlay-zoomin” overlay_bg_opacity=”80″ modal_border_style=”solid” modal_border_width=”1″ modal_border_color=”” modal_border_radius=”6″ el_class=”clearfix” btn_txt_color=”#ffffff”]device[/ultimate_modal][/vc_column_inner][/vc_row_inner][/vc_column][/vc_row][vc_row][vc_column][vc_separator color=”custom” gap=”tall” gradient=”yes”][vc_custom_heading text=”With Form” font_container=”tag:h4|text_align:left” use_theme_fonts=”yes”][ultimate_modal btn_size=”md” btn_bg_color=”#0088cc” modal_on_align=”left” btn_text=”Launch Form Modal” modal_style=”overlay-zoomin” overlay_bg_opacity=”80″ modal_border_style=”solid” modal_border_width=”1″ modal_border_color=”” modal_border_radius=”6″ el_class=”clearfix” btn_txt_color=”#ffffff”][contact-form-7 id=”43″ title=”Contact Form – Basic”][/ultimate_modal][/vc_column][/vc_row][vc_row][vc_column][vc_separator color=”custom” gap=”tall” gradient=”yes”][vc_custom_heading text=”With Video” font_container=”tag:h4|text_align:left” use_theme_fonts=”yes”][ultimate_modal modal_title=”Vimeo Embed” modal_contain=”ult-vimeo” btn_size=”md” btn_bg_color=”#0088cc” modal_on_align=”left” btn_text=”Launch Video Modal” modal_style=”overlay-zoomin” overlay_bg_opacity=”80″ modal_border_style=”solid” modal_border_width=”1″ modal_border_color=”” modal_border_radius=”6″ el_class=”clearfix” btn_txt_color=”#ffffff”][/ultimate_modal][/vc_column][/vc_row][vc_row][vc_column][vc_separator color=”custom” gap=”tall” gradient=”yes”][vc_custom_heading text=”With Google Map” font_container=”tag:h4|text_align:left” use_theme_fonts=”yes”][ultimate_modal modal_title=”Google Maps” btn_size=”md” btn_bg_color=”#0088cc” modal_on_align=”left” btn_text=”Launch Google Map Modal” modal_size=”block” modal_style=”overlay-zoomin” overlay_bg_opacity=”80″ modal_border_style=”solid” modal_border_width=”1″ modal_border_color=”” modal_border_radius=”6″ el_class=”clearfix” btn_txt_color=”#ffffff”][/ultimate_modal][/vc_column][/vc_row][vc_row][vc_column][vc_separator color=”custom” gap=”tall” gradient=”yes”][vc_custom_heading text=”Display on Image” font_container=”tag:h4|text_align:left” use_theme_fonts=”yes”][ultimate_modal modal_title=”Google Maps” modal_on=”image” btn_img=”id^72|url^http://sw-themes.com/porto_dummy/wp-content/uploads/2016/06/pin.png|caption^null|alt^null|title^pin|description^null” modal_on_align=”left” modal_size=”block” modal_style=”overlay-zoomin” overlay_bg_opacity=”80″ modal_border_style=”solid” modal_border_width=”1″ modal_border_color=”” modal_border_radius=”6″ el_class=”clearfix”][/ultimate_modal][/vc_column][/vc_row][vc_row][vc_column][vc_separator color=”custom” gap=”tall” gradient=”yes”][vc_custom_heading text=”Display on Text” font_container=”tag:h4|text_align:left” use_theme_fonts=”yes”][ultimate_modal modal_title=”Launch Modal on Text” modal_on=”text” modal_on_align=”left” read_text=”Launch Modal on Text” modal_style=”overlay-zoomin” overlay_bg_opacity=”80″ modal_border_style=”solid” modal_border_width=”1″ modal_border_color=”” modal_border_radius=”6″ el_class=”clearfix” txt_color=”#0088cc”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc vehicula lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus.[/ultimate_modal][/vc_column][/vc_row]