php Archives - Michael Sunarlim https://sunarlim.com/tag/php/ Random blurbs about web development, e-commerce and technology Fri, 19 Mar 2021 20:03:49 +0000 en-US hourly 1 https://wordpress.org/?v=6.4.5 https://i0.wp.com/sunarlim.com/wp-content/uploads/2016/07/cropped-MS_Square_512x512.png?fit=32%2C32&ssl=1 php Archives - Michael Sunarlim https://sunarlim.com/tag/php/ 32 32 30613895 MailChimp Subscribe Form with PHP, jQuery and AJAX (API 3.0) https://sunarlim.com/2017/01/mailchimp-subscribe-form-php-jquery-api3/ https://sunarlim.com/2017/01/mailchimp-subscribe-form-php-jquery-api3/#comments Mon, 09 Jan 2017 06:48:18 +0000 https://sunarlim.com/?p=2591 By popular demand, I updated my code and posted it as new GitHub repository that utilizes newer MailChimp API 3.0. Please read the tutorial below to create AJAX based MailChimp subscribe form on your PHP website with a little jQuery knowledge. Original post using (older and no longer supported) MailChimp API 1.0 can be found here. What... Continue reading →

The post MailChimp Subscribe Form with PHP, jQuery and AJAX (API 3.0) appeared first on Michael Sunarlim.

]]> By popular demand, I updated my code and posted it as new GitHub repository that utilizes newer MailChimp API 3.0. Please read the tutorial below to create AJAX based MailChimp subscribe form on your PHP website with a little jQuery knowledge.

Original post using (older and no longer supported) MailChimp API 1.0 can be found here.

What this code does

  • Validate field contents
  • Pass the form submission to MailChimp and add the record to your list
  • Basic fallback method for very, very old browser or does not have JavaScript activated
  • Very customizable and easily expandable, depending on your requirements
  • jQuery and jQuery Validation plugin called from CDNJS to keep number of files to maintain at minimal

Tools/Credits

  1. jQuery
  2. jQuery Validation Plugin
  3. MailChimp API v3 PHP Wrapper

MailChimp API Key and List ID

Below we start, we need to generate public API key from your MailChimp account and also identify your list ID. If you are not sure how to retrieve those, follow these links from MailChimp Knowledge Base to retrieve your account’s API key and find your list ID.

The Form Page (index.php)

jQuery will handle the AJAX using $.post  method and jQuery Validation plugin will validate the field values including email address format.

For this example, I am including first name and last name as part of the form fields. Feel free to make adjustments as required. Although keep in mind after changing the form fields, you may also need to adjust the subscribe.php  file too.

<html>
<head>
  <title>MailChimp (API v3) Sign-Up Form</title>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.min.js"></script>
  <script type="text/javascript">
    $(document).ready(function() {
      // jQuery Validation
      $("#signup").validate({
        // if valid, post data via AJAX
        submitHandler: function(form) {
          $.post("subscribe.php", { fname: $("#fname").val(), lname: $("#lname").val(), email: $("#email").val() }, function(data) {
            $('#response').html(data);
          });
        },
        // all fields are required
        rules: {
          fname: {
            required: true
          },
          lname: {
            required: true
          },
          email: {
            required: true,
            email: true
          }
        }
      });
    });
  </script>
</head>

<body>
  <div id="wrapper">
    <form id="signup" class="formee" action="subscribe.php" method="post">
      <fieldset>
        <legend>Sign Up</legend>
        <div>
          <label for="fname">First Name *</label> <input name="fname" id="fname" type="text" />
        </div>
        <div>
          <label for="lname">Last Name *</label> <input name="lname" id="lname" type="text" />
        </div>
        <div>
          <label for="email">Email Address *</label> <input name="email" id="email" type="text" />
        </div>
        <div>
          <input class="right inputnew" type="submit" title="Send" value="Send" />
        </div>
      </fieldset>
    </form>
    <div id="response"></div>
  </div>
</body>
</html>

Form Processor (subscribe.php)

I try to include as much comment as possible to make the code self explanatory.

