Clio 3 – PHP tutorial

This tutorial is meant to introduce Clio 3 students to PHP and to point out some of its useful features. This is by no means a full engagement with the capabilities of the language and anyone interested in learning PHP should access the documentation and other resources described below.

What is PHP?

PHP is an open source scripting language that is built for a web environment and runs on a computer server. It is easily embedded in HTML and works well with databases. For these reasons it is used across the internet and with some of the most recognizable sites (Facebook and WordPress, for instance.)

PHP got its name from creator Rasmus Lerdorf. Initially interested in tracking visits to his site, the scripts that would become a language were referred to as, “Personal Home Page tools.” These were expanded in subsequent versions (between 1994 to 2004) and the current form is known as PHP 5. Maintaining the initial acronym, PHP now refers to a “recursive acronym for… Hypertext Preprocessor“. 

Both of these are meant to emphasize that PHP is distinct in the way that it handles website data. JavaScript for instance runs in a browser (think of how we ran our code in a browser window earlier in the semester). PHP, on the other hand, is a “server-side language” meaning the files and content are processed at the server that holds them and then sent to your computer browser. Though the syntax for PHP will be similar to what we saw with JavaScript, the languages boast differences in functionality. Because PHP runs on a server, it has access to the files and content within that database. In particular, PHP works well with MYSQL as we will look at below. Further, embedding it in HTML means that regular webpages can be dynamic and do things like run data calculations from the website.

Further information available in the PHP documentation.

PHP for DH:

Jason Heppler demonstrates the functionality of PHP in his somewhat tongue-in-cheek website “What is Digital Humanities“. Each time you visit the page, a new quote is drawn from a database of definitions Heppler created (These quotes were collected from Day of DH participants between 2009-2012). Heppler provides the files for this project (his index.php and the .csv of quotes) on his github page.

The project demonstrates a significant feature of the PHP functionality:  your server will evaluate the page before it is generated in a browser. Rather than producing HTML page that contains every quote, Heppler has encoded the page to pull a quote from his database each time the page is refreshed.

How to create stuff using PHP:

Because your code needs to run off a server, you have two options: utilize the server space you may have (if you have taken Clio 2 or rented space for this purpose), or you can run a server off of your own computer. The easiest way for us to do this is to utilize a package that allows you to manage your websites locally called MAMP (alternatively there is WAMP for Windows users – this can be downloaded at the same source here). This is available free for download and allows you to run a server from your machine. (There are other functions like a MYSQL server, but for now I’ll focus on how we’ll use it for PHP.)

