Join Paul Trani for an in-depth discussion in this video Adding multiple pages and navigation, part of Creating a Small-Business Website in Muse.
- Creating multiple pages in Muse is done very easily, in fact, in Plan view, right over here just hit that little plus button and that's how you add additional pages. So that's what I wanna do, I wanna add a couple additional pages. Starting with Gallery, Shop... An About page and then a Contact page. Just like that, okay. So there's my four new pages. Now I need to add content to them and I could design each one but really they're all linked to the master page.
See how it says, "A-Master?" This is my A-Master, so if I double-click on my master page, let's close that, I can add any sorts of images or graphics that I want. In fact, selecting Browser Fill, I'm gonna add an image and I'm gonna add this background image to my master page. I'm gonna make sure Fitting is set to Scale To Fill and Scrolling is turned off. Just like that. If I click back on my "DenverDesignShop," you can see it's propagated across all of these pages.
Okay. So that looks pretty good. I'm gonna double-click now on this homepage, because what I already have set up is roughly a navigation bar. In fact, what I wanna do is I wanna add a menu so I can then link to the additional pages that I've just created. And in order to do that, you wanna use your Widget Library. So, opening up my Widgets Library, I'm gonna go into Menus, right here. See I have "Horizontal" menu, I'm gonna drag that out right now and there it is.
There's my horizontal menu that already has the names of all of those buttons and it actually will link to all of those pages as well. So this is already somewhat set up and all I need to do is start manipulating it. So I can kind of shrink it down if I want to, make sure it fits in there nice and neat and I can feel it like snap into place like that. I can start changing the color as well. So as I have this button selected, I'm just gonna open up States because now I get the states for this button.
Okay, in fact, knowing that I'm on the normal state, that's why I wanna change that fill. Gonna change that fill to black. You can see it changes it across the board. I can select that Home background right there and change that fill. Since this is the highlight, I'm gonna change that to red. Okay. Also even for this text, as I select this text right in here, I wanna change that font. So go into the Text panel, change it from Georgia to Source Sans Pro and in this case let's make it a bold font like that.
So you can see I've changed that there. And I wanna do that for these others, so just selecting it, changing that to bold and it changes it across the board. And as I take a look at my different states, as I select these buttons you can start to see the active state is the red state that I've selected. On roll over, you're gonna see that it's gonna turn that grey. Okay. And that's exactly what I want. But really with that horizontal menu in place, I can check out and make sure it works.
In fact, by clicking Preview. Here's my menu, as I roll over it I can see that grey. Now when I click on Gallery it's gonna jump to the gallery where I don't have the menu. But it jumps to that gallery page. Okay. But now for all of those other pages, I wanna add that navigation to it. So, going into my homepage, I'm gonna select this menu and then I'm gonna hold down the Shift key to select this bar and then select this logo as well. So selecting all of those elements.
In fact, what I want to do is I wanna take them all and I wanna right click and group them together. So it's just one solid unit, it's easier to work with. Then I can go to Edit, Copy. Copying it from the homepage and then going into my master page right here. In my master page, that's where I want to paste it. Pasting it in, like that. In fact, in this case I'm gonna move it clear up to the top like that and right there.
Okay. And even for this background I'm gonna change the fill to white so it looks nice and clean. And make sure the stroke is set to none. All right, with that in place, I'll go back to my Plan view. You can see it's propagated across all of the pages now. Keep in mind there's no content on any of these pages but we can just go ahead and select Preview and we can see that page. We can click to our homepage.
Now notice how my homepage actually has that menu on it. So how do we fix that? Well, going back to the Plan view, I don't wanna associate this page with this master page. So what you can do is just right click, right down here, Masters. Well don't make it part of that A-Master, select No Master. And now as we go into Preview and going to Home, you can see it's not up there. Some of my content has shifted so I'm gonna just jump in and select this content and move it down because it has adjusted based on that homepage.
The fact that I've changed the master, so I've just moved that content down, since I disassociated it from the master and the master had a little bit of spacing on the top and bottom. But none the less, there's my page, clicking Preview, everything looks good now. Scroll through that content. I can click Gallery and then there's my menu up at the top and I can click through these different pages. Even go back to the homepage, everything looks great at this point.
- Crafting information that visitors will want to read
- Creating a compelling homepage
- Adding navigation
- Implementing social media options (Twitter, Facebook, and YouTube)
- Implementing a contact form and a shopping cart
- Publishing the website
- Adding metadata for search engines