Adding Content to the Layout / Inserting the Header
Visitors to VTC.com will be able to view all introductory videos for each training course.
Free Trial Members will gain access to first three chapters for each training course.
Full Access Members have full access to VTC.com’s entire library of video tutorials.
Learn More
Subtitles of the Movie
Are you ready to finish off our Layout? I've gone and opened up Header.jpg from the Lesson 13 folder and this is the same Header that you and I created some time ago. I just made a couple of minor changes to it, that's all - mostly related to the text. And the other thing that I did is I flattened the entire Header so it's just all collapsed down onto a single Background Layer and I want to take this Header and drop it into our Layout. So, Select All by hitting Command-A here on the Mac or Ctrl-A over on the Windows side and then copy it - Command-C or Ctrl-C - and then I'll head back to my Web Layout. I'm going to pop into Full Screen Mode, too, by the way, just by hitting the F key. And then what I'll do here is I'll make sure inside the Layers Palette that the Lead Story Layer Group is selected and then I'll paste and that should paste our Header above the Lead Story. Let's go and rename this Layer here to Header. Perfect. OK, now I'm just moving the Header up toward the top of my Layout. I have the Move Tool selected inside the Toolbox. You might want to zoom in to 100 percent to make sure everything's nice and lined up. I think I actually got lucky. I think everything's looking really good here. OK and then the only other thing I want to do is I want to throw on a Black Border all the way around the new Header, right? So what I'll do here is I'll double-click on the right-hand side of the Header Layer into my Layer Style dialog box. On the left-hand side I'll click on Styles and then I'll go after this - remember this guy? Geoff's Layout Formatting - go ahead and turn that guy on, but it fills everything with white, right? So, make sure to turn off your Color Overlay and then click on OK. Alright, perfect. That's it. That's all we needed to do. Now just make sure that you can see your Black Border all the way around all four sides. You might have to do a little bit of micro-positioning here. Alright, good stuff. So, things are looking really good here inside Photoshop. The next thing that we have to do is we have to slice apart our Layout and this is where we get Photoshop to write out all of our background code, so let's keep on moving and we'll take a look at how to do that next.
Tutorial Information
| Course: | Adobe Photoshop CS4 for the Web |
| Author: | Geoff Blake |
| SKU: | 34089 |
| ISBN: | 1-936334-01-1 |
| Release Date: | 2010-02-25 |
| Duration: | 7 hrs / 105 lessons |
| Work Files: |
Yes |
| Captions: | Available on CD and Online University |
| Compatibility: |
Vista/XP/2000, OS X, Linux QuickTime 7, Flash 8 |
VTC Sign up & Benefits
- Unlimited Access
- 98,729 Video Tutorials (23,265 free)
- Video Available as Flash or QuickTime
- Over 1026 Courses
- $30 for One Month Access
- Multi-User Discounts Available
United States 