Simple way to create popup confirmation in gravity form

23/12/2019 07:41 16604

in file functions.php, Guys input below code:

add_filter( 'gform_confirmation', 'mrtung_custom_confirmation', 10, 4 );
function mrtung_custom_confirmation( $confirmation, $form, $entry, $ajax ) {
	add_filter( 'wp_footer', 'mrtung_custom_confirmation_popup');
    return '<div class="mrtung-gform-notification-out" ><div class="mrtung-gform-notification-in" >' . $confirmation . '<a class="button-close" href="#">X</a></div></div>';
}
function mrtung_custom_confirmation_popup(){
	?>

    <script type="text/javascript">
	jQuery(function($){
			$(document).on('click',".mrtung-gform-notification-out .button-close",function() {
				$(".mrtung-gform-notification-out, .mrtung-gform-notification-in").fadeOut("normal", function() {
					$(this).remove();
				});
			});
	});
		</script>
        <style>
		
.mrtung-gform-notification-out {
	overflow: hidden;
	position: fixed;
	left: 0;
	display: flex;
	right: 0;
	bottom: 0;
	height: 100vh;
	background: rgba(0,0,0,.5);
	z-index: 999999999999999;
}
.mrtung-gform-notification-in {
    display: block;
    overflow: hidden;
    position: relative;
    width: 100%;
    max-width: 520px;
    margin: auto;
    background: #fff;
    /* margin-top: 7%; */
    border-radius: 5px;
    padding: 20px;
    text-align: center;
}
.mrtung-gform-notification-in a.button-close {
    position: absolute;
    z-index: 9999;
    top: 6px;
    right: 19px;
}
</style>
    <?php
}

add_filter( 'gform_confirmation', 'mrtung_custom_confirmation', 10, 4 );

function mrtung_custom_confirmation( $confirmation, $form, $entry, $ajax ) {

add_filter( 'wp_footer', 'mrtung_custom_confirmation_popup');

return '<div class="mrtung-gform-notification-out" ><div class="mrtung-gform-notification-in" >' . $confirmation . '<a class="button-close" href="#">X</a></div></div>';

}

function mrtung_custom_confirmation_popup(){

jQuery(function($){

$(document).on('click',".mrtung-gform-notification-out .button-close",function() {

$(".mrtung-gform-notification-out, .mrtung-gform-notification-in").fadeOut("normal", function() {

$(this).remove();

});

</script>

<style>

.mrtung-gform-notification-out {

overflow: hidden;

position: fixed;

left: 0;

display: flex;

right: 0;

bottom: 0;

height: 100vh;

background: rgba(0,0,0,.5);

z-index: 999999999999999;

}

.mrtung-gform-notification-in {

display: block;

overflow: hidden;

position: relative;

width: 100%;

max-width: 520px;

margin: auto;

background: #fff;

/* margin-top: 7%; */

border-radius: 5px;

padding: 20px;

text-align: center;

}

.mrtung-gform-notification-in a.button-close {

position: absolute;

z-index: 9999;

top: 6px;

right: 19px;

}

</style>

<?php

}

5/5 (13 Đánh giá)

Gửi Phản Hồi

0 Bình Luận

Simple way to create popup confirmation in gravity form

có thể bạn cần xem:

Đăng ký nhận bài viết mới

Hướng dẫn thiết kế theme

Thiết kế theme wordpress phần 8

Thiết kế theme wordpress phần 7

Thiết kế theme wordpress phần 6

Thiết kế theme wordpress phần 5

Thiết kế theme wordpress-phần 4

Các functions thường dùng

Function xử lý upload to media wordpress

Function get ip address

Thay thế file_get_contents

Code tích hợp acf vào theme và plugin

Một số function thường dùng khi làm theme wordpress (some functions popular for work do theme worpdress)