Tag Archive: php

Add A Time Input to Contact Form 7 Without A Plugin

August 31, 2020

The Contact Form 7 plugin does not inherently support the time attribute for an input field. As of version 5.2, you can use the native HTML5 date input field (and all of the UX that browsers provide that come along with it) but you cannot set up a time field with the same features.  I prefer using the HTML5 date and time fields for these input configurations rather than a Javascript library.  Though not fully supported, it still does have a considerable amount of browser compatibility and I believe that is the way things are headed.  It’s very likely that the plugin will begin to support and include this field type in the future, but for now, let’s look at how to include this in our form.

This post assumes you have some knowledge about Contact Form 7, some coding skills, and knowledge of your WordPress theme.

Step 1: Add A Field to your Form

We are going to include the field we would like to make a time input field type in our form.  You would perform this the same way you normally do for a text field, but in this case, you would like to give it an ID.  In this case, it will be time-field .  I also gave the field a name of my-time-field  which I will reference later.

Step 2: Change The Property Type With Javascript

Now that we have our field, we are going to use jQuery to change the property type of the input field based on its ID.  This is the same ID you provided in the prior step.

Take the code below and place it wherever you place your theme’s custom Javascript.  This could be in your theme settings or in a file in your theme that is called.

You would like this to occur on $(document).ready()  to once the form is called, you will immediately switch the input field from text  to time  and now the browser will respond accordingly.

This would be good enough for some, however, when Contact Form 7 sends the form submission via email, it will have that field value as a long string.  Something like “YYYYDDHH” and that may not necessarily be legible for your client/user to receive.

That leads us to our next step.

Step 3: Modify the Time Value Before Sending

Here we would like to change the returned value of our new time input field to something legible that a user can understand and interpret.  Since it is returning as a big long string, we can use a little PHP and tap into Contact Form 7’s hooks to modify the value before it is sent in an email.

Place the following snippet in the functions.php file of your theme:

Let’s discuss what is happening here.  The wpcf7_posted_data  filter will allow you to tap into the returned values of your form before it is sent.  In our case, we are looking for a field in the array with the name my-time-field .  Once we have that value, let’s use the PHP functions strtotime()  to parse the value as a time value and then use the date()  function to manipulate it into a format we’d like.  In my case, it will return as the 12-hour with AM/PM meridiem format.

In the email, the recipient will see the time as something like “8:23 AM”.

Conclusion

I hope this helps get you on the right track towards including a time field type in your forms going forward.  Though I find it very likely there will be more support in the plugin going forward, I believe this method is sufficient in getting that accomplished.  Please leave any questions or concerns in the the comments below.

Happy Coding!

Working with the Campaign Monitor API: Retrieving A List of Subscribers with PHP

February 21, 2020

I’ve used Campaign Monitor for years as an email marketing tool.  Recently, I had to work with PHP and the Campaign Monitor API to retrieve the  subscribers from an email list for a specific client.  Luckily, Campaign Monitor has made their API incredibly easy to work with while trying to accomplish some of these tasks and we are going to dive into how I accomplished it.

My objective was to retrieve a list of subscribers from an account, detect the total amount of subscribers on that list, and hide or show a sign up form based on whether the threshold of maximum subscribers was met.

Step 1: Using an API Wrapper Library

There are a multitude of languages and API Wrappers you can use to query and update the Campaign Monitor API, but since the site I was implementing this on was PHP, that is the language we will be using today.

You can explore their entire Campaign Monitor API PHP Library called createsend here.  You will need to include this library in your project in order to execute a lot of the tasks needed to work with your Campaign Monitor account.  I downloaded the library and included it in my WordPress theme template.  There are many other ways to include it and you can explore their documentation on how to do so.

Step 2: Get an API Key

Like many APIs, you will need authentication to work with them.  I found that most tasks for viewing and retrieving data only required the simpler API key so that’s the route we will be going today.  In order to manipulate the accounts data (like adding a new email to a list), you will likely need OAuth credentials.  For today’s example, we are looking to just retrieve the list of subscribers.  Let’s get an API Key!

Log into your Campaign Monitor account.  Go to Account Settings and then click on API Keys on the right hand side.  That should bring you to a page like this:

This has the list of all of your clients, their API keys, and some options to edit them.  It also has an Administrator API key, although, it is not recommended to use this when working on one specific client.  You are going to want to find your client and get their API Key.

Note: This is also how you find the Client ID.  In  some cases, you will need this info as well, but not for this example.

Step 3: Get a List ID

The second part you will need is the List ID.  When working with specific list of subscribers, you will need to find the specific List ID which identifies the group you want to work with.

In order to find your list ID, go to the Client you are working with, click on Lists & Subscribers, click on the list you would like to work with, and hit Change Name/Type.

Though you aren’t seeking to change the name, this will provide the API List ID that you are looking for.  It appears at the bottom of the settings like below:

Copy and save that List ID value.

Step 4: Prepare your Library and Code

As I mentioned before, this example pertains to obtaining a list of subscribers, figuring out how many there are, and showing a form whether or not we have exceeded that threshold.  It is in WordPress, so you would want to place the createsend library in your theme directory and call it like such:

If you weren’t using WordPress, you would just use the standard PHP function:

