Start learning with our library of video tutorials taught by experts. Get started
Viewed by members. in countries. members currently watching.
In this course, author James Fritz shows how to create HTML-based websites with Muse—a toolset familiar to anyone who has used Adobe Photoshop, InDesign, or Illustrator. The course covers the design process from start to finish, from setting up web pages and populating them with graphics and text, to creating dynamic menus and adding special features such as widgets, slideshows, animations, embedded video, social media integration, and more. James also explains how to create an alternate layout for display on mobile devices, publish and update your site, and view analytics on web traffic.
In order to maintain a sense of consistency across multiple pages of a web site, it is important to establish Header and Footer regions. Headers may contain graphics for the top of a web site or even a menu system that lets users move between their pages. Footers can cap the bottom of a site and let users know when they've reached the end. Let's take a look at how to create and work with Headers and Footers. Let's begin by going to the Home page. So I'm going to double- click on the Home page. And here, I want you to pay attention to the relationship between the image at the top and the image and background that we see right here.
It's about 25 pixels right now. Now, over here is my Header guide. If I try to move this, it's not going to let me; it's grayed out. If I click on it, I will get a tooltip telling me how to use it. It's saying that I have to go to the Master page if I want to modify this. So let's go to the Master. I'm going to go back to the Plan view and then double-click on A-Master. Back on the Master page, I'm going to grab the Header guide and drag it down underneath this image. Now, let's go back to the Home page and see what changed.
You'll notice now that there's a large amount of space between the top graphic and the graphics below. What happened was, as I moved the guide, the amount of space between the top Header guide and the image below was maintained. But if I don't want this amount of space, what I need to do here is I'm going to go back and I'm going to click and drag to select all of this content and put it back up right next to the Header guide. Going forward, when I move this Header, all of this content will move with it. Let's check it out. I'm going to go back to the Master page and move the guide down a little more.
Let's say I want to get a little more breathing room between the top Header and the content below. Back on the Home page, we can see that the amount of space was updated. If I want to bring it back, I just go back to the A-Master, bring it back up, and back on the Home page, it's been updated. By taking the time to set up a Header on all of your pages, it will make editing significantly easier. Now, let's take a look at Footers. As I scroll down, we can see here is our Footer. With the Footer, it's the same options. If I want to modify this, I can click, but the tooltip is just telling me to go back to the Master page.
So what I'm going to do is I want to move this Footer to give myself a little more room down here. Back on the Master page, I'm going to scroll down and I can play with the Footer guide to determine the amount of space that I want. I think this is looking pretty good. Now, when I draw a rectangle, I will draw one about this big, I'm going to remove its stroke and give it this nice blue color. Now after drawing this object, if I want to put this underneath the Footer, it's going to be very difficult, because we can see the page is automatically expanding. What if I want to put it down here? Well, what I can do is with this rectangle selected, I'll click the checkbox to make it part of the Footer.
Now that, that's the case, I can come down here and put it anywhere that I want. What I'm going to do is resize this to be the size of the Footer. So I'll just grab this rectangle, and there we go; that is looking good. The next step is that I want to bring in some text. I'm going to put the contact information for the museum. Now I could type it in here manually, but I actually have it saved as a text file. We're going to go to File > Place or Command+D or Ctrl+D and we're going to navigate to the Assets folder, and in here is a file called footer.txt.
With my loaded cursor, I'll just click to place it on the page and I'm going to resize this to make this a little wider, just so all the text can fit and look good. Next, I'll double-click to select the text and center it. Now that I have that finished, I want to put this in here and I'm going to make sure it's part of the Footer. There we go. That is looking pretty good. Maybe I'll even bring this down a little more and we'll bring the Footer down. Now that I have this established, if I go back to the Home page, we'll see that we have this content at the Footer of the page.
If I try to move something else, it will never cover up the Footer because the Footer will keep expanding. When you're finished setting up your Header and Footer, it is possible to hide the guides by going to the View menu and choosing View > Hide Header and Footer. However, if you ever want to edit them again, remember to go back to the Master and turn on their visibility for easy editing.
Find answers to the most frequently asked questions about Muse Essential Training.
Here are the FAQs that matched your search "":
Sorry, there are no matches for your search ""—to search again, type in another word or phrase and click search.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
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.