350 Tutorial - Additional Formatting

Additional Formatting

There are two things we should do to this text. The first is that we should make it smaller, so that it doesn’t take prominence over our opening paragraph. Highlight the entire text by clicking on the wand button, and then click on the drop down menu. Select the Very Small size. You will see the text change in the editor window. The second thing we should do is to give a few words of the text some more emphasis. Hold the left mouse button and drag over the winning years of the Eaglehawks, and click the bold button, then hold the left mouse button and drag over the Shutout Kings nickname and click on the I icon to apply italics to the team’s nickname. This quick formatting will highlight the team’s accomplishments to make it look much more impressive on the page. Now click the save button in the text editor.

Now see if you can change the photo on the right of the businessman into the photo of the baseball player that we have in our 350 library in the sports category. (hover over the image, select the Add option from the Editor, select image and Replace. Then select the image in the Photos / Sports category and select Save in the Image Editor. This is what it should look like.

There are two more paragraphs that we haven’t looked at yet – to the left below our buttons, and to the right below our baseball player picture. You might edit these to include little bits of trivia, or maybe information on the next match in here, for example. However, we don’t want the text under the buttons so we shall delete it. Hover your mouse pointer over the paragraph and click on the cross. Click on the Delete button to confirm the removal.

We need to remove some of the navigation buttons as well. As our website is only going to be 2 pages, we should delete all except 2 of the buttons. We will do this in the Button Bar editor. Hover over one of the buttons to show the menu bar, and click on the Edit button. When the Graphic Editor opens, click on the Edit Button Bar button to be taken to the relevant editor.

In the Button Bar Editor you can change the text of your buttons, where the button links to, the position of the buttons and you also have the ability to add and remove buttons. The first thing we should do is to delete the buttons we don't need, so for the Services button, click on the small X at the end of the row. You will see this button disappears immediately, and the rest of the buttons shift up. Repeat this process for the About Us, News, Contact and Gallery buttons.

Now we should edit our buttons. Since our Home button is already named, we don’t need to do anything to that for now, but we should rename the other button. Click on the box for Products under the text column, and change this text to Fixtures.

If you wish, you can change the color of these buttons by clicking the Edit Graphic button in the top right of the Button Bar Editor. As we’ve already covered color changing earlier in the tutorial, this is an ideal opportunity to experiment with changing the color yourself. When you’re happy to continue, click on the Save button. We’ll be back here later to link this button to our page that we have yet to create.

There is one more thing we should do. The size of our stadium image could be bigger - for photos that capture a lot of detail, such as this stadium, it is neccessary to make sure your visitors can see every aspect of the photo. 350pages will let us do this on the fly. Click on the edit button of the photo to bring up the Photo Editor. You should see the preview of the photo that takes up most of the editor's space, with options at the top, divided into five tabs. Although we could edit how the photo looks, all we need to do is make it a little biggger. The size tab should already be selected, and you should see a Width and a Height box, with a Keep Proportions checkbox as well. Make sure that Keep Proportions and checked, and change the width to 500. This will adjust the width of the image to 500 pixels, whilst keeping the proportion of the image correct by adjusting the height automatically.

Click on the Save button. The newly resized photo should now appear on the page as we wanted.