How to Manage Your Website Content a tutorial for macrobatix customers ea gmnas The following is a step-by-step tutorial showing you how manage your website content through the open source content management system called Joomla. Brought to you by Macrobatix, LLC. %etcma wnxudk m;znw oos raqamw mskgpnz Table of Contents Chapter One: The Basics Overview of Joomla Learn the Terminology Sign in to Your Account Chapter Two: Create Sections, Categories, & Articles Create a New Section Create a New Category Create an New Article Copy an Existing Article Chapter Three: Edit Sections, Categories, & Articles Edit a Section Edit a Category Edit an Article 2 2 2 3 4 4 6 8 10 11 11 13 15 Chapter Four: Format the Text 17 Learn Basic Formatting Create a List Hyperlink Text Create a Table 17 18 20 22 Chapter Five: Images Upload an Image Delete an Image Add an Image to an Article Hyperlink an Image 26 26 28 29 32 Chapter Six: Main Menu 34 Menu Item Type Add a Menu Item Edit a Menu Item Create a Submenu Order Menu Items 34 34 40 42 43 Chapter Seven: Modules 44 Create a New Module Copy an Existing Module Edit a Module Insert an Image into a Module Enable or Disable a Module Chapter Eight: Publish or Unpublish Articles, Categories, & Sections Publish or Unpublish 44 48 49 51 55 56 56 Chapter Nine: Contacts 57 Add a New Contact Edit a Contact 57 59 Chapter Ten: Wrappers 60 Create a Hidden Menu Create a Wrapped Item Edit a Wrapped Item 60 61 65 Chapter 1: The Basics Overview of Content Management Your website uses a Content Management System called Joomla. This gives you the ability to add and edit most of the content on your website yourself, rather than paying a web maintenance professional do it for you. Learn the Terminology Joomla: The Content Management System you will use to add and edit content on your website. Front-End: The actual website that viewers see on the Internet. Back-End: The administrator edits the site through the back-end of the site. You have to login to get access through the back-end. The information in Joomla is organized into sections, categories and articles (a.k.a. content items). To explain this hierarchy, we will use the example of the structure of a book. Section: The sections are the largest portions of the book. They are not the chapters. Sections include the chapters. Category: The categories are the chapters of the book. Article/Content Item: The articles are pages of the book. They will be the individual pages of your website. Articles are grouped into categories, which are grouped into sections. Module: A module is a small window within a page that contains information. It is positioned around the main content of a page. Throughout this tutorial, you will learn how to create and edit your sections, categories, articles, etc. in the Joomla system. We will begin by teaching you how to sign in to the back-end of your Joomla website. 2 Sign in to Your Account Follow these steps to log in to your Joomla account: 1. Type the URL on your Joomla information sheet in the address bar of your web browser. 2. Type your username and password in the appropriate fields on the login screen. 3. Click “OK”. After logging in, you will arrive at the control panel screen. 3 Chapter 2: Create Sections, Categories, & Articles Before you create a new article, you must have a category to place it in. This can be an existing category or you can create a new category. The same goes for categories; before you can create a new category, you must have a section to place it in. This can be an existing section or you can create a new section. Therefore, when you are creating new items for your website, the best order to create them is: 1. Section 2. Category 3. Article Create a New Section 1. From the Administrator menu, go to Content > Section Manager. 2. Click on the “New” button. 4 3. Type the title of the new section in the “Title” field. 4. A. If you want to save your changes and be sent back to the section manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working on that section, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the section manager, click “Cancel” in the upper right corner. 5 Create a New Category 1. From the Administrator menu, go to Content > Category Manager. 2. Click on the “New” button. 6 3. Type the title of the new section in the “Title” field. 4. Select the correct section from the “Section” dropdown menu to place the category in. 5. A. If you want to save your changes and be sent back to the category manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working on that category, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the category manager, click “Cancel” in the upper right corner. 7 Create a New Article 1. From the Administrator menu, go to Content > Article Manager. 2. Click on the “New” button. 8 3. Select the correct section and category to place the new article in from the dropdown menus. 4. Type your new text in the large description area. You will learn how to specifically format this text later in the tutorial. 5. A. If you want to save your changes and be sent back to the category manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working on that category, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the category manager, click “Cancel” in the upper right corner. 9 Copy an Existing Article 1. In the Article Manager, check the box next to the article you would like to copy. 2. Click the “Copy” button in the upper right corner. 3. Choose the section and category from the “Copy to Section/Category:” menu. 4. Click the “Save” button in the upper right corner. 5. You will then see a copy of the original article listed in the article manager. The original and the copy will have the same title. You can distinguish the copy from the original by referring to the id number. The id number is listed in the “ID” column near the right side of the screen in the article manager. The higher the id number, the more recent the article. Therefore, the copy will have the higher id number. 10 Chapter 3: Edit Sections, Categories, & Articles Edit a Section 1. From the Administrator menu, go to Content > Section Manager. 2. Click on the title of the section you would like to edit or add content. 11 3. Either copy and paste or type your new text inside the large description area. 4. A. If you want to save your changes and be sent back to the section manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working on that section, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the section manager, click “Close” in the upper right corner. 12 Edit a Category 1. From the Administrator menu, go to Content > Category Manager. 2. Click on the title of the category you would like to edit or add content. 13 3. Either copy and paste or type your new text inside the large description area. 4. A. If you want to save your changes and be sent back to the category manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working on that category, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the category manager, click “Close” in the upper right corner. 14 Edit an Article 1. From the Administrator menu, go to Content > Article Manager. 2. Click on the title of the article you would like to edit or add content. 15 3. Either copy and paste or type your new text inside the large description area. 4. A. If you want to save your changes and be sent back to the article manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working on that article, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the article manager, click “Close” in the upper right corner. 16 Chapter 4: Format the Text Learn Basic Formatting Bold Text: Highlight the text you would like to make bold, then click the “Bold” button above the description area. Italic Text: Highlight the text you would like to make italic, then click the “Italic” button above the description area. Underlined Text: Highlight the text you would like to underline, then click the “Underline” button above the description area. Strikethrough Text: Highlight the text you would like to strikethrough, then click the “Strikethrough” button above the description area. Align Left: Highlight the text you would like to align to the left, then click the “Align Left” button above the description area. Align Center: Highlight the text you would like to align to the center, then click the “Align Center” button above the description area. Align Right: Highlight the text you would like to align to the right, then click the “Align Right” button above the description area. Align Full: Highlight the text you would like to align to the both the left and the right, then click the “Align Full” button above the description area. Format: Choose the format of the text by highlighting it and choosing the format (such as paragraph) from the dropdown menu. Font family: Choose the font of the text by highlighting it and choosing the font family from the dropdown menu. 17 Create a List 1. Type the text of the list as you would normal text, typing one hard return (by hitting the enter/return key once) after each list item. 2. Highlight all of the list items at once to select all of them. 3. To make the list a bulleted list (unordered), click on the “Unordered List” button above the description area. 18 4. To make the list a numbered list (ordered), click on the “Ordered List” button above the description area. 5. A. If you want to save your changes and be sent back to the manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the manager, click “Close” in the upper right corner. 19 Hyperlink Text 1. Type or copy and paste the text of that you would like to make a link as you would normal text. 2. Highlight the text you would like to link. 3. Click on the “Insert/Edit Link” button above the description area. 20 4. You will see a “Insert/Edit Link” window appear on the screen. In this window, type or copy and paste the URL you would like the link to go to in the “Link URL” field. 5. A. If it’s a link to a website outside of this website make sure to include the “http://”. However, if you do not type the “http://”, when you click the “Insert” button, you will get a message asking you if you would like to add it. In that case, click “Ok”. B. If it’s a link to a page within this website make sure the link starts with the word “index”. You won’t need to type “http://www.yourdomain.com”. The easiest way to get the URL of a web page is to navigate to it in the front-end, then copy the URL beginning with index.php until the end of the URL. 6. Click the “Update” button in the bottom left corner of the window. 7. A. If you want to save your changes and be sent back to the manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the manager, click “Close” in the upper right corner. 21 Create a Table 1. Place your cursor in the description area where you would like the table to appear. 2. Click the “Insert a New Table” button above the description area. 3. You will see a “Insert/Modify Table” window appear on the screen. In this window, specify the number of columns in the “Columns” field and the number of rows in the “Rows” field. 4. In the “Cellpadding” and “Cellspacing” fields, you can specify the padding and spacing of the cells. 5. In the “Alignment” dropdown menu, select what type of alignment you want the text of the table to have. Center, left, and right are the options to choose from. 6. In the “Border” field, specify the thickness of the border of the table. If you do not want your table to have a border, enter “0” in the field. 7. In the “Width” and “Height” fields, type the dimensions of the entire table. 8. Click the “Insert” button on the bottom left corner of the window. 22 9. You will see an empty table appear in the description area. Place your cursor inside one of the table cells and begin to type. 23 10. You can adjust the table row properties by clicking the “Table Row Properties” button above the description area. 11. In the “Table Row Properties” window that pops up, you can edit the alignment, etc. of the rows in your table. 12. Click the “Update” button to load your changes. 24 13. You can also adjust the table cell properties by clicking the “Table Cell Properties” button above the description area. 14. In the “Table Cell Properties” window that pops up, you can edit the alignment, etc. of the cells in your table. 15. Click the “Update” button to load your changes. 16. A. If you want to save your changes and be sent back to the manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the manager, click “Close” in the upper right corner. 25 Chapter 5: Images Upload an Image 1. From the Administrator menu, go to Site > Media Manager. 2. Click on the folder you want to place your image in on the left side of the screen. 26 3. You can create new folders clicking on the “Create Folder” button on the right side of the screen. Make sure you are creating the folder inside the folder you want to create it in. For example, if you want the new folder to be on the same level as the “M_images”, “pdfs”, “banners”, etc. folders; click on the “Media” folder. 4. When you are in the folder you want to add the image to, click on the “Browse” button near the bottom of the screen. 5. Find the image file on your computer, then click “Open”. 6. Click the “Start Upload” button. 7. When the image has completed the upload process, you will get a message informing you it is complete. 27 Delete an Image 1. From the Administrator menu, go to Site > Media Manager. 2. Navigate to the image folder that contains the image file(s) you would like to delete. 3. Click the checkbox next to the image(s). 4. Click the “Delete” button in the upper right corner of the screen. 28 Add an Image to an Article 1. From the Administrator menu, go to Content> Article Manager. 2. Click on the title of the article you would like to add the image to. 3. Place the cursor in the description area where you want your image to be placed. 29 There are two ways to insert the image at this point. First is the easiest way. 4. Click the “Image” button underneath the large description area. 5. A window will appear on the containing your image files. Click on the image you would like to insert. If it is in a subfolder, click on that folder first, then the image. 6. Once you have selected the image you want to insert, click the “insert” button in the upper right corner of the window. 7. You will then see the image appear in the description area. 8. A. If you want to save your changes and be sent back to the manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the manager, click “Close” in the upper right corner. 30 The other way to insert an image is a little more involved. Follow steps 1 - 3 before this step 4: 4. Click the “Insert/Edit Image” button above the description area. 5. The “Insert/Edit Image” window will appear on the screen. Type the path to the image in the “Image URL” window”. The URL... 6. Click the “Insert” button in the bottom left corner of the window. 7. You will then see the image appear in the description area. 8. A. If you want to save your changes and be sent back to the manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the manager, click “Close” in the upper right corner. 31 Hyperlink an Image 1. From the Administrator menu, go to Content> Article Manager. 2. Click on the title of the article that includes the image you want to hyperlink. 3. In the description area, select the image you would like to hyperlink by clicking on it once. 4. Click on the “Insert/Edit Link” button above the description area. 32 5. You will see a “Insert/Edit Link” window appear on the screen. In this window, type or copy and paste the URL you would like the link to go to in the “Link URL” field. 6. A. If it’s a link to a website outside of this website make sure to include the “http://”. However, if you do not type the “http://”, when you click the “Insert” button, you will get a message asking you if you would like to add it. In that case, click “Ok”. B. If it’s a link to a page within this website make sure the link starts with the word “index”. You won’t need to type “http://www.yourdomain.com”. The easiest way to get the URL of a web page is to navigate to it in the front-end, then copy the URL beginning with index.php until the end of the URL. 7. Click the “Update” button in the bottom left corner of the window. 8. A. If you want to save your changes and be sent back to the manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the manager, click “Close” in the upper right corner. 33 Chapter 6: Main Menu The main menu is usually the only menu you will have on your website. If you have more than one menu, the main menu will usually be the largest and most obvious. Menu Item Type A menu item type determines the layout of the web page it links to. The most common menu item types used are the article layout, category list layout, and standard contact layout. Add a Menu Item 1. From the Administrator menu, go to Menus > Main Menu. 2. Click on the “New” button. 34 3. Select the menu item type. Below is an explanation of the menu item types you will use the most. Articles > Article Layout: The Article layout displays a single article of your choice. When you choose this menu item type for a menu item, the menu item will link to a single article. This will probably be the menu item type you choose most frequently. Articles > Category List Layout: The Category List layout displays all of the articles in a category. When you click on a menu item that is a Category Listing, you will see a page that lists the articles in the chosen category. Contacts > Standard Contact Layout: The Standard Contact layout displays a single contact’s details. You will probably use this menu item type for one menu item, the one that links to your “Contact” page. 35 4. Type the title of the menu item in the “Title” field. 5. Choose the Parent Item for the menu item. This indicates where it will appear in the menu. For example, if you want the menu item to appear in the main level of the menu, choose “Top”. If you want the menu item to be part of a submenu, click on the menu item you want it to be under. 36 If you are creating an article layout menu item follow the steps on this page. Follow steps 1 - 5 before this step 6: 6. In the Basic Parameters area, choose the article you would like the menu item to link to. 7. In the popup window, click on the title of the article of your choice. 8. A. If you want to save your changes and be sent back to the main menu manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working on this menu item, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the main menu manager, click “Cancel” in the upper right corner. 37 If you are creating a category list layout menu item follow the steps on this page. Follow steps 1 - 5 before this step 6: 6. In the Basic Parameters area, choose the category you would like the menu item to link to. 7. Choose the number of articles from that category to be displayed in the “#Links” dropdown menu. 8. In the Advanced Parameters area, choose the order the articles will be displayed in. Some of the options you have are: most recent first, alphabetical, the actual order given to the articles through the back-end (this option is called order- you choose this order by using the arrows in the order column in the article manager), etc. 9. A. If you want to save your changes and be sent back to the main menu manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working on this menu item, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the main menu manager, click “Cancel” in the upper right corner. 38 If you are creating a standard contact layout menu item follow the steps on this page. Follow steps 1 - 5 before this step 6: 6. In the Basic Parameters area, choose the contact you would like the menu item to link to from the dropdown menu. (To learn more about contacts, refer to chapter nine of this tutorial.) 7. A. If you want to save your changes and be sent back to the main menu manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working on this menu item, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the main menu manager, click “Cancel” in the upper right corner. 39 Edit a Menu Item 1. From the Administrator menu, go to Menus > Main Menu. 2. Click on the title of the menu item you would like to edit. 40 3. Here you can edit the title, parent item, menu item type, etc. 4. A. If you want to save your changes and be sent back to the main menu manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working on this menu item, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the main menu manager, click “Close” in the upper right corner. 41 Create a Submenu 1. From the Administrator menu, go to Menus > Main Menu. 2. Click on the menu item that you want to go in the submenu. Or if the menu item is has not been created yet, click on the “New” button. 3. Click on the menu item that you want to go in the submenu. Or if the menu item is has not been created yet, click on the “New” button. 4. On the menu item edit screen, choose the “Parent Item” for the menu item. The “Parent Item” is the menu item you want the submenu menu item to be under. For example, if you want this menu item to be in a submenu under “Clients”, choose “Clients” as the menu item. 5. A. If you want to save your changes and be sent back to the main menu manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working on this menu item, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the main menu manager, click “Close” in the upper right corner. 6. Repeat the above steps with all of the menu items you want to include in the submenu. 42 Order Menu Items 1. From the Administrator menu, go to Menus > Main Menu. 2. In the “Order” column you will see a number for each menu item. This tells you its place in the menu. There are arrows next to this number. Click on these arrows to change the menu item’s order. 43 Chapter 7: Modules A module is a small container that displays content on your website. Modules can be placed in a variety of positions around the content on the page. Also, you can create one module and place it on a number of pages. Some examples of modules you may have on your website are the menu, the search bar, a footer with information in it, etc. There are many types of modules you can create and add to your website. Such as a simple module that contains a image and some text. Create a New Module 1. From the Administrator menu, go to Extensions > Module Manager. 2. Click on the “New” button. 44 3. Choose the type of module you would like to create by clicking the button next to it. Here is a list of the most useful types of modules. Custom HTML: This module is the most basic and most versatile module. If you want to create a module that contains only text, or only text and an image, you would choose this type of module. Search: This module displays a search box for viewers to search your website. Random Image: This module displays a random image from your chosen directory. Menu: This module displays a menu. Newsflash: This module will either randomly display one article or display a fixed number of articles in a horizontal or vertical configuration. 4. Click the “Next” button. 45 5. Type the title of the module in the “Title” field. 6. Under the “Title” field, choose whether or not you want the title to show up on the front-end in the module. 7. Choose the position of the module. The position is a designated place on the web page. Positions are a little different depending on your Joomla template. However, the names are usually self-explanatory. Some of the common positions are: Banner: This position is usually along the top of the screen, above the logo. Search: This position is where a search box would typically go, near the top on the right side. Header: This position is usually right under the menu. Left: This position is near the middle of the screen, on the left side. Right: This position is near the middle of the screen, on the right side. Bottom: This position is one of the furthest down on the screen. Footer: This position is below the “Bottom” position. 8. The order of the module is only important if there is more than one module in a position. If necessary, choose the order in the “Order” menu. 9. Choose what menu items you want the module to show up on in the “Menu Assignment” area. You can easily choose all menu items, no menu items, one menu items, or multiple menu items. Choose sequential multiple menu items by holding down the shift key and clicking on the first and last menu item you want to include. Choose nonsequential menu items by holding down the command key and clicking on each menu item you want to include. 46 10. In the “Custom Output” area, type the text you would like to appear in the module. You can also add images in this area as well. 11. A. If you want to save your changes and be sent back to the module manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working on this module, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the module manager, click “Cancel” in the upper right corner. 47 Copy an Existing Module 1. From the Administrator menu, go to Extensions > Module Manager. 2. Click on the box next to the module you want to copy. 3. Click on the “Copy” button. 4. The copy of the module will appear in the list of modules. “Copy of” will be part of the title. 5. Click on the module to edit it. You will learn more about editing modules next in this tutorial. 48 Edit a Module 1. From the Administrator menu, go to Extensions > Module Manager. 2. Click on the title of the module you want to edit. 49 3. Edit the module title, text, images, position, etc. on this page. 5. A. If you want to save your changes and be sent back to the module manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working on this module, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the module manager, click “Cancel” in the upper right corner. 50 Insert an Image into a Module 1. Upload the image by following the instructions in chapter five of this tutorial if you have not already done so. 2. From the Administrator menu, go to Extensions > Module Manager. 3. Click on the title of the module you want to edit. 51 4. In the “Custom Output” area, place your cursor where you want the image to appear. 52 There are two ways to insert the image at this point. First is the easiest way. 5. Click the “Image” button underneath the “Custom Output” area. 6. A window will appear on the containing your image files. Click on the image you would like to insert. If it is in a subfolder, click on that folder first, then the image. 7. Once you have selected the image you want to insert, click the “insert” button in the upper right corner of the window. 8. You will then see the image appear in the “Custom Output” area. 9. A. If you want to save your changes and be sent back to the manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the manager, click “Close” in the upper right corner. 53 The other way to insert an image is a little more involved. Follow steps 1 - 4 before this step 5: 5. Click the “Insert/Edit Image” button above the “Custom Output” area. 6. The “Insert/Edit Image” window will appear on the screen. Type the path to the image in the “Image URL” window”. The URL... 7. Click the “Insert” button in the bottom left corner of the window. 8. You will then see the image appear in the description area. 9. A. If you want to save your changes and be sent back to the manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the manager, click “Close” in the upper right corner. 54 Enable or Disable a Module 1. Upload the image by following the instructions in chapter five of this tutorial if you have not already done so. 2. From the Administrator menu, go to Extensions > Module Manager. 3. Click on the title of the module you want to edit. 55 Chapter 8: Publish or Unpublish Publishing an article, category or section enables them to be visible on the front-end of your website. Publish or Unpublish Articles, Categories & Sections 1. From the Administrator menu, go to the Article, Category or Section Manager under Content. 2. In the “Published” column there is an icon for each item. Click on this icon to toggle between published and unpublished. If an item has a green icon in this column, then it is published. If it has a red icon, it is unpublished. 56 Chapter 9: Contacts In order to create a contact page for your website, you must first create a contact component. Add a New Contact 1. From the Administrator menu, go to Components > Contacts > Contacts. 2. Click the “New” button. 57 3. Type the name of your contact in the “Title” field. 4. Type the contacts information (such as email address street address, etc.) in the appropriate fields. There is a “Miscellaneous Information” field if you have additional information that does not have a designated field. 5. In the Parameters area, you can choose to show or hide different pieces of information. 6. A. If you want to save your changes and be sent back to the contact manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working on this contact, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the contact manager, click “Cancel” in the upper right corner. 58 Edit a Contact 1. From the Administrator menu, go to Components > Contacts > Contacts. 2. Click the name of the contact you want to edit. 3. Edit the name, address, etc. of the contact. 4. A. If you want to save your changes and be sent back to the contact manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working on this contact, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the contact manager, click “Cancel” in the upper right corner. 59 Chapter 10: Wrappers If you want to add a link on your website that links to an external website, a wrapper is the solution. A wrapper displays an external page or site on your website without actually leaving your website. A wrapper is actually a menu item type (you can learn more about menu item types in chapter six of this tutorial). To create a wrapper, you must first create a hidden menu. Create a Hidden Menu 1. From the Administrator menu, go to Menus > Menu Manager. 2. Click on the “New” button. 3. Type the unique name for your menu. This can be “hiddenmenu”. 4. Type the title in the appropriate field. The title can be the same as the unique name (hiddenmenu). 5. Click the “Save” button. 60 Create a Wrapped Item 1. From the Administrator menu, go to Menus > hiddenmenu. 2. Click on the “New” button. 3. Choose “Wrapper” as the menu item type. 61 4. Type the name of the wrapper in the “Title” field. 5. Type or copy and paste the URL of the wrapper in the “Wrapper URL” field under basic parameters. Remember to include the “http://”. 6. Click the “Save” button. 7. After clicking “Save”, you will arrive at the menu manager. Make note of the “ItemID” (on the right side of the screen) of the menu item you just created. 62 8. From the Administrator menu , go to Content > Article Manager. 9. Click on the title of the article that contains (or will contain) the hyperlink to the external website. 10. Scroll down to the description area. 63 11. Type or copy and paste the text of that you would like to make a link as you would normal text. 12. Highlight the text you would like to link. 13. Click on the “Insert/Edit Link” button above the description area. 14. In the “Insert/Edit Link” window, copy and paste the following in the “Link URL” field: index.php?option=com_wrapper&view=wrapper&Itemid=1 15. Replace the “1” on the end of the above code and replace it with the ItemID youo took note of earlier. 16. Click the “Update” button. 17. A. If you want to save your changes and be sent back to the article manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working on this article, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the article manager, click “Cancel” in the upper right corner. 64 Edit a Wrapped Item 1. From the Administrator menu, go to Menus > hiddenmenu. 2. Click on the title of the wrapped menu item you wish to edit. 3. Edit the wrapper URL, title, etc. of the wrapper. 4. A. If you want to save your changes and be sent back to the menu item manager, click “Save” from the upper right corner of the screen. B. If you want to save your changes and continue working on this menu item, click “Apply” in the upper right corner. C. If you do not want to save your changes and you want to be sent back to the menu item manager, click “Cancel” in the upper right corner. 65 Congratulations! Congratulations! You have successfully learned how to manage your website content with Joomla. If you have any questions or need help with this or any other Macrobatix tutorial please send email to [email protected]. Please visit www.macrobatix.com/tutorials to see other information and tutorials. 66
© Copyright 2024