<?php

  // Put your MailChimp API and List ID hehe
  $api_key = 'ENTER_YOUR_API_KEY_HERE';
  $list_id = 'ENTER_YOUR_LIST_ID_HERE';

  // Let's start by including the MailChimp API wrapper
  include('./inc/MailChimp.php');
  // Then call/use the class
  use \DrewM\MailChimp\MailChimp;
  $MailChimp = new MailChimp($api_key);

  // Submit subscriber data to MailChimp
  // For parameters doc, refer to: http://developer.mailchimp.com/documentation/mailchimp/reference/lists/members/
  // For wrapper's doc, visit: https://github.com/drewm/mailchimp-api
  $result = $MailChimp->post("lists/$list_id/members", [
              'email_address' => $_POST["email"],
              'merge_fields'  => ['FNAME'=>$_POST["fname"], 'LNAME'=>$_POST["lname"]],
              'status'        => 'subscribed',
            ]);

  if ($MailChimp->success()) {
    // Success message
    echo "<h4>Thank you, you have been added to our mailing list.</h4>";
  } else {
    // Display error
    echo $MailChimp->getLastError();
    // Alternatively you can use a generic error message like:
    // echo "<h4>Please try again.</h4>";
  }
?>

Download

Click here to download the basic files to create MailChimp subscribe form on your website. Alternatively, you can also visit the GitHub repository.

Coming Soon Templates

The MailChimp subscribe form example only includes basic HTML page. If you are thinking of using it for your upcoming site, and you have limited resources to create the page design, check out my list of 5 Clean and Free Coming Soon Page Templates and Coming Soon & Under Construction Templates on ThemeForest.

The post MailChimp Subscribe Form with PHP, jQuery and AJAX (API 3.0) appeared first on Michael Sunarlim.

]]> https://sunarlim.com/2017/01/mailchimp-subscribe-form-php-jquery-api3/feed/ 38 2591 Latest project: House of Kooser https://sunarlim.com/2015/08/latest-project-house-of-kooser/ https://sunarlim.com/2015/08/latest-project-house-of-kooser/#respond Fri, 14 Aug 2015 05:43:15 +0000 https://sunarlim.com/?p=1523 It had been a while since I worked on fully customized website without using a pre-built templates. Doing House of Kooser's new website has been a refreshing experience. While it certainly took more time, there is this different level of satisfaction once you see up and running.

The post Latest project: House of Kooser appeared first on Michael Sunarlim.

]]> It had been a while since I fully worked on a customized website without using pre-built templates. Doing House of Kooser’s new website has been a refreshing experience. While it certainly took more time, there is this different level of satisfaction once you see it up and running.

On top of it, the site is integrated with the always awesome Kirby CMS.

Check it out at houseofkooser.com

The post Latest project: House of Kooser appeared first on Michael Sunarlim.

]]> https://sunarlim.com/2015/08/latest-project-house-of-kooser/feed/ 0 1523 Ready-to-use MailChimp PHP integration scripts https://sunarlim.com/2015/01/ready-use-mailchimp-php-integration-scripts/ https://sunarlim.com/2015/01/ready-use-mailchimp-php-integration-scripts/#respond Tue, 06 Jan 2015 08:00:33 +0000 https://sunarlim.com/?p=1336 I have shared a simple tutorial to integrate your web page with MailChimp subscription API. It is intended to give the most basic direction and then you can expand the design and functionalities to your preference. Some of you however might prefer to use a more “plug and play” approach. Therefore I decided to list... Continue reading →

The post Ready-to-use MailChimp PHP integration scripts appeared first on Michael Sunarlim.

]]> I have shared a simple tutorial to integrate your web page with MailChimp subscription API. It is intended to give the most basic direction and then you can expand the design and functionalities to your preference. Some of you however might prefer to use a more “plug and play” approach. Therefore I decided to list a number of (paid) scripts that would allow you to add good looking MailChimp PHP integration with minimal time required. These are not free, but definitely worth to save hours of your productive time.

DooMailChimp Modal Subscribe

