New Feature: Playlist Center! Pick a topic and let our playlists guide the way.

Start learning with our library of video tutorials taught by experts. Get started

Dreamweaver and WordPress: Building Sites
Illustration by

Linking to dynamic pages


From:

Dreamweaver and WordPress: Building Sites

with Joseph Lowery

Video: Linking to dynamic pages

If you've been working your way through the chapter, you've seen how we can include dynamic content in a WordPress template page. In this video I am going to show you two ways to link to that content. First, we'll take a look at the technique for creating a static link from a post or other page. We'll need one bit of information before we can code that link, the page ID. We will find that in the Dashboard's Page section. WordPress gives you a variety of options for discovering that value. So let's switch back to the Dashboard and then go to Pages.

Watch this entire course now—plus get access to every course in the library. Each course includes high-quality videos taught by expert instructors.

Become a member
please wait ...
Dreamweaver and WordPress: Building Sites
1h 42m Intermediate Feb 24, 2012

Viewers: in countries Watching now:

In this course, author Joseph Lowery shows how to create a robust WordPress-based site using Dreamweaver. The course lays out the essentials of planning a site, explains how to implement custom sidebars, and demonstrates building page templates. The course also explains how to integrate PHP functionality and extend the WordPress database.

Topics include:
  • Understanding development environment requirements
  • Working with existing WordPress content
  • Handling standard pages
  • Managing full posts
  • Coding a basic template
  • Adding a custom sidebar
  • Working with WordPress functions
  • Inserting PHP code in posts
  • Including a recordset
  • Outputting data
  • Linking to dynamic pages
Subjects:
Web CMS
Software:
Dreamweaver WordPress
Author:
Joseph Lowery

Linking to dynamic pages

If you've been working your way through the chapter, you've seen how we can include dynamic content in a WordPress template page. In this video I am going to show you two ways to link to that content. First, we'll take a look at the technique for creating a static link from a post or other page. We'll need one bit of information before we can code that link, the page ID. We will find that in the Dashboard's Page section. WordPress gives you a variety of options for discovering that value. So let's switch back to the Dashboard and then go to Pages.

Now if you hover over any of the pages here, down in the bottom of the screen in the Status Bar, you'll see the path to the page, and it includes post= and a number. In this case, for the All Planets page, it's 78. For the Disclaimer page, it's 93. And for the Membership Benefits page, it's 130. Now if I go in to edit that page, you will also see it listed here, where the page_id=130. It's the same value, and that's the identification number for the page within the WordPress system.

It's important to keep in mind that the page_id on your testing server may be different from the one on your live server, especially if like me, you create a fair amount of dummy posts in the development phase. Always verify the page_id on the live server before entering final links, when you're using this static link technique. So, how do we link to a specific page? Keep in mind that WordPress does everything off the basic homepage. So essentially you link to the homepage and add appropriate URL arguments. Let's try it out.

I am going to go back to my pages. Now let's say we want to create a link to our Planetary 411, and we want to show the information from, say, Mars. So first I need to get the page_id for Planetary 411, so let me just click on it. It's a little easier to see up here in the center of the page. And we see that the page_id is 142. Okay, so let's head on over to Posts and choose Mars is Open for Business! And then we will add some text in right at the end of the first paragraph.

See detailed info on Mars. Now I am going to double-click on Mars to select it and go up to my little toolbar where I can click Insert/edit link. And although by default WordPress puts in an http:// prefix, we don't need to go with that. We can just put an index.php, which is the homepage, and then a question mark for following arguments, and the key term page_id= and our page value, which was 142.

Now, this will get us to the basic page, but it doesn't pass the needed argument to populate our recordset. So let's add that id=4 string, because Mars is the fourth planet in our database, as well as in our solar system. So &id=4. All right let's add that link, update the page, and let's view that post. Okay, Mars is Open for Business! There is our link. Click on the link and there is our Planetary 411 page with the information from Mars.

That technique works well for static links, but how do you handle a more dynamic situation, where you have a list of links generated from the database on the fly? Dreamweaver has the answer. We'll first create a page that lists all the planets and to do that, I am going to start with my planet.php that we developed in a previous video, and I am going to save it as planets.php. So File > Save As, and let's just add an s.php there, click Save. And now we want to change the template name from planet to planets, so add an s there and now we are ready to do some work on the dynamic side.

The cool thing is, once you've set up the database connection and recordset in one template, you can very easily adapt it in all the others. Let's modify a record set so that we see all the planets. So let's open up the Server Behaviors panel and double-click on the recordset. You can ignore this splat that you see there. That's because we have our PHP template name up top and typically Dreamweaver prefers to have its PHP code upfront. But it can handle it.

So double-click on Recordset to open up the dialog box, and let's remove the filter by setting Filter to None so that all of the records in our database, all of the planets in other words, are returned. And let's go ahead and change the sort order so that it's sorted by planetName. Click OK. Next, let's change our data output from a table representing info about a single planet to a list of planets. So I am going to go down to find my table by going into Split view for a moment and then locate the code for the table.