This, of course, is all relative to where you place your library, how you place your library, etc…. but the important thing is you are including it and establishing your API key by placing it where I have specified in the code.

Step 5: Use the Library to Call Active Subscribers from A List

Now the fun stuff.  Below is a code snippet to request the active subscribers from a list you specify:

Ok, this is a big chunk, so let’s break down what’s happening here.

First, you are specifying the wrapper by identifying the list you want to query.  You got the List ID as explained earlier.

Next, we are using the function get_active_subscribers  from your library to request them from your list how you see fit.  It takes several arguments, so it’s very important to plan and determine how those subscribers should be queried.  I placed the arguments in the comments below and the createsend documentation has a great amount of further explanation on this.  As an example, I didn’t set a time limit, I wanted the first 1-500, ordered by email, and ascending.  The Consent to Track is dependent on your list settings.

After we query that list, we are asking: Was this successful?  If so, let’s store the response as a variable, determine how many active subscribers we got, and if it’s above 500 (an arbitrary number for the sake of example), then hide the form!  If not, show the form!

For some purposes, you will want to loop through the result to list names, emails, etc.  Everything stored in the $response  variable will have what you need!  You can iterate through the array like so:

Conclusion and Full Code Snippet

The Campaign Monitor API is very robust, regardless of what language or method you are using to work with it. Hopefully, this example served as a helpful tool in working with your Campaign Monitor clients and you can help build upon this example for your needs.  Happy Coding!

Embed A Tumblr Feed In WordPress

January 19, 2017

Below is an example showing how to embed multiple Tumblr posts as a feed into a WordPress site.  You will need a little coding experience with PHP and access to your WordPress theme files.  It is also required to have a Tumblr API key.

1. Get A Tumblr API key

This is required to use Tumblr’s API for requests.  In this case, we will be using it to fetch the latest posts from a Tumblr user.  You can visit here to set up an APP and retrieve your API key.

2. Set Up Your Shortcode

A shortcode is a simple WordPress snippet that you can pop into the page/post editor to place some code, make a query, or anything else you could possibly want.  Today, we are going to fetch Tumblr posts with PHP and place them in the site.

Editing the functions.php file of your WordPress theme, place this code at the bottom before the PHP end tag:

Let’s talk a little about what is happening here.

There are 3 variables you need to define at the beginning of the code:

  1. Your API key
  2. The amount of posts you want
  3. The Tumblr URL of the posts you want

The code will then fetch those posts and return them in JSON format.  In your foreach loop, you could cycle through each one of those objects in the array and pull any information you would need from each post.  In this case, I only want the post URL.

I only want the post URL because I am going to use a very handy function from WordPress to do the hard work for me.  Instead of figuring out whether each post is a link, a video, a photo, an embed, and then trying to format the HTML for each one, I will use what WordPress already provides, the oEmbed function.  That functionality takes whatever URL you paste in your WordPress text editor and then tries to find the embed code for it and place it within your content.

WordPress also provides a function to initiate this feature however you please: wp_embed_get();

So for this line of code:

we are just looping through each returned Tumblr post via JSON, and running it through the WordPress embed function wp_embed_get().

3. Place your shortcode where you want the feed

By adding the line below, you will call the function we placed in our functions.php file, and it will place it where the shortcode was used.

This shortcode can be placed anywhere on a page, post, or custom post type in the content editor.

You can customize a lot of the functionality to suit your needs, but hopefully this gets you started working with the Tumblr API and the many ways you can dynamically call Tumblr content on your WordPress site.

Credit

I want to credit @groovycarrot for his post describing how to first work with the Tumblr API in PHP which inspired the idea.

Get the Real URL of a Tiny URL in PHP

October 21, 2013

A while back I set up a website, songdump.com, that allows me to post Youtube videos of songs I really like. But, I’m lazy, and I wanted to use the least amount of effort to accomplish this.

I ended up setting up a If This Then That recipe for the hashtag “#songdump.” So, whenever I share a song through Twitter, IFTTT grabs the URL and through some other scripts, retrieves all the necessary info I need for that video, and posts it in WordPress (where the data is called from).

Problem is, when you share something on Twitter, it’s often a TinyURL which makes it a lot harder to retrieve info from. Luckily, we can use the PHP function “get_headers()” to accomplish this.

Tiny URL’s come in a lot of different forms, so I used this method because alternatives often had you filter based on a predetermined set of base URLs. That did me no good.

Here’s the script:

Let’s recap what’s happening line by line here –

  1. Storing our tiny URL as a variable, showing 2 examples
  2. Using the get_headers() function to retrieve the location of our URL
  3. This returns an array, and one of values in that array is our URL. It begins with “Location:” or is some cases “location:”. Feel free to use print_r($headers) function before this to learn all of get_headers() returned values
  4. The key for this value is often in different orders (which is why I provided 2 URLs as examples). We will loop through every value to see if it contains “ocation:” (because as I said, sometimes it’s uppercase, sometimes it’s lowercase) and then return that key.
  5. Once we find the right array object, we get its value and store it as a variable.
  6. Using a string replace function, we remove the actual “Location” label. I do this twice, uppercase and lowercase, because it can get returned either way in some cases.
  7. Then we print out the real URL!

Hope that helps! Happy coding!