DooMailChimp Modal Subscribe
Let’s start with the most simple but very effective approach. DooMailChimp allows you to add a simple button or link which when clicked will trigger a form modal box that connects to MailChimp upon submission.

MailChimp Subscribe Form

MailChimp Subscribe Form
Instead of using modal box, this script can be embedded using iframe so it stays on your web page. A good idea if you really want to draw more attention from your site’s visitors. The cool thing is they can sign up using Facebook, Hotmail, Google, LinkedIn aside from entering their email address manually.

Contact Form Generator

590x300-cfg-17
If you need more than a simple subscribe form but a complete contact form instead, this is a great form generator to make it a snap. With complete MailChimp and Aweber integration, you can create multiple forms on multiple projects in a breeze. You would still need to play with the styles though to really get the look that you prefer.

Layered Popups

Layered Popups
Another way, and probably the most effective, to collect your visitors’ email addresses is by incorporating automatic popup. This script will do that for you with integration with almost every popular email service such as MailChimp, GetResponse, iContact, Campaign Monitor, AWeber, Mad Mimi, Benchmark, ActiveCampaign, Interspire and Sendy.

Remember, getting new subscribers is only the first step. It is more important to actually send them engaging emails and make them happy with their decision to sign up in the first place.

The post Ready-to-use MailChimp PHP integration scripts appeared first on Michael Sunarlim.

]]> https://sunarlim.com/2015/01/ready-use-mailchimp-php-integration-scripts/feed/ 0 1336 When to Use Flat-File CMS? https://sunarlim.com/2014/05/use-flat-file-cms/ https://sunarlim.com/2014/05/use-flat-file-cms/#respond Wed, 07 May 2014 02:53:05 +0000 https://sunarlim.com/?p=1027 I have written simple comparison of Flat File CMS. Last year I also wrote about choosing ProcessWire over WordPress, while at the same time I still use WordPress to power my blog. Obviously I do not like to stick with one CMS for all of my projects. I believe you need to understand the scope... Continue reading →

The post When to Use Flat-File CMS? appeared first on Michael Sunarlim.

]]> I have written simple comparison of Flat File CMS. Last year I also wrote about choosing ProcessWire over WordPress, while at the same time I still use WordPress to power my blog. Obviously I do not like to stick with one CMS for all of my projects. I believe you need to understand the scope of a project and requirements to be able to select the best system to give the best result for your client’s satisfaction and yourself.

Below are my thoughts of when to consider of using flat-file based CMS.

Simple website

The website you are building has simple layout with mostly text content. No image gallery, advanced search function, exclusive content, etc. Generally, you do not want to spend half of the development time only to initially set the basic configurations of (more advanced) DB-based CMS.

You or your client is not expecting to keep on expanding the site’s functionality

This is always a hard call as you cannot really tell. One of the great advantage for using WordPress, ProcessWire, or even custom develop your CMS using a framework like CodeIgniter is the abundance list of plugins and extensions. As flat-file CMS is a relatively new trend, the supporting community is still growing and may take longer for a plugin to some popular service to be available for easy integration.

You are working on different servers and need the content to be consistent

Everyone has experienced this no doubt. You work on WordPress-based site on your local server, upload it to staging server to preview, made some content changes based on client’s feedback and frustrated in how to synced it back without having to modify the configuration settings. This becomes easier with flat-file CMS as you can copy the content files over FTP. Better yet, you can set up a repository and have all changes automatically synced.

The user only wants to manage content

Most advanced CMS has become so advanced, its interface becomes more complex and has longer learning curve to use. It is easy for non-tech users to mess with the settings. If the flat-file CMS has an UI, mostly it is only focused to manage the content and minimize the possibility of messing the config.

Your user knows FTP, but not MySQL

Trust me, more end users are familiar with FTP and you realized before. Sometimes they want to be able to login to their FTP and download its content for backup. In case of catastrophe, they will have the security that they can just upload everything and have the website back to operations.

You initially do not need a CMS

