123RF Value Added Reseller – Search & Display Search Results (Part 2 of 5)

 

Searching for images on 123RF can be made very easily. All we need is an APIkey.

About the Search API and the possibilities

123RF’s Search API (123rf.images.search) supports the following arguments:

searchAPI

As you can see from the table above, the API does a good job at allowing you to really dig deep into our content library. However, to keep things simple, we are going to use just a few of these possible arguments in our example.

Step 1: Prepare the Search Form

The example will concentrate on just a few of the possibilities highlighted above:

  • keyword is a must
  • order_by allows us to sort the results returned
  • perpage gives us some control over how many results will be returned when we search
  • media allows us to filter through some of the content types that we can search on 123RF.com

The HTML for the form is very simple:

<form method="get">

Keyword: <input type="text" name="keywords" size="35">
    of <select name="orderby">
      <option value="most_downloaded">Most Downloaded</option>
      <option value="latest">Latest Images</option>
      <option value="random">Random Order</option>
      </select>

      Show <select name="perpage">
      <option value="20">20 items</option>
      <option value="40">40 items</option>
      <option value="60">60 items</option>
      <option value="80">80 items</option>
      <option value="100">100 items</option>
    </select>

    Media <select name="media_type">
      <option value="all">All Types</option>
      <option value="0">Photos</option>
      <option value="1">Vectors</option>
      <option value="4">Editorial</option>
      </select>
  <input type="submit" value="Search!">

</form>

Step 2: Processing the Parameters Passed to the Script and Constructing the API call

Now, we need to start constructing the URL that will be used in the API call. This is done by appending the results of the form into the URL string directly. No special URLencode function is required at this point.

<?php

// constants

$apikey = "fd022e333ae6ac4aa56ed1c3221cfb2c";

// extract arguments from $_GET

$keyword = $_GET['keywords'];
$perpage = $_GET['perpage'];
$orderby = $_GET['orderby'];
$media_type = $_GET['media_type'];

// for moving to another page

$page = $_GET['page'];

// construct the URL required for the API call

$theURL = "http://api.123rf.com/rest/?method=123rf.images.search&apikey=".$apikey.
          "&keyword=".$keyword.
          "&perpage=".$perpage.
          "&orderby=".$orderby.
          "&media_type=".$media_type.
          "&page=".$page;
?>

Step 3 : Execute the API call and then display the results accordingly

Here we execute the API call and then we can display the thumbnails associated with it. To display the thumbnail, please refer to the documentation here: Thumbnail, but it’s actually very simple ; all URL to thumbnails take on this structure:
http://images.assetsdelivery.com/thumbnails/[contributorid]/[folder]/[filename].jpg

<?php

// Execute the API call and store into a variable

$contents = file_get_contents($theURL);

// Declare this as a new SimpleXmlElement

$xml = new SimpleXmlElement($contents);

// Store the image results returned into an array

$imgs = $xml->images->image;

// Step through the array and output the results

foreach ($imgs as $item){

  // prepare the thumbnail URL
  $thumbnail = "http://images.assetsdelivery.com/thumbnails/$item[contributorid]/$item[folder]/$item[filename].jpg";

  // output the result as the array is stepped through
  echo <<< ___

  <div style="float: left; margin: 10px 5px; height: 200px; width: 200px; text-align: center; vertical-align: bottom;">
  <div>
  <a href="#"><img src="$thumbnail" style="padding: 4px; border: #888888 solid 1px; background-color: #FFFFFF" alt="$item[description]"></a><br>
      $item[id] &copy; $item[contributorid]
  </div>
  </div>
___;

}

?>

Now, wasn’t that easy? You can enhance your script with code that makes the user experience better, but the above is the absolute minimum to get things working. Visit a demo of the 123RF Search API in action, or download the script above and experiment with it. Please note, you will have to insert your own API key into the script to get it to work!

Recommend this story :
Back to Top ↑

Leave a Reply

Your email address will not be published. Required fields are marked *

Show Buttons
Hide Buttons