Ajax Mailchimp Integration In WordPress Without Plugin

https://mailchi.mp/bceb8d800a0f/a043ilyyxp

https://us20.admin.mailchimp.com/account/connected-sites/app-selection/#wordpress

Connect Your Domain

us20-c4bfc8f2-99dd59ca18e94ced829d10c4e.pages.mailchi.mp

148.105.251.17

Connect Your Domain

CNAME record

Copy the following value into the CNAME record named www for hanam.work. If this record does not exist in your DNS settings, create it.CopyA record

Copy the following IP address into the A record for hanam.work. If there is already an IP address in an existing A record, replace it with the one we provide.Copy

After you’ve added the CNAME record and A record, return to this page and click Connect.

It can take up to 24 hours to complete this process. We’ll send an email to phamngoctuong1805@gmail.com when your domain is connected.

Have questions? Read our custom domain setup guide.

C:\Users\Administrator\AppData\Local\Temp\scp50812\public_html\wp-content\themes\gutener\header.php

Cái này hiện lên popup :)

<head>

	<meta charset="<?php bloginfo( 'charset' ); ?>">

	<meta name="viewport" content="width=device-width, initial-scale=1">

	<link rel="profile" href="https://gmpg.org/xfn/11">

<script id="mcjs">!function(c,h,i,m,p){m=c.createElement(h),p=c.getElementsByTagName(h)[0],m.async=1,m.src=i,p.parentNode.insertBefore(m,p)}(document,"script","https://chimpstatic.com/mcjs-connected/js/users/99dd59ca18e94ced829d10c4e/1883e478b446bccd4409f3834.js");</script>

	<?php wp_head(); ?>

</head>

Cái này hiện lên form đăng ký :) nhưng không phải là popup :)

<div id="mc_embed_signup">
<form action="https://work.us20.list-manage.com/subscribe/post?u=99dd59ca18e94ced829d10c4e&amp;id=ddf38752d8" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
    <div id="mc_embed_signup_scroll">
	<h2>Subscribe</h2>
<div class="indicates-required"><span class="asterisk">*</span> indicates required</div>
<div class="mc-field-group">
	<label for="mce-EMAIL">Email Address  <span class="asterisk">*</span>
</label>
	<input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">
</div>
<div class="mc-field-group">
	<label for="mce-FNAME">First Name </label>
	<input type="text" value="" name="FNAME" class="" id="mce-FNAME">
</div>
<div class="mc-field-group">
	<label for="mce-LNAME">Last Name </label>
	<input type="text" value="" name="LNAME" class="" id="mce-LNAME">
</div>
<div class="mc-field-group size1of2">
	<label for="mce-BIRTHDAY-month">Birthday </label>
	<div class="datefield">
		<span class="subfield monthfield"><input class="birthday " type="text" pattern="[0-9]*" value="" placeholder="MM" size="2" maxlength="2" name="BIRTHDAY[month]" id="mce-BIRTHDAY-month"></span> / 
		<span class="subfield dayfield"><input class="birthday " type="text" pattern="[0-9]*" value="" placeholder="DD" size="2" maxlength="2" name="BIRTHDAY[day]" id="mce-BIRTHDAY-day"></span> 
		<span class="small-meta nowrap">( mm / dd )</span>
	</div>
</div>	<div id="mce-responses" class="clear">
		<div class="response" id="mce-error-response" style="display:none"></div>
		<div class="response" id="mce-success-response" style="display:none"></div>
	</div>    <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
    <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_99dd59ca18e94ced829d10c4e_ddf38752d8" tabindex="-1" value=""></div>
    <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
    </div>
</form>
</div>
<script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';fnames[3]='ADDRESS';ftypes[3]='address';fnames[4]='PHONE';ftypes[4]='phone';fnames[5]='BIRTHDAY';ftypes[5]='birthday';}(jQuery));var $mcj = jQuery.noConflict(true);</script>

Bây giờ mới thực hiện mục đích chính đây :))))

assets\js\jquery.ajaxchimp.min.js

1KB

jquery.ajaxchimp.min.zip

archive

Open

C:\Users\Administrator\AppData\Local\Temp\scp13989\public_html\wp-content\themes\gutener\functions.php