Last but not least, it might be good to integrate your static site with flat-file CMS. You may not plan to update it that often and you know HTML very well, but it is always nice to have a more human-friendly format. If this is a client’s site and not a requirement, they will be happy to be given this “bonus” just by spending an extra couple of hours.

For bottom note, I do not mean to highlight issues of DB-based CMS. They have been serving their purposes wonderfully. As a web developer, it is good to have more options available than ever to select a CMS that serves your specifications best.

The post When to Use Flat-File CMS? appeared first on Michael Sunarlim.

]]> https://sunarlim.com/2014/05/use-flat-file-cms/feed/ 0 1027 MailChimp Subscribe Form with PHP, jQuery and AJAX https://sunarlim.com/2014/04/mailchimp-sign-form-php-jquery-ajax/ https://sunarlim.com/2014/04/mailchimp-sign-form-php-jquery-ajax/#comments Mon, 28 Apr 2014 10:18:26 +0000 https://sunarlim.com/?p=1008 I am pretty sure I have mentioned somewhere in this blog or tweets of how I love MailChimp or and would recommend it for any business wanting to untap their email marketing potential. You can start with zero investment and only start paying when you are completely confident it is very worthy. MailChimp provides a... Continue reading →

The post MailChimp Subscribe Form with PHP, jQuery and AJAX appeared first on Michael Sunarlim.

]]> I am pretty sure I have mentioned somewhere in this blog or tweets of how I love MailChimp or and would recommend it for any business wanting to untap their email marketing potential. You can start with zero investment and only start paying when you are completely confident it is very worthy.

MailChimp provides a good tool to generate your custom sign up form which will serve most requirements well. Some customers however, want a fully custom form or integrate it with existing template they already own. Today I am going to share a quick tutorial in how to integrate HTML form with MailChimp API using PHP and jQuery.

MailChimp Subscribe Form Features

What will it do?

  • Validate field contents
  • Pass the form submission to MailChimp and add the record to your list
  • Basic fallback method for very, very old browser that does not have JavaScript activated
  • Five minutes setup

Tools/Credits

  1. jQuery
  2. jQuery Validation Plugin
  3. MailChimp PHP API Class

The Form Page (index.php)

jQuery will handle the AJAX using $.post method and jQuery Validation plugin will validate the field values including email address format.

<html>
<head>
  <title>MailChimp Sign-Up Form</title>
  <script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
  <script type="text/javascript" src="js/jquery.validate.min.js"></script>
  <script type="text/javascript">
    $(document).ready(function() {
      // jQuery Validation
      $("#signup").validate({
        // if valid, post data via AJAX
        submitHandler: function(form) {
          $.post("subscribe.php", { fname: $("#fname").val(), lname: $("#lname").val(), email: $("#email").val() }, function(data) {
            $('#response').html(data);
          });
        },
        // all fields are required
        rules: {
          fname: {
            required: true
          },
          lname: {
            required: true
          },
          email: {
            required: true,
            email: true
          }
        }
      });
    });
  </script>
</head>

<body>
  <div id="wrapper">
    <form id="signup" class="formee" action="subscribe.php" method="post">
      <fieldset>
        <legend>Sign Up</legend>
        <div>
          <label for="fname">First Name *</label> <input name="fname" id="fname" type="text" />
        </div>
        <div>
          <label for="lname">Last Name *</label> <input name="lname" id="lname" type="text" />
        </div>
        <div>
          <label for="email">Email Address *</label> <input name="email" id="email" type="text" />
        </div>
        <div>
          <input class="right inputnew" type="submit" title="Send" value="Send" />
        </div>
      </fieldset>
    </form>
    <div id="response"></div>
  </div>
</body>
</html>

Form Processor (subscribe.php)

Our form will connect to MailChimp with the help of MCAPI.class.php. Please make sure you have generated the API key of your account and copied your list ID. MailChimp’s excellent knowledge base provides the instructions in how to retrieve your account’s API key and find your list ID.