After it is downloaded, open the application to run it. (It might pressure you to use MAMP PRO – we’re fine with MAMP for now. The control panel will give you a few options: Preferences, Start Servers, Quit and Try MAMP PRO. (I told you, they really want you to use MAMP PRO) Let’s get our server fired up by clicking “Start Servers”.

MAMP control panel

It may take up to a few minutes for your servers to be ready – you’ll know they are ready when the boxes next to “Apache Server” and “MySQL” are filled in. MAMP will also automatically load a page in your web browser.

In the meantime, fire up your text editor – we’re going to write our first line of code. I use Sublime Text- but feel free to utilize your preferred program.

At the top of the file write:

<!DOCTYPE html>
<html>
 <head>
 </head>
 <body>
   <p>
    <?php
       echo "this is some code.";
    ?>
  </p>
</body>
</html>

For anyone familiar with HTML, you should notice the HTML declaration and tags. For those that aren’t: the first few lines are defining the document type and page content. PHP can be placed anywhere, but in the above example, PHP, is inserted in the body of the page, between <p> tags. The <?php and ?> tags indicate that the  machine that it should read PHP and each statement within should end with a ;. In this case, we’re also using an echo statement in PHP to display a string “this is some code.”

After you’ve written your code, the file name should be changed to indicate that there is PHP to be read ( ex. index.html becomes index.php). In order to run the code, we need to display it in a browser. After you downloaded MAMP, it created a folder inside the program called ‘htdocs’. You can navigate to this folder from your applications window.

Navigating to htdocs

Save our document here as “index.php”. The files we add to this folder will populate within our server and are viewable in our browser.

Let’s test to be sure this is working: open your browser and navigate to “http://localhost:8888/index.php”. If we’ve saved everything correctly, the page should display “this is some code.”

Let’s do something interesting with PHP the demonstrates some of it’s usefulness. In the same index.php file, add the text:

<!DOCTYPE html>
<html>
  <p> 
    <?php 
      $clio = array("Jannelle", "Sara", "Mandy", "Anne", "George", "LeeAnn", "Peter");
    ?>
  </p>
</html> 

Here we’ve defined an array called “Clio” and added some of the members of class. But I’ve forgotten two very important people: Lincoln and Jeri! We can use the array function array_push to add them both. Let’s sort the group into alphabetical order, for good measure. Now let’s print the entire list out with commas between them.

        array_push($clio, "Lincoln"); 
        array_push($clio, "Jeri"); 
        sort($clio); 
        print join(", ", $clio); 

Let’s try to do something with this array. Earlier in the semester Lincoln demonstrated how we could randomly generate a name – add this to the bottom of the file and save it.

  <H3> 
   <?php echo $clio[array_rand($clio)];
    ?> 
  </H3> 

Now refresh the page. Refresh it again. A new name should populate. Here we’ve asked PHP to echo a name from our array using the function that calls a random string from the array.

 

What can I do with it?

All of this is interesting, but what can I do with it? The important thing to understand is that PHP is an object-oriented language, meaning it allows you to store and interact with information as objects. It is also modular  – it utilizes “hooks” to plug into existing systems to extend their functionality.

Connecting to a MySQL database:

Using MAMP, we are able, with few lines of code (and some excellent debugging with Lincoln and Google) to store and display items in a database.

If you are following along, we’ve already downloaded and run MAMP on our machine which started an Apache and MySQL server on our machine. Navigate back to the window and select ‘Open WebStart Page” (see the image above for clarification). From this page we have access to our “stack”- a stack takes a group of program components and groups them together. MAMP is an acronym that conveys the features of the stack-  Mac Apache MySQL PHP.

From this page you will see data for your connections. Navigate to the phpMyAdmin link under MySQL.

MAMP Stack

Click on databases. In the “create  database” field insert the name for your database. Click on it in the list to modify and add information. First let’s create a table. Name the table and define a number of columns. (Note you can also add a new table in an existing database if you like by using the navigation pane on the left.)

Create a table

Name the columns and define the column content – for our purposes, we’ll call this table classroster and define our column as studentname and text.

Name columns

Now let’s add data to our table – navigate to “insert”. (Add rows at the bottom of the page with the “continue insertion with rows” drop down menu). Be sure to uncheck “ignore”. You can return to the “insert” pane to add more data. When done, click “go” at the bottom of the screen. The page should refresh in the SQL pane and an alert will inform you that your rows have been added. Click on the “browse” tab to view your table.

Screen Shot 2014-10-29 at 6.03.53 PM

You may also need to set user permissions for your table. Click on the “More” tab and select “Privileges” from the dropdown menu.  Be sure to give the user permissions to the local host and all privileges to ensure that the database is accessible to us.

Now that we’ve got a nice little MySQL database of our class roster, let’s reproduce the same process as above:

Fire up your text editor. We’re going to write a script that will connect to our database and pull information from our table.

<?php
echo "Hello World!"<br><br>";

define( 'HOSTNAME', 'localhost' );
define( 'USERNAME', 'classuser' );
define( 'PASSWORD', 'class' );
define( 'DATABASE_NAME', 'clioclass' );

$db = mysqli_connect(HOSTNAME, USERNAME, PASSWORD, DATABASE_NAME) or die (mysqli_connect_error());

echo 'Connected... ' . mysqli_get_host_info($db) . "\n";
echo "<br><br>";

$query = "SELECT * FROM classroster ORDER BY RAND() LIMIT 1";
$result = $db->query($query);
print_r($result);

$selectedstudent = [];
while ($row = $result->fetch_array()){
	array_push ($selectedstudent, $row);
	}
echo "<br><br>";

print_r($selectedstudent);

$result->close();
$db->close();

?>

Running this code will produce a similar effect as the script we wrote for classroster.php. In this case, we are pulling our data from our MySQL database rather than an array in PHP.

Omeka and WordPress:

Other use cases for PHP include creating Omeka plug-ins or custom themes for Omeka and WordPress. At this point we should all be familiar with the way that GitHub allows us to collaborate and share our work – the Omeka community is a great example of that. Though the process of creating a plugin for your Omeka site is a bit overwhelming at first, there are a number of resources available!

The first place to start is Omeka documentation. Specifically the section on tutorials is massively helpful in wading through the process. Alternatively, Scholars lab has put together a toolkit to get everyone started and it is available on GitHub. You can also start where I did: by looking through the plugins that have been created and learning how they are constructed.

An Omeka plugin consists of at least three things:

  • a folder
  • an information file (plugin.ini)
  • the main file (FileName.php)

In many cases, plugins build on existing features or plugins to add functionality to their Omeka installation or to improve the feature overall.

There are a lot of really helpful tutorials online that will aid you in working through issues with PHP – it’s an expansive community and many use the language. Enjoy!