This is just a preview. You need to be signed in with a Basic or Pro account to view the entire video.

Start a free Silver trial
to watch this video

Sign up for Treehouse

Working with Concatenation and Whitespace


You often need to display a combination of variable values and static pieces of text. In this video, we’ll talk about concatenation, the process of chaining these values together in a chain. We’ll also discuss how PHP, HTML, and the browser deal with whitespace.

Extra Credit

Add a new type of field to the contact form, something like a dropdown field with a label of "Reason for Inquiry" and a few options in it.

Video Transcript

  • 0:00

    Right now, our site visitors can submit a form to our PHP file.

  • 0:04

    A PHP file receives that information and displays it on the page--

  • 0:08

    all three fields in the continuous line of texts.

  • 0:10

    We'll eventually need to send all this information in the body of an email,

  • 0:14

    so let's modify how it looks a little with some texts and some formatting.

  • 0:17

    Open your htdocs directory and the contact-process.php file.

  • 0:22

    Before we echo out the name here, let's echo out some texts to describe the data.

  • 0:31

    I put a space inside the quotation mark there because I want a space

  • 0:34

    between the word name and the value from the variable.

  • 0:38

    We could do the same for the other fields, adding separate

  • 0:41

    echo commands before we echo out a value.

  • 0:43

    However, it is possible to echo out a variable and the string together in one command

  • 0:48

    using what's known as "concatenation."

  • 0:50

    To concatenate two things is to arrange them together in a chain.

  • 0:54

    Let me show you some examples.

  • 0:56

    The concatenation operator in PHP is a period.

  • 1:00

    You can concatenate two static pieces of texts together like this--to echo out ice cream.

  • 1:06

    You can also concatenate two variables together like this--

  • 1:10

    [echo $name $email; >> Randytest.@email.com]

  • 1:12

    You can mix and match these, also concatenating variables and static pieces of text together.

  • 1:19

    While I'm using the echo command with concatenation here,

  • 1:22

    you can also assign a concatenated string to a variable in this manner.

  • 1:27

    Let's combine these two echo statements into one,

  • 1:30

    concatenating the label, name, and the variable.

  • 1:38

    Let's concatenate labels in front of the other two fields also.

  • 1:50

    Save the file and switch back over to the browser,

  • 1:52

    click the back button, and submit the form again.

  • 1:55

    We now have our labels in place.

  • 1:57

    The text is still not that easy to read because it is all on one continuous line,

  • 2:01

    but these labels definitely helped.

  • 2:03

    Next, let's add some line breaks.

  • 2:05

    The echo statements are already on separate lines, but there's no line break

  • 2:09

    in the text that gets echoed out to the browser.

  • 2:11

    We can add line breaks using an escape sequence.

  • 2:14

    You can't exactly type a line break character in the code here, but you can use

  • 2:18

    a sequence of characters that PHP will interpret as a line break.

  • 2:22

    We can add that sequence at the end here, concatenating it to the name variable.

  • 2:27

    Let's add the sequence after email also.

  • 2:32

    Save these files and switch back to the browser again, click back and submit the form again.

  • 2:40

    View the source on the page and you'll be able to see the line breaks.

  • 2:44

    If we wanted line breaks to display in the browser,

  • 2:46

    we would have to use a break tag to achieve that.

  • 2:51

    But since we're going to display this in the plain text email message,

  • 2:54

    we don't need the break tag.

  • 2:56

    What we see when we view the source is what we'll see in the email.

  • 3:01

    There is an HTML element we can use to have the browser display the whitespace.

  • 3:05

    You wouldn't normally use this in a real web page but it's helpful

  • 3:08

    when working with PHP code values.

  • 3:11

    As the pre-formatted text element or PRE tag, we can wrap this whole block

  • 3:16

    of PHP code in a set of PRE tags to see the whitespace in the browser.

  • 3:27

    Before we do view it in the browser though, let's change one last thing.

  • 3:30

    When we send out this email, we're going to need the entire body

  • 3:33

    of the email in a single variable.

  • 3:36

    We can't echo out the variables one at a time like we do on this page.

  • 3:39

    Let's create a new variable called "email body."

  • 3:48

    And we'll set it equal to a blank value to start.

  • 3:51

    Now, instead of echoing out this next line, let's add it to the end of that variable.

  • 3:56

    To do this, we'll assign the email by a variable, a value equal to itself

  • 4:01

    plus the text concatenated to the end.

  • 4:04

    We can modify our code to add the email address and the message lines

  • 4:08

    to our email body variable in the same way.

  • 4:21

    If all the texts for the email body in one variable, let's go ahead

  • 4:24

    and echo it out to the screen for testing.

  • 4:30

    Let's save this file and go back to the browser.

  • 4:32

    Click the back button again and submit the form.

  • 4:37

    There, that looks much better.

  • 4:39

    We can see the real value on our PHP variable, line breaks and all,

  • 4:42

    now that the browser is displaying it inside of our PRE tag.

  • 4:47

    We covered a lot of ground there.

  • 4:49

    We can add concatenation and exploring how whitespace gets treated in different places.

  • 4:52

    I have a quiz for you and then we'll get back to our contact form.

Show full transcript


You have to sign up for Treehouse in order to create workspaces.

Sign up


You have to sign up for Treehouse in order to download course videos.

Sign up


  • Randy Hoyt