<?php
  require_once 'inc/MCAPI.class.php';
  $api = new MCAPI('ENTER_YOUR_API_KEY_HERE');
  $merge_vars = array('FNAME'=>$_POST["fname"], 'LNAME'=>$_POST["lname"]);

  // Submit subscriber data to MailChimp
  // For parameters doc, refer to: http://apidocs.mailchimp.com/api/1.3/listsubscribe.func.php
  $retval = $api->listSubscribe( 'ENTER_YOUR_LIST_ID_HERE', $_POST["email"], $merge_vars, 'html', false, true );

  if ($api->errorCode){
    echo "<h4>Please try again.</h4>";
  } else {
    echo "<h4>Thank you, you have been added to our mailing list.</h4>";
  }
?>

That’s it! You can now check on your web server with a few tests and see if they are captured in your MailChimp list.

Download

Sample files and structure of this tutorial can be downloaded here. Please share this post if you find it useful using social media buttons below.

Coming Soon Templates

My files only include a basic HTML page. If you are thinking of using it for your upcoming site, and you have limited resources to create the page design, check out my list of 5 Clean and Free Coming Soon Page Templates and Coming Soon & Under Construction Templates on ThemeForest.

UPDATE (January 9, 2017)

I have published updated version of this tutorial to make use of MailChimp’s newer API 3.0. Please follow the link to read how to create MailChimp Subscribe Form with PHP, jQuery and AJAX (API 3.0).

The post MailChimp Subscribe Form with PHP, jQuery and AJAX appeared first on Michael Sunarlim.

]]> https://sunarlim.com/2014/04/mailchimp-sign-form-php-jquery-ajax/feed/ 127 1008 Flat File CMS Comparison https://sunarlim.com/2014/03/flat-file-cms-comparison/ https://sunarlim.com/2014/03/flat-file-cms-comparison/#comments Fri, 07 Mar 2014 10:09:39 +0000 https://sunarlim.com/?p=953 Some developers claim 2014 will be the year of Flat File (or Non-Database) CMS. Personally I do not believe it will replace database-powered CMS anytime soon. To me they have different target users and main functions. If you are comparing of building a custom CMS vs using one of these CMS then it makes sense,... Continue reading →

The post Flat File CMS Comparison appeared first on Michael Sunarlim.

]]> Some developers claim 2014 will be the year of Flat File (or Non-Database) CMS. Personally I do not believe it will replace database-powered CMS anytime soon. To me they have different target users and main functions. If you are comparing of building a custom CMS vs using one of these CMS then it makes sense, but it will not replace WordPress, or Drupal, even though it always surprises me that many people still like using Joomla.

What is flat file CMS?

In very short sentence, as the phrase implies: CMS that queries its data from a text file instead of database like MySQL. Typically, flat-file CMS also has leaner structure compared to sometimes bloated fully-featured CMS. This allows you to focus the customization on the content management, instead of features that are not absolutely needed just because other sites have them.

Advantages

  • Installation can be done only with an FTP access
  • Easier to sync content when developing between development/local and production servers
  • Fast, because no queries involved
  • Lightweight, smaller total size
  • One less password to create or remember (your DB)

Flat file CMS is not a new thing. There are dozens of options out there for you to choose. I have hand-picked few that I like most and compare them. Hopefully by sharing this, it will help you in deciding which that would work best for your projects.

Statamic Kirby Monstra Pico Pulse
Web server requirement PHP 5.3.6+ PHP 5.3+ PHP 5.2.3+ PHP 5.2.4+ PHP 5.3+
GUI editor YES YES,
as separate module		 YES NO YES
Native content syntax Markdown, Textile, HTML Markdown HTML Markdown HTML or Markdown
Open Source NO NO YES (GNU general public license) YES (MIT licence) NO
Number of available add-ons/plugins* ~25 ~68 ~25 ~12 ~6
Templating engine – – – Twig –
Support Forums, Tickets Forums, Direct Email Forums, Bugtracker (GitHub) Bugtracker (GitHub) Forums, Tickets
License per website $29 for personal
$99 for commercial		 $19 for personal
$99 for commercial		 FREE FREE $29