Use Select Parent Tag to grab it all and delete it, and now we are ready to insert our dynamic data. So let's switch to the Bindings panel and choose planetName > Insert. And there you see the PHP code for the planetName. I am going to replace my cursor right after that and then do a Shift+Return, which will bring in a line break tag. You could of course just also type in the code, but that's a little faster. Okay, so now I want to select all this new code and then one more time switch over to the Server Behaviors panel and from the dropdown list choose, Repeat Region.

Now the Server Behaviors panel will not work with Code view, so you have to click in to Design view. But once you do, you'll see your dynamic information there, and we can extend the selection to include the line break by holding down Shift and pressing your right arrow once. So now all that new code is selected and we can click on Add Server Behavior and choose Repeat Region. We only have one recordset on the page. If there were multiple ones, you can choose the one you want from the list, unless of course get all of the records, in case we go over 10 planets in some future date.

I will click OK and our repeat region is added. Now unfortunately, Dreamweaver is not without a little gotcha here. Several times it's happened to me that after I've changed a recordset or added a repeat region, if I go back up to the top of the code, I would find another require once here. Now while it doesn't happen all of the time, it does seem to be something that you want to keep an eye out for. We are ready to test our new template page, to make sure we're getting all of our planets. So I am going to go ahead and save it, and let's head over to WordPress, and let's create a new page. Enter a title.

After entering the title, you can, if you want, also enter in some intro text-- I will put in a little placeholder here--and change our template from Default to Planets. And now let's publish the page. Okay, we are ready to view it, so I will click View Page. And there is my intro text and all of our planets alphabetically.

Looking pretty good. All that's left is to create a link. So let's head back to Dreamweaver. I am going to select the planetName code, and let me open up my Property Inspector and choose Browse for File. And then I am going to navigate to the index.php file, which is in our template folder, not the one on the site root. And then let's add our parameters. Click the Parameters button, and the first parameter is going to be page_id, page_id, and the value is, if you recall, 142, which was a page_id for our dynamic page.

Press Tab again, twice, to go and enter another parameter. So now we'll enter id in the Name column, press Tab twice, and this time click on the lighting bolt, because we are going to add dynamic data. And from the recordset choose id. Click OK and then OK once more to close out the Parameters box, and there you can see the entire string is built up for us, and click OK one more time. Okay, let's save that page, and now let's head back to our browser. I'll click refresh.

Now we have links for all of our names, and let's see if we can get to Neptune. There is Neptune. All right, it looks like everything is working perfectly. You can use this technique to build master detail page sets right within WordPress. How's that for cool?

There are currently no FAQs about Dreamweaver and WordPress: Building Sites.

 
Share a link to this course

What are exercise files?

Exercise files are the same files the author uses in the course. Save time by downloading the author's files instead of setting up your own files, and learn by following along with the instructor.

Can I take this course without the exercise files?

Yes! If you decide you would like the exercise files later, you can upgrade to a premium account any time.

Become a member Download sample files See plans and pricing

Please wait... please wait ...
Upgrade to get access to exercise files.

Exercise files video

How to use exercise files.

Learn by watching, listening, and doing, Exercise files are the same files the author uses in the course, so you can download them and follow along Premium memberships include access to all exercise files in the library.
Upgrade now


Exercise files

Exercise files video

How to use exercise files.

For additional information on downloading and using exercise files, watch our instructional video or read the instructions in the FAQ.

This course includes free exercise files, so you can practice while you watch the course. To access all the exercise files in our library, become a Premium Member.

join now Upgrade now

Are you sure you want to mark all the videos in this course as unwatched?

This will not affect your course history, your reports, or your certificates of completion for this course.


Mark all as unwatched Cancel

Congratulations

You have completed Dreamweaver and WordPress: Building Sites.

Return to your organization's learning portal to continue training, or close this page.


OK
Become a member to add this course to a playlist

Join today and get unlimited access to the entire library of video courses—and create as many playlists as you like.

Get started

Already a member?

Become a member to like this course.

Join today and get unlimited access to the entire library of video courses.

Get started

Already a member?

Exercise files

Learn by watching, listening, and doing! Exercise files are the same files the author uses in the course, so you can download them and follow along. Exercise files are available with all Premium memberships. Learn more

Get started

Already a Premium member?

Exercise files video

How to use exercise files.

Ask a question

Thanks for contacting us.
You’ll hear from our Customer Service team within 24 hours.

Please enter the text shown below:

The classic layout automatically defaults to the latest Flash Player.

To choose a different player, hold the cursor over your name at the top right of any lynda.com page and choose Site preferencesfrom the dropdown menu.

Continue to classic layout Stay on new layout
Exercise files

Access exercise files from a button right under the course name.

Mark videos as unwatched

Remove icons showing you already watched videos if you want to start over.

Control your viewing experience

Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.

Interactive transcripts

Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.

Are you sure you want to delete this note?

No

Notes cannot be added for locked videos.

Thanks for signing up.

We’ll send you a confirmation email shortly.


Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

Keep up with news, tips, and latest courses with emails from lynda.com.

Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

   
submit Lightbox submit clicked
Terms and conditions of use

We've updated our terms and conditions (now called terms of service).Go
Review and accept our updated terms of service.