1 00:00:00,012 --> 00:00:04,004 [MUSIC] 2 00:00:04,004 --> 00:00:05,244 [SOUND] In this project, 3 00:00:05,244 --> 00:00:09,400 we're going to use an array to store all the information about our media items. 4 00:00:09,400 --> 00:00:12,290 We'll have one array for the whole catalog. 5 00:00:12,290 --> 00:00:16,420 The array will have multiple elements, one element for each item. 6 00:00:16,420 --> 00:00:18,150 Then on the main catalog page, 7 00:00:18,150 --> 00:00:22,598 we'll be able to loop through all the items using PHP's foreach command. 8 00:00:23,840 --> 00:00:27,700 We still have more to cover about arrays before we can build the page entirely, but 9 00:00:27,700 --> 00:00:30,900 let's open catalog.php and get a basic array in place. 10 00:00:32,460 --> 00:00:37,712 At the very top of catalog.php, let's add some PHP code to create an array 11 00:00:40,000 --> 00:00:44,340 We'll name this array, $catalog = array. 12 00:00:50,004 --> 00:00:51,796 We'll add some values here, 13 00:00:59,360 --> 00:01:00,590 and close our array. 14 00:01:01,880 --> 00:01:04,212 We now have three elements here. 15 00:01:04,212 --> 00:01:11,050 Design Patterns, Forrest Gump, and Beethoven. 16 00:01:11,050 --> 00:01:14,390 The text for each element is enclosed in quotation marks. 17 00:01:14,390 --> 00:01:17,330 There is a comma between each set of values. 18 00:01:17,330 --> 00:01:19,650 If we were to put a comma within our value, 19 00:01:19,650 --> 00:01:24,800 it would be treated as text, not as a separator between the elements. 20 00:01:24,800 --> 00:01:28,304 We can put hard returns between each element to make it a little easier to tell 21 00:01:28,304 --> 00:01:28,922 them apart. 22 00:01:30,160 --> 00:01:34,522 You'll typically see large arrays written like this, 23 00:01:34,522 --> 00:01:39,460 PHP doesn't care what you use for whitespace or indentation. 24 00:01:39,460 --> 00:01:42,990 It just makes it easier for other developers to read your code. 25 00:01:42,990 --> 00:01:46,171 Let's add the proper HTML for this page including the wrapper div. 26 00:01:46,171 --> 00:01:48,570 Let's go down here. 27 00:01:49,780 --> 00:01:53,500 First we're gonna add catalog 28 00:01:53,500 --> 00:01:57,230 as part of our class because this is the catalog page. 29 00:01:57,230 --> 00:01:58,962 We'll add a new div. 30 00:01:58,962 --> 00:02:03,753 class="wrapper". 31 00:02:07,879 --> 00:02:14,520 And we'll put our h1 tag up here in our div. 32 00:02:16,000 --> 00:02:17,570 Inside the wrapper div, 33 00:02:17,570 --> 00:02:22,990 right below the h1 tag, let's list off our items in an unordered list. 34 00:02:22,990 --> 00:02:23,950 When you're first starting, 35 00:02:23,950 --> 00:02:27,980 I always recommend writing out the final HTML needed, and then working backwards to 36 00:02:27,980 --> 00:02:31,330 figure out what PHP you'll need to use to generate that HTML. 37 00:02:33,040 --> 00:02:39,504 So we're gonna need one unordered list with an opening and close. 38 00:02:39,504 --> 00:02:43,212 And we're gonna do a list item. 39 00:02:43,212 --> 00:02:50,824 And we need Item 1, list item Item 2, 40 00:02:50,824 --> 00:02:55,220 and list item Item 3. 41 00:02:55,220 --> 00:02:58,120 Okay, we can see now that we need to 42 00:02:58,120 --> 00:03:03,600 include these list item tags within our foreach loop. 43 00:03:03,600 --> 00:03:06,300 We don't need to include the unordered list 44 00:03:06,300 --> 00:03:09,770 because there's only one pair of unordered list tags. 45 00:03:09,770 --> 00:03:14,540 So let's replace the multiple LI tags with a foreach loop that displays one item for 46 00:03:14,540 --> 00:03:15,540 each element in the array. 47 00:03:16,850 --> 00:03:22,950 So we're gonna open up our php tag and we're gonna create a foreach. 48 00:03:22,950 --> 00:03:30,225 Wanna see a foreach($catalog 49 00:03:30,225 --> 00:03:33,462 as $item). 50 00:03:33,462 --> 00:03:38,124 And then we're going 51 00:03:38,124 --> 00:03:43,045 to echo out that item. 52 00:03:43,045 --> 00:03:48,129 [INAUDIBLE]. Using concatenation we 53 00:03:48,129 --> 00:03:53,303 do item, closing li tag, 54 00:03:53,303 --> 00:03:58,253 and closing semicolon. 55 00:03:58,253 --> 00:04:00,963 Let's make this a little bit easier to see. 56 00:04:03,337 --> 00:04:08,442 Okay, and close out our PHP tag, and 57 00:04:08,442 --> 00:04:13,720 then we'll remove these lines here. 58 00:04:14,860 --> 00:04:19,672 So we've created a foreach loop for the catalog items. 59 00:04:19,672 --> 00:04:24,500 And we've assigned each item to a variable item. 60 00:04:24,500 --> 00:04:28,600 And then we've told it to print the item here below. 61 00:04:28,600 --> 00:04:29,990 So let's take a look at this in the browser. 62 00:04:31,610 --> 00:04:37,050 Okay, if we go to our Books page, we now see a list. 63 00:04:37,050 --> 00:04:42,390 Design Patterns, Forrest Gump, and Beethoven, here in an unordered list.