// jquery-ajaxchimp
function tsh_scripts($hook) {
	wp_enqueue_script('jquery');
	wp_enqueue_script( 'jquery-ajaxchimp', get_template_directory_uri() . '/assets/js/jquery.ajaxchimp.min.js', array(), '1.2.0', false );
}
add_action('wp_enqueue_scripts', 'tsh_scripts');

Nhớ manage action này nha ;)
https://work.us20.list-manage.com/subscribe/post?u=99dd59ca18e94ced829d10c4e&id=ddf38752d8

C:\Users\Administrator\AppData\Local\Temp\scp09792\public_html\wp-content\themes\gutener\index.php

<?php

/**

 * The main template file

 *

 * This is the most generic template file in a WordPress theme

 * and one of the two required files for a theme (the other being style.css).

 * It is used to display a page when nothing more specific matches a query.

 * E.g., it puts together the home page when no home.php file exists.

 *

 * @link https://developer.wordpress.org/themes/basics/template-hierarchy/

 *

 * @package Gutener

 */



get_header();

?>

	<div id="colophon">
    <div class="widget-area">
        <div class="subscribe-content">
            <span class="sub-title"><?php esc_html_e( 'GO AT YOUR OWN PACE', 'your-domain' ); ?></span>
            <h2><?php esc_html_e( 'Subscribe to Our Newsletter', 'your-domain' ); ?></h2>
            <p><?php esc_html_e( 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.', 'your-domain' ); ?></p>

            <form class="mailchimp newsletter-form" method="post">
                <div class="subcribes">
                    <input type="email" class="input-newsletter memail" placeholder="<?php esc_attr_e( 'Enter your email address', 'your-domain' ); ?>" name="EMAIL" required>
                        <button type="submit" class="default-btn"><?php echo esc_html( 'Subscribe Now', 'your-domain' ); ?></button>
                </div>
                <p class="mchimp-errmessage" style="display: none;"></p>
                <p class="mchimp-sucmessage" style="display: none;"></p>
            </form>
        </div>
    </div>
</div>
<script>
    ;(function($){
        "use strict";
        $(document).ready(function () {
            // MAILCHIMP
            if ($(".mailchimp").length > 0) {
                $(".mailchimp").ajaxChimp({
                    callback: mailchimpCallback,
                    url: "<?php echo esc_js('https://work.us20.list-manage.com/subscribe/post?u=99dd59ca18e94ced829d10c4e&amp;id=ddf38752d8') ?>" //Replace this with your own mailchimp post URL. Don't remove the "". Just paste the url inside url
                });
            }
            if ($(".mailchimp_two").length > 0) {
                $(".mailchimp_two").ajaxChimp({
                    callback: mailchimpCallback,
                    url: "<?php echo esc_js('https://work.us20.list-manage.com/subscribe/post?u=99dd59ca18e94ced829d10c4e&amp;id=ddf38752d8') ?>" //Replace this with your own mailchimp post URL. Don't remove the "". Just paste the url inside url
                });
            }
            $(".memail").on("focus", function () {
                $(".mchimp-errmessage").fadeOut();
                $(".mchimp-sucmessage").fadeOut();
            });
            $(".memail").on("keydown", function () {
                $(".mchimp-errmessage").fadeOut();
                $(".mchimp-sucmessage").fadeOut();
            });
            $(".memail").on("click", function () {
                $(".memail").val("");
            });

            function mailchimpCallback(resp) {
                if (resp.result === "success") {
                    $(".mchimp-errmessage").html(resp.msg).fadeIn(1000);
                    $(".mchimp-sucmessage").fadeOut(500);
                } else if (resp.result === "error") {
                    $(".mchimp-errmessage").html(resp.msg).fadeIn(1000);
                }
            }
        });
    })(jQuery)
</script>

	<?php

get_footer();

PreviousajaxChimp (ok)NextHướng dẫn sử dụng Mailchimp làm email marketing (Free 100% – cập nhật 2020)

Last updated 4 years ago

Was this helpful?

<div id="mc_embed_signup"> <form action="https://work.us20.list-manage.com/subscribe/post?u=99dd59ca18e94ced829d10c4e&id=ddf38752d8" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate> <div id="mc_embed_signup_scroll"> <h2>Subscribe</h2> <div class="indicates-required"><span class="asterisk">*</span> indicates required</div> <div class="mc-field-group"> <label for="mce-EMAIL">Email Address <span class="asterisk">*</span> </label> <input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL"> </div> <div class="mc-field-group"> <label for="mce-FNAME">First Name </label> <input type="text" value="" name="FNAME" class="" id="mce-FNAME"> </div> <div class="mc-field-group"> <label for="mce-LNAME">Last Name </label> <input type="text" value="" name="LNAME" class="" id="mce-LNAME"> </div> <div class="mc-field-group size1of2"> <label for="mce-BIRTHDAY-month">Birthday </label> <div class="datefield"> <span class="subfield monthfield"><input class="birthday " type="text" pattern="[0-9]*" value="" placeholder="MM" size="2" maxlength="2" name="BIRTHDAY[month]" id="mce-BIRTHDAY-month"></span> / <span class="subfield dayfield"><input class="birthday " type="text" pattern="[0-9]*" value="" placeholder="DD" size="2" maxlength="2" name="BIRTHDAY[day]" id="mce-BIRTHDAY-day"></span> <span class="small-meta nowrap">( mm / dd )</span> </div> </div> <div id="mce-responses" class="clear"> <div class="response" id="mce-error-response" style="display:none"></div> <div class="response" id="mce-success-response" style="display:none"></div> </div>  <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_99dd59ca18e94ced829d10c4e_ddf38752d8" tabindex="-1" value=""></div> <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div> </div> </form> </div> <script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';fnames[3]='ADDRESS';ftypes[3]='address';fnames[4]='PHONE';ftypes[4]='phone';fnames[5]='BIRTHDAY';ftypes[5]='birthday';}(jQuery));var $mcj = jQuery.noConflict(true);</script>

<?php /** * The main template file * * This is the most generic template file in a WordPress theme * and one of the two required files for a theme (the other being style.css). * It is used to display a page when nothing more specific matches a query. * E.g., it puts together the home page when no home.php file exists. * * @link https://developer.wordpress.org/themes/basics/template-hierarchy/ * * @package Gutener */ get_header(); ?> <div id="colophon"> <div class="widget-area"> <div class="subscribe-content"> <span class="sub-title"><?php esc_html_e( 'GO AT YOUR OWN PACE', 'your-domain' ); ?></span> <h2><?php esc_html_e( 'Subscribe to Our Newsletter', 'your-domain' ); ?></h2> <p><?php esc_html_e( 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.', 'your-domain' ); ?></p> <form class="mailchimp newsletter-form" method="post"> <div class="subcribes"> <input type="email" class="input-newsletter memail" placeholder="<?php esc_attr_e( 'Enter your email address', 'your-domain' ); ?>" name="EMAIL" required> <button type="submit" class="default-btn"><?php echo esc_html( 'Subscribe Now', 'your-domain' ); ?></button> </div> <p class="mchimp-errmessage" style="display: none;"></p> <p class="mchimp-sucmessage" style="display: none;"></p> </form> </div> </div> </div> <script> ;(function($){ "use strict"; $(document).ready(function () { // MAILCHIMP if ($(".mailchimp").length > 0) { $(".mailchimp").ajaxChimp({ callback: mailchimpCallback, url: "<?php echo esc_js('https://work.us20.list-manage.com/subscribe/post?u=99dd59ca18e94ced829d10c4e&id=ddf38752d8') ?>" //Replace this with your own mailchimp post URL. Don't remove the "". Just paste the url inside url }); } if ($(".mailchimp_two").length > 0) { $(".mailchimp_two").ajaxChimp({ callback: mailchimpCallback, url: "<?php echo esc_js('https://work.us20.list-manage.com/subscribe/post?u=99dd59ca18e94ced829d10c4e&id=ddf38752d8') ?>" //Replace this with your own mailchimp post URL. Don't remove the "". Just paste the url inside url }); } $(".memail").on("focus", function () { $(".mchimp-errmessage").fadeOut(); $(".mchimp-sucmessage").fadeOut(); }); $(".memail").on("keydown", function () { $(".mchimp-errmessage").fadeOut(); $(".mchimp-sucmessage").fadeOut(); }); $(".memail").on("click", function () { $(".memail").val(""); }); function mailchimpCallback(resp) { if (resp.result === "success") { $(".mchimp-errmessage").html(resp.msg).fadeIn(1000); $(".mchimp-sucmessage").fadeOut(500); } else if (resp.result === "error") { $(".mchimp-errmessage").html(resp.msg).fadeIn(1000); } } }); })(jQuery) </script> <?php get_footer();