Join James Fritz for an in-depth discussion in this video Understanding guides, part of Up and Running with Muse.
- View Offline
When building websites, individual pages often vary in length based on the content of each page. In order to maintain a consistent appearance across pages of unique content, it is important to establish header and footer regions on that page. These regions are controlled by a series of special guides. Let's take a look at how they work. I'm going to go to the master page and then we're going to zoom out just a tiny bit by going to view, zoom out. You'll see on the left hand side we have a series of guides. The top guide is the top of page.
Next we have header, footer, bottom of page and bottom of browser. Now, these guides are special because they have special capability. And you might be thinking to yourself, well what about regular guides? Well don't worry, we have them in this application. All you do is go over to the ruler, and you drag them out, just like you would in any Adobe application. If you don't want it anymore, just hit delete when you have that guide selected, and you can get rid of it. The top guide is the top of page. If I drag this down, it moves the entire webpage down, and we just see the top of the browser fill that's up there.
So, if I move this back to the top, let's go to file, preview page, and browser. You can see that the graphic is right at the top next to the URL. But if I go back in the Muse, and I lower this down, and go to File > Preview > Page and browser, it's automatically putting it down a little bit. So, it's a quick way just to give yourself a little bit of extra breathing room at the top, and move all the content down on your site, if that's what you're looking for. But in the case of Muse, you can just leave it right at the top. The next guide that we have, is the header guide. The header guide is the next guide and you can see is crossing through the TT created logo in the center of the page.
Now if I go back to the plane view, and I go to the home page, we have this graphic and this text that is lined up with the top of the header guide covering up that logo. Now if I wanted to I could just grab these graphics and move them down manually, but I can use header guise to do this for us. So, back in the Plan view, I'm going to go back to the master page, and I'm going to grab this guide to just bring it down a little bit to right here. There we go. Now on the home page we can see that the home page was automatically updated and all that content was moved down.
So we can use the header guide to automatically give our self a little more room in all the pages, for maybe if we're going to insert a menu or some other header information. The next guide that we have is the footer guide. So, let's go back to the eMaster page and over here is the footer guide, where I can move this around as needed. Now the footer region is the region at the bottom of the page and often in the footer region, you'll put contact information. In this case we just have the TT Creative Studios address. Now let's go back to the home page again. On the home page, we're just going to zoom out a little bit by going to view zoom out, and we'll do it one more time, and what I want to do is if I decide that I want to move this picture down.
You would think that it would obscure the footer information that was down here but in fact, if I grab this picture and move it down look what happens. The footer region is smart enough to automatically move down and keep moving to size because it wants to give us room to add more content and the content that is in the footer region will keep moving down, down, down and adding as much room that is necessary. But what happens if I decide I want to add something extra this, to this spot right on this page? Well, in order to do that, we first create something new.
I'll just make this be a color again and with this selected, all I have to do is go into my control panel and click footer. As soon as I do that, I can put this wherever I want on the footer region or anywhere on the page and now as I move anything else on the page, it will move down with it. If I want to modify the footer region, I have to do this on the master page itself. The last two controls control the end of the page. So right here if I move over this one this is the bottom of the page which I can control on any page and this just gives me a little more room down here.
And the last one is the bottom of the browser, which gives even more room at the bottom. Over time, as you begin to modify or add additional content to your site, it is a good idea to check your header and footer regions still work with your layout. You may find that as you add more pages to your site your header may have to increase in size in order to accommodate the additional links.
- Creating a new site
- Setting up master pages
- Working with text and graphics
- Adding hyperlinks and web forms
- Embedding HTML and maps
- Exporting and publishing a Muse website