* as of January 2016, based on list available on developer’s website

Which CMS to choose?

Personally I want to get an opportunity to put my hands on Statamic. It is the most expensive, $99 for one commercial website, but it has very simple and nice control panel which is very important. For developers who do not need a control panel, Pico is a very interesting option.

Update May 15, 2014:
I contacted Statamic Team to consult about licensing for a tiny project I was developing. I have not received a reply to this day. I ended up giving Kirby a try because it offered to download the code freely for trial. So far I am liking it and since the license costs less than half of Statamic’s, it is becoming a favorable selection for future projects.

Update October 8, 2014:
With the release of Kirby 2, the team also offer a new pricing model: $19 for Personal license (non-commercial site) and $99 for Pro licence (commercial site). This puts it very similar to the pricing from Statamic. It will be interesting to see which one will be more popular in the near future.

Update January 1, 2016:
Added PulseCMS into comparison table.

The post Flat File CMS Comparison appeared first on Michael Sunarlim.

]]> https://sunarlim.com/2014/03/flat-file-cms-comparison/feed/ 42 953 Why choose ProcessWire over WordPress? https://sunarlim.com/2013/02/why-choose-processwire-over-wordpress/ https://sunarlim.com/2013/02/why-choose-processwire-over-wordpress/#comments Sat, 02 Feb 2013 11:22:41 +0000 https://sunarlim.com/?p=482 Let’s admit it, WordPress is the most popular blogging platform ever. I use it to power this blog. Aside from security issues, which always haunt any popular system/app/platform, there are very few reasons not to love it. It is actively maintained, supported by huge and dedicated community, great UI, and the list goes on and... Continue reading →

The post Why choose ProcessWire over WordPress? appeared first on Michael Sunarlim.

]]> Let’s admit it, WordPress is the most popular blogging platform ever. I use it to power this blog. Aside from security issues, which always haunt any popular system/app/platform, there are very few reasons not to love it. It is actively maintained, supported by huge and dedicated community, great UI, and the list goes on and on.

When it comes to using it as CMS though, I always struggle to justify it as the way to go. Despite its evolution in complying the demand, it is still far from perfect. In more than one occasion, client would come to me with very specific request to use WordPress to manage their website. If the website needs to come with a blog, then yes it is a good option, but sometimes it is only a company, personal or product profile which content needs to be manageable from CMS.

For years, I had been trying to find the right platform/framework with just enough features and functions to allow me to build a website without having to take more time on integrating it with the CMS. Then I found ProcessWire. Learning about for ProcessWire works was not the easiest, but all the time used has been very well paid off after a couple of projects built using it.

What makes ProcessWire a better CMS than WordPress? For starter, you can define your own fields to be used throughout the system. No plugins or custom functions required, which have always been a real turn off for me. I can list all the goods and bads between these platforms, but in short with ProcessWire you can set it up to go with your site’s structure, while with WordPress I feel it is more about adjusting your site to fit as a template.

So, why should you use it?

  1. You prefer to build your own CMS but also knows the pain in making one
  2. You hate the idea of installing half a dozen plugins to create that simple customization
  3. You are not that good in making custom functions in WordPress
  4. You prefer not to have all the long navigation items on the left side of the admin panel
  5. You want to it to be super easy to change the template of the admin
  6. You need to manipulate lots of images and they have to be easy to manage
  7. You want to make sure the user will enter the right input into the fields
  8. You do not need to change the front-end template (theme) that often or ever; update: I was referring to WordPress’ manage theme functions which is very rarely used
  9. You like to explore new platforms
  10. You have worked on a PHP framework and love it

No platform is perfect by all means, and I am pretty sure ProcessWire is not the only one that was built on the idea to make as flexible CMS as possible. But for me it is the first one that really clicked, and it is free! So, kudos to Ryan Cramer and thank you for building and constantly improving this great platform.

The post Why choose ProcessWire over WordPress? appeared first on Michael Sunarlim.

]]> https://sunarlim.com/2013/02/why-choose-processwire-over-wordpress/feed/ 9 482