modules

modules

  • Adding a Custom Module

    • How to video:

    The procedure explains how to add a Custom HTML module in Joomla! 3.x using the Administrator interface. A Custom HTML module is a block of formatted text that can be configured to appear when one or more menu items are accessed.


    A custom module allows you to add custom text and/or an image and place it in a position on the website.

    Create a new Module

    1. In the Joomla! back-end (Control Panel), navigate to Extensions > Modules, then click the New Button to create a new module
      Creating a new Custom Module
    2. For "Select a Module Type," select Custom:
      Selecting "Custom" for the module type
    3. Enter the name of your module in the "Title *" field (see #1 below).
    4. (Optional) click "Hide" under "Show title" selection to the right if the module title should not be shown (see #2 below).
    5. For "Position," click the dropdown menu, and select the desired module position.  For example, to display the module to the right of the content area, select "Sidebar-b [sidebar-b]" (see #3 below).
    6. Under the formatting toolbars, enter the text that you would like to appear in the module.  You can format the text using the buttons on the editor toolbars (see #4 below).
    7. Click the "Menu Assignment" menu to specify which menu items will display your module (see #5 below).
    8. If the new module should appear on all pages, leave "On all pages" selected. If not, go to the next section, "Assigning the module to specific menu items."Configure Custom Module

    Assigning the Module to specific menu items

    If the module should appear only when one or more specific menu items are accessed, do the following:

    • On the "Menu Assignment" tab, click the dropdown box to the right of Module Assignment and select "Only on the pages selected" (see #1 below).
    • For Menu Selection, click "None" to the right of Select (see #2 below).
    • Click the check boxes for any menu items that should display the module when clicked (see #3 below).

    Assigning module to menu items

    Saving the Module

    • To save changes and continue editing the module, click the Savebutton to the upper left of the web page: Save button
    • When you are done editing the module, click "Save & Close" to the upper left to save your new module: Save & Close button
    • Video Included: Video Included
  • Adding a Custom Module (Joomla! 4)

    • How to video:

    The procedure explains how to add a Custom HTML module in Joomla! 3.x using the Administrator interface. A Custom HTML module is a block of formatted text that can be configured to appear when one or more menu items are accessed.


    A custom module allows you to add custom text and/or an image and place it in a position on the website.

    Create a new Module

    1. In the Joomla! back-end (Control Panel), navigate to Extensions > Modules, then click the New Button to create a new module
      Screenshot 2023 03 20 at 3.23.07 PM
    2. For "Select a Module Type," select Custom:
      Screenshot 2023 03 20 at 3.26.30 PM
    3. Enter the name of your module in the "Title *" field (see #1 below).
    4. (Optional) click "Hide" under "Show title" selection to the right if the module title should not be shown (see #2 below).
    5. For "Position," click the dropdown menu, and select the desired module position.  For example, to display the module to the right of the content area, select "Sidebar-b [sidebar-b]" (see #3 below).
    6. Under the formatting toolbars, enter the text that you would like to appear in the module.  You can format the text using the buttons on the editor toolbars (see #4 below).
    7. Click the "Menu Assignment" menu to specify which menu items will display your module (see #5 below).
    8. If the new module should appear on all pages, leave "On all pages" selected. If not, go to the next section, "Assigning the module to specific menu items."Screenshot 2023 03 20 at 3.27.40 PM

    Assigning the Module to specific menu items

    If the module should appear only when one or more specific menu items are accessed, do the following:

    • On the "Menu Assignment" tab, click the dropdown box to the right of Module Assignment and select "Only on the pages selected" (see #1 below).
    • For Menu Selection, click "None" to the right of Select (see #2 below).
    • Click the check boxes for any menu items that should display the module when clicked (see #3 below).

    Assigning module to menu items

    Saving the Module

    • To save changes and continue editing the module, click the Savebutton to the upper left of the web page: Save button
    • When you are done editing the module, click "Save & Close" to the upper left to save your new module: Save & Close button
    • Video Included: Video Included
  • Adding Menu Modules

    • How to video:

    Overview

    It is useful to display right hand menu modules on your site pages. These modules remain visible after a dropdown menu item on the Main Menu is clicked.

    Example of a right side menu module that displays the same menu items as a dropdown menu item list from the Main Menu

    Procedure

    1. In the Joomla! control panel (back end), navigate to Extensions > Modules, then click the New button to create a new module:

      Click the New Button to create a new module

    2. For "Select a Module Type," select "Menu"
    3. Enter a title for the module in the "Title" field. For example, if you want to display a menu of the dropdown menu items under "People" on the Main Menu, enter "People" for the title.
    4. Configure Module Options:
      • For "Select Menu," select the menu to be displayed
      • For "Start Level," select "2."  This will display the dropdown menu item list corresponding to the menu assignment (selected later in this procedure)
      • For "Show Title," click Show
      • For "Position," select "sidebar-b" (this is the right side of the web page)
      Configure Module Options
    5. Click the "Menu Assignment" tab:
      "Menu Assignment" tab
    6. Change "Module Assignment" to "Only on the pages selected"
    7. For "Menu Selection," click the "None" link shown after "Select: All,"
    8. Select the menu items corresponding to the dropdown menu item list where this module should be displayed.  For example, if you are creating a menu module for the "People" dropdown list, check off the menu items under "People:"
      Selecting the menu items under "People" on the "Menu Assignment" tab
    • Video Included: Video Included
  • Adding Menu Modules (Joomla! 4)

    • How to video:

    Overview

    It is useful to display right hand menu modules on your site pages. These modules remain visible after a dropdown menu item on the Main Menu is clicked.

    Example of a right side menu module that displays the same menu items as a dropdown menu item list from the Main Menu

    Procedure

    1. In the Joomla! control panel (back end), navigate to Extensions > Modules, then click the New button to create a new module:



    2. For "Select a Module Type," select "Menu"
    3. Enter a title for the module in the "Title" field. For example, if you want to display a menu of the dropdown menu items under "People" on the Main Menu, enter "People" for the title.
    4. Configure Module Options:
      • For "Select Menu," select the menu to be displayed
      • For "Start Level," select "2."  This will display the dropdown menu item list corresponding to the menu assignment (selected later in this procedure)
      • For "Show Title," click Show
      • For "Position," select "sidebar-b" (this is the right side of the web page)
      Configure Module Options
    5. Click the "Menu Assignment" tab:
      "Menu Assignment" tab
    6. Change "Module Assignment" to "Only on the pages selected"
    7. For "Menu Selection," click the "None" link shown after "Select: All,"
    8. Select the menu items corresponding to the dropdown menu item list where this module should be displayed.  For example, if you are creating a menu module for the "People" dropdown list, check off the menu items under "People:"
      Selecting the menu items under "People" on the "Menu Assignment" tab
    • Video Included: Video Included
  • Assigning a Module to one or more menu items

    • How to video:

    Overview

    By default, Joomla! assigns a new module to all pages, which may not always be appropriate.  This procedure explains how to restrict the display of a module to one or more menu items using the Administrator interface.  The module will only appear when the selected menu items are accessed. 


    Assigning the Module to specific menu items

    1. In the Joomla! back-end (Control Panel), navigate to Extensions > Modules
    2. Click the title of the module
    3. Click the "Menu Assignment" tab
    4. Click the dropdown box to the right of Module Assignment and select "Only on the pages selected" (see #1 below).
    5. For Menu Selection, click "None" to the right of Select (see #2 below).
    6. Click the check boxes for any menu items that should display the module when clicked (see #3 below).

    Assigning module to menu items

    Saving the Module

    • To save changes and continue editing the module, click the Savebutton to the upper left of the web page: Save button
    • When you are done editing the module, click "Save & Close" to the upper left to save your new module: Save & Close button
    • Video Included: Video Included
  • Assigning a Module to one or more menu items (Joomla! 4)

    • How to video:

    Overview

    By default, Joomla! assigns a new module to all pages, which may not always be appropriate.  This procedure explains how to restrict the display of a module to one or more menu items using the Administrator interface.  The module will only appear when the selected menu items are accessed. 


    Assigning the Module to specific menu items

    1. In the Joomla! back-end (Control Panel), navigate to Extensions > Modules
    2. Click the title of the module
    3. Click the "Menu Assignment" tab
    4. Click the dropdown box to the right of Module Assignment and select "Only on the pages selected" (see #1 below).
    5. For Menu Selection, click "None" to the right of Select (see #2 below).
    6. Click the check boxes for any menu items that should display the module when clicked (see #3 below).

    Assigning module to menu items

    Saving the Module

    • To save changes and continue editing the module, click the Savebutton to the upper left of the web page: Save button
    • When you are done editing the module, click "Save & Close" to the upper left to save your new module: Save & Close button
    • Video Included: Video Included
  • Creating an "Articles - Category" module to display a Category List

    • How to video:

    Overview

    You can use an "Articles - Category" module to display a list of articles from a category in a module position on your website.

    Example

    For example, this site a separate article for each graduate course offering.  The course offering articles are separated into subcategories.

    Example of "Articles - Category" module 

    Procedure

    1. In the Joomla! back-end (Control Panel), navigate to Extensions > Modules, then click the New button to create a new module:

      Creating a new module
    2. For "Select a Module Type:" select "Articles - Category" (not "Articles - Categories"):
      Selecting "Articles - Category" for module type
    3. Enter a title for your module in the "Title" field.
    4. For "Position," click the dropdown menu, and select the desired module position.  For example, to display the module to the right of the content area, select "Sidebar-b [sidebar-b]".
    5. Click the "Menu Assignment" menu to specify which menu items will display your module
    6. Click the "Filtering Options" tab (see #1 below):
      • For "Count," select the number of articles to be displayed; to display all articles from the category, leave this as "0" (see #2 below)
      • Change "Featured Articles" from "Show" to "Hide" to hide featured articles; or to "Only" to display only featured articles (see #3 below)
      • Click in the "Category" field and select one or more categories whose articles should be displayed in the module (see #4 below)
      • If articles from a categories' subcategories should be displayed, change "Child Category Articles" to "Include" (see #5 below)

        "Articles - Category" module: filtering options
    7. Click the "Ordering Options" tab.
    8. Select the option from "Article Field to Order By" based on how the articles should be ordered within the module.
      • For example, selecting "Article Field to Order By" to "Random" will display the articles in a random order every time the module is displayed.
      • To set your own order for the articles, select "Article Order," then refer to the procedure "Re-order Articles"

        "Articles - Category" module: "Ordering Options" tab
    9. Click the "Grouping Options" tab.
      • If you want the articles to be grouped within the module, select an option from the "Article Grouping" drop-down menu (see #1 below).
        • For example, selecting "Category" will group the articles into their subcategories.
      • Leave "Grouping Direction" as "Ascending" unless the article groups should be displayed in reverse order (see #2 below).

        "Articles - Category" module: Grouping options
    10. Click the "Display Options" tab.
      • By default, "Linked Titles" is set to "Yes," meaning you can click the article titles to be redirected to the corresponding articles. 
      • Additionally, you can display other elements from the articles, such as the date, category, intro text or a Read More link.
      "Articles - Category" module: "Display Options" tab
    11. When done, click Save & Close: Save & Close
    • Video Included: Video Included
  • Creating an "Articles - Category" module to display a Category List (Joomla! 4)

    • How to video:

    Overview

    You can use an "Articles - Category" module to display a list of articles from a category in a module position on your website.

    Example

    For example, this site a separate article for each graduate course offering.  The course offering articles are separated into subcategories.

    Example of "Articles - Category" module 

    Procedure

    1. In the Joomla! back-end (Control Panel), navigate to Extensions > Modules, then click the New button to create a new module:

      Screenshot 2023 03 20 at 3.53.40 PM
    2. For "Select a Module Type:" select "Articles - Category" (not "Articles - Categories"):
      Screenshot 2023 03 20 at 3.57.02 PM
    3. Enter a title for your module in the "Title" field.
    4. For "Position," click the dropdown menu, and select the desired module position.  For example, to display the module to the right of the content area, select "Sidebar-b [sidebar-b]".
    5. Click the "Menu Assignment" menu to specify which menu items will display your module
    6. Click the "Filtering Options" tab (see #1 below):
      • For "Count," select the number of articles to be displayed; to display all articles from the category, leave this as "0" (see #2 below)
      • Change "Featured Articles" from "Show" to "Hide" to hide featured articles; or to "Only" to display only featured articles (see #3 below)
      • Click in the "Category" field and select one or more categories whose articles should be displayed in the module (see #4 below)
      • If articles from a categories' subcategories should be displayed, change "Child Category Articles" to "Include" (see #5 below)

        Screenshot 2023 03 20 at 4.00.57 PM
    7. Click the "Ordering Options" tab.
    8. Select the option from "Article Field to Order By" based on how the articles should be ordered within the module.
      • For example, selecting "Article Field to Order By" to "Random" will display the articles in a random order every time the module is displayed.
      • To set your own order for the articles, select "Article Order," then refer to the procedure "Re-order Articles"

        "Articles - Category" module: "Ordering Options" tab
    9. Click the "Grouping Options" tab.
      • If you want the articles to be grouped within the module, select an option from the "Article Grouping" drop-down menu (see #1 below).
        • For example, selecting "Category" will group the articles into their subcategories.
      • Leave "Grouping Direction" as "Ascending" unless the article groups should be displayed in reverse order (see #2 below).

        "Articles - Category" module: Grouping options
    10. Click the "Display Options" tab.
      • By default, "Linked Titles" is set to "Yes," meaning you can click the article titles to be redirected to the corresponding articles. 
      • Additionally, you can display other elements from the articles, such as the date, category, intro text or a Read More link.
      "Articles - Category" module: "Display Options" tab
    11. When done, click Save & Close: Save & Close
    • Video Included: Video Included
  • Creating an "Articles - Newsflash" module to display content

    • How to video:

    Overview

    An "Articles - Newsflash" module can display text from one or more articles.  The ordering can be set to random, so that each time you visit the page where the module is displayed, it will show content from a different article.

    1. In the Joomla! back-end (Control Panel), navigate to Extensions > Modules, then click the New Button to create a new module:

      Creating a new module

    2. For "Select a Module Type," select "Articles - Newsflash"
      Selecting module type "Articles - Newsflash"
    3. Enter the name of the module in the "Title" field.
    4. Under "Position," click the dropdown menu, and select the desired module position.  For example, to display the module to the right of the content area, select "Sidebar-b [sidebar-b]"
    5. Configure the options for the module:
      • For "Category," select the category or categories whose articles will be displayed (see #1 below)
      • Change "Show Images" to "Yes" if images from the articles should be displayed in the module (see #2 below)
      • For "'Read more...' Link", click "Show" if you would like to display a "Read more" link that links to the full article (see #3 below)
      • For "Number of Articles," enter the number of articles to be displayed by the module (see #4 below)
      • For "Order Results," select how the articles should be ordered (see #5 below).  The options are:
        • Published Date
        • Created Date
        • Modified Date
        • Ordering (i.e. article ordering)
        • Hits (number of hits)
        • Random

      • Configuring options for an "Articles - Newsflash" module
    6. By default, Joomla! will assign the new module to all pages.  To display the module only on selected pages, follow the documentation for Assigning a Module to one or more menu items.
    7. When done, click Save & Close to the upper left: "Save & Close" button
    • Video Included: Video Included
  • Creating an "Articles - Newsflash" module to display content (Joomla!4)

    • How to video:

    Overview

    An "Articles - Newsflash" module can display text from one or more articles.  The ordering can be set to random, so that each time you visit the page where the module is displayed, it will show content from a different article.

    1. In the Joomla! back-end (Control Panel), navigate to Extensions > Modules, then click the New Button to create a new module:

      Creating a new module
    2. For "Select a Module Type," select "Articles - Newsflash"
      Screenshot 2023 03 21 at 2.30.10 PM
    3. Enter the name of the module in the "Title" field.
    4. Under "Position," click the dropdown menu, and select the desired module position.  For example, to display the module to the right of the content area, select "Sidebar-b [sidebar-b]"
    5. Configure the options for the module:
      • For "Category," select the category or categories whose articles will be displayed (see #1 below)
      • Change "Show Images" to "Yes" if images from the articles should be displayed in the module (see #2 below)
      • For "'Read more...' Link", click "Show" if you would like to display a "Read more" link that links to the full article (see #3 below)
      • For "Number of Articles," enter the number of articles to be displayed by the module (see #4 below)
      • For "Order Results," select how the articles should be ordered (see #5 below).  The options are:
        • Published Date
        • Created Date
        • Modified Date
        • Ordering (i.e. article ordering)
        • Hits (number of hits)
        • Random

      • Screenshot 2023 03 21 at 2.31.59 PM
    6. By default, Joomla! will assign the new module to all pages.  To display the module only on selected pages, follow the documentation for Assigning a Module to one or more menu items.
    7. When done, click Save & Close to the upper left: Screenshot 2023 03 21 at 2.37.46 PM
    • Video Included: Video Included
  • Displaying a Video Within an Article or Module (Joomla! 3.x)

    The AllVideos plugin allows you to display a video within an article or module and have it play directly on your web site.

    If you would like to use this feature, but do not have the plugin installed, please SUBMIT REQUEST to request us to install the AllVideos plugin for your department.

    Uploading the Video

    This procedure assumes the video has already been uploaded to YouTube.  You will need the URL for the video in order to proceed. 

    Displaying the Video

    Displaying a Video within an Article

    • Select an article to edit following steps 1-3 of Editing Articles (Joomla! 3.x), or create a new article.
    • Click somewhere within the Contenttext box and type or paste the YouTube URL for the video you want to display.
    • If the URL is shown as a hyperlink, highlight it, then click the Unlink button (see #1 below)
    • Enter the code "{ youtube }" (without spaces or quotation marks) before the YouTube URL (see #2 below)
    • Enter the code "{ /youtube }" (without spaces or quotation marks) after the YouTube URL (see #3 below)

      Embedding a YouTube video using AllVideos
    • If you are editing the article from the front end of the web site, click the Save button to save your changes.
    • If you are working in the Joomla! Administrator, to save your changes and continue editing the article, click the Save button to the upper left:  Save button
    • If you are working in the Joomla! Administrator, when you are done editing the article, click the Save & Close button to the upper left: Save & Close button

    Displaying a Video within a Custom Module

    • Log on to your site using the Administrator Login URL.
    • Click on "Extensions > Modules":

      Youtube Link2

    • Click on the Title of a "Custom" module to edit it, or follow steps 1 through 8 of Adding a Custom Module (Joomla! 3.x) to create a new Custom HTML module.
    • Click somewhere within the Module text box and type or paste the YouTube URL for the video you want to display.
    • If the URL is shown as a hyperlink, highlight it, then click the Unlink button (see #1 below)
    • Enter the code "{ youtube }" (without spaces or quotation marks) before the YouTube URL (see #2 below)
    • Enter the code "{ /youtube }" (without spaces or quotation marks) after the YouTube URL (see #3 below)
      Embedding a video within a module using AllVideos
    • Click the Options tab below the title of your module, and change Prepare Content to "Yes" (see #2 below).

      Custom module options: Prepare COontent
    • Click Save & Close to the upper left of the web page: Save & Close button
    • Your module will display the video as embedded content.

    Advanced Options: Set height and width of embedded video

    Note: If AllVideos is set to "Responsive" mode, the following parameters may not work.

    You can add parameters (separated by pipes: "|") after the video URL or video ID to control the width and height of the embedded video. 

    { youtube }VideoID|560|315{ /youtube }    (Note:  Remove spaces surrounding "youtube" and "/youtube".)

    • 560 = width of embedded video will be 560px
    • 315 = height of embedded video will be 315px

    You can also use percentages in place of pixel values:

    e.g. { youtube }VideoID|100%|400{ /youtube }    Note:  Remove spaces surrounding "youtube" and "/youtube".

    • 100% = width of embedded video will be 100% of the available space
    • 400 = height of embedded video will be 400px

    Sample Video Display

    Once you have embedded the video in your article or module, it will look something like this:

  • Displaying a Video Within an Article or Module (Joomla! 4)

    • How to video:

    Uploading the Video

    This procedure assumes the video has already been uploaded to YouTube.  You will need the URL for the video in order to proceed. 

    Displaying the Video

    Displaying a Video within an Article

    • Select an article to edit following steps 1-3 of Editing Articles (Joomla! 4.x), or create a new article.
    • Click somewhere within the Contenttext box and type or paste the YouTube URL for the video you want to display.
    • If the URL is shown as a hyperlink, highlight it, then click the Unlink button (see #1 below)
    • Enter the code "{ youtube }" (without spaces or quotation marks) before the YouTube URL (see #2 below)
    • Enter the code "{ /youtube }" (without spaces or quotation marks) after the YouTube URL (see #3 below)

      Embedding a YouTube video using AllVideos
    • If you are editing the article from the front end of the web site, click the Save button to save your changes.
    • If you are working in the Joomla! Administrator, to save your changes and continue editing the article, click the Save button to the upper left:  Save button
    • If you are working in the Joomla! Administrator, when you are done editing the article, click the Save & Close button to the upper left: Save & Close button

    Displaying a Video within a Custom Module

    • Log on to your site using the Administrator Login URL.
    • Click on "Extensions > Modules":

      Youtube Link2

    • Click on the Title of a "Custom" module to edit it, or follow steps 1 through 8 of Adding a Custom Module (Joomla! 4.x) to create a new Custom HTML module.
    • Click somewhere within the Module text box and type or paste the YouTube URL for the video you want to display.
    • If the URL is shown as a hyperlink, highlight it, then click the Unlink button (see #1 below)
    • Enter the code "{ youtube }" (without spaces or quotation marks) before the YouTube URL (see #2 below)
    • Enter the code "{ /youtube }" (without spaces or quotation marks) after the YouTube URL (see #3 below)
      Embedding a video within a module using AllVideos
    • Click the Options tab below the title of your module, and change Prepare Content to "Yes" (see #2 below).

      Custom module options: Prepare COontent
    • Click Save & Close to the upper left of the web page: Save & Close button
    • Your module will display the video as embedded content.

    Advanced Options: Set height and width of embedded video

    You can add parameters (separated by pipes: "|") after the video URL or video ID to control the width and height of the embedded video. 

    { youtube }VideoID|560|315{ /youtube }    (Note:  Remove spaces surrounding "youtube" and "/youtube".)

    • 560 = width of embedded video will be 560px
    • 315 = height of embedded video will be 315px

    You can also use percentages in place of pixel values:

    e.g. { youtube }VideoID|100%|400{ /youtube }    Note:  Remove spaces surrounding "youtube" and "/youtube".

    • 100% = width of embedded video will be 100% of the available space
    • 400 = height of embedded video will be 400px

    Sample Video Display

    Once you have embedded the video in your article or module, it will look something like this:

    • Video Included: Video Included
  • Editing a Custom Module

    • How to video:

    Overview

    A custom module contains some combination of text, images, and links.  Editing a custom module is very similar to editing an article.

    Example

    In the below screenshot, "Contacts" is a custom module that contains text and links. The title of the module usually appears in a large font above the content within the module.

    Sample custom module

    Procedure

    1. In the Joomla! back-end (Control Panel), navigate to Extensions > Modules (see #1 below)
    2. In the search field, type the name of the module and press [Enter] or click the search icon (see #2 below)
    3. Click the Title of the module (see #3 below)

      Find custom module in "Extensions > Modules"
    4. Under the formatting toolbars, edit the text that appears in the module (see #1 below). You can format the text using the buttons on the editor toolbars (see #2 below).

      Editing a Custom Module
    5. When done, click Save & Close: save and close
    • Video Included: Video Included
  • Editing a Custom Module (Joomla! 4)

    • How to video:

    Overview

    A custom module contains some combination of text, images, and links.  Editing a custom module is very similar to editing an article.

    Example

    In the below screenshot, "Contacts" is a custom module that contains text and links. The title of the module usually appears in a large font above the content within the module.

    Sample custom module

    Procedure

    1. In the Joomla! back-end (Control Panel), navigate to Extensions > Modules, then click the New Button to create a new module:Screenshot 2023 03 20 at 3.53.40 PM
    2. For "Select a Module Type," select "Custom"
    3. Screenshot 2023 03 21 at 2.50.42 PM
    4. Under the formatting toolbars, edit the text that appears in the module (see #1 below). You can format the text using the buttons on the editor toolbars (see #2 below).

      Editing a Custom Module
    5. When done, click Save & Close: save and close
    • Video Included: Video Included
  • Embedding a Map

    {slider • Rutgers Maps}

    When embedding Rutgers Maps (the way that is possible with Google and other maps) is possible, instructions will be posted here.

    {slider title ="• Google Maps" open="true"}

    1) Embed Google map of unit's address within Custom module and assign to Contact Us menu item:

    • Go to Google Maps and enter the building address.
    • Click Share.
    • Click Embed Map.
    • Copy the embed code for the iframe.

    2) Create a new Custom module called "Contact Us - Google Map" 

    • Change "Show Title" to "Hide" 
    • Enter the unit's address at the top of the module after the text "Main office:" 
    • Link the address to its URL as it appears on Google Maps. 
      Example: For  "604 Allison Road, Piscataway, NJ 08854-8082" the link would be:
    <a href="https://www.google.com/maps/place/604+Allison+Rd,+Piscataway+Township,+NJ+08854/@40.5247824,-74.4669924,17z/data=!3m1!4b1!4m5!3m4!1s0x89c3c70d50b175d7:0x495c76a64748b442!8m2!3d40.5247824!4d-74.4648037" target="_blank" rel="noopener">
    
    • If asked to add "mailto:" to the URL, click No.
    • Switch to the Source Code editor and paste the embed code for the Google Map below the address.
    • Modify the code to change the iframe's width to 100% and height to 400.
    • Add the following paragraph tags (with aria code) before and after the embedded map:
    <p aria-hidden="true" aria-role="presentation">
        <iframe src="/actual-map-goes-here" width="100%" height="400" style="border: 0;" frameborder="0" allowfullscreen="allowfullscreen"></iframe>
    </p>
    
    • For Position, select "extension-a".
    • Assign the module to the Contact Us menu item on the Main Menu.
    • Save & Close the module.

    {/sliders}

     

     

  • Embedding a Map (Joomla! 4)

    {slider • Rutgers Maps}

    When embedding Rutgers Maps (the way that is possible with Google and other maps) is possible, instructions will be posted here.

    {slider title ="• Google Maps" open="true"}

    1) Embed Google map of unit's address within Custom module and assign to Contact Us menu item:

    • Go to Google Maps and enter the building address.
    • Click Share.
    • Click Embed Map.
    • Copy the embed code for the iframe.

    2) Create a new Custom module called "Contact Us - Google Map" 

    • Change "Show Title" to "Hide" 
    • Enter the unit's address at the top of the module after the text "Main office:" 
    • Link the address to its URL as it appears on Google Maps. 
      Example: For  "604 Allison Road, Piscataway, NJ 08854-8082" the link would be:
    <a href="https://www.google.com/maps/place/604+Allison+Rd,+Piscataway+Township,+NJ+08854/@40.5247824,-74.4669924,17z/data=!3m1!4b1!4m5!3m4!1s0x89c3c70d50b175d7:0x495c76a64748b442!8m2!3d40.5247824!4d-74.4648037" target="_blank" rel="noopener">
    
    • If asked to add "mailto:" to the URL, click No.
    • Switch to the Source Code editor and paste the embed code for the Google Map below the address.
    • Modify the code to change the iframe's width to 100% and height to 400.
    • Add the following paragraph tags (with aria code) before and after the embedded map:
    <p aria-hidden="true" aria-role="presentation">
        <iframe src="/actual-map-goes-here" width="100%" height="400" style="border: 0;" frameborder="0" allowfullscreen="allowfullscreen"></iframe>
    </p>
    
    • For Position, select "extension-a".
    • Assign the module to the Contact Us menu item on the Main Menu.
    • Save & Close the module.

    {/sliders}

     

     

  • Module Positions

    • How to video:

    Overview

    A module's position refers to its location on the web page.  A module position can usually be identified by its location outside the main content area where articles appear.  Each Joomla! template will have a different list of module positions. 

    SAS-RED module positions

    SAS-RED is the template used for SAS unit websites.  Some of the most commonly used menu positions are:

    Ccommonly used module positions in the SAS-RED template

    • Showcase-a - This position is located directly below the main menu, and spans the width of the page.  Showcase-a typically contains a SmartSlider slideshow or a single image with aspect ratio 3:1.
    • sidebar-b - This position sits to the right of the article area. On the homepage, this position will usually be occupied by a JEvents Latest Events module.  On most other pages, a menu module will appear in sidebar-b.  You can have several modules in the sidebar-b position; they will stack vertically.  If there are no sidebar-b modules on a page, the article area will extend to the right side of the page.
    • Mainbottom positions - Modules in these positions appear below the article area and any sidebar-b modules.  You can have up to four modules in Mainbottom positions; these positions area named (from left to right) Mainbottom-A, Mainbottom-B, Mainbottom-C and Mainbottom-D. These positions work best if you have modules in three or four of them, with each being a custom module containing a square image measuring 460 pixels per side.  The images within the modules should be linked to important pages on the website.  
    • extension positions - These module positions occupy the area below the Mainbottom positions, and essentially serve the same purpose. Use the extension positions if you need a second row of square custom modules below the Mainbottom modules.  The extension positions are named (from left to right) extension-a, extension-b, extension-c and extension-d.
    • Video Included: Video Included
  • Module Positions (Joomla!4)

    • How to video:

    Overview

    A module's position refers to its location on the web page.  A module position can usually be identified by its location outside the main content area where articles appear.  Each Joomla! template will have a different list of module positions. 

    SAS-RED module positions

    SAS-RED is the template used for SAS unit websites.  Some of the most commonly used menu positions are:

    Ccommonly used module positions in the SAS-RED template

    • Showcase-a - This position is located directly below the main menu, and spans the width of the page.  Showcase-a typically contains a SmartSlider slideshow or a single image with aspect ratio 3:1.
    • sidebar-b - This position sits to the right of the article area. On the homepage, this position will usually be occupied by a JEvents Latest Events module.  On most other pages, a menu module will appear in sidebar-b.  You can have several modules in the sidebar-b position; they will stack vertically.  If there are no sidebar-b modules on a page, the article area will extend to the right side of the page.
    • Mainbottom positions - Modules in these positions appear below the article area and any sidebar-b modules.  You can have up to four modules in Mainbottom positions; these positions area named (from left to right) Mainbottom-A, Mainbottom-B, Mainbottom-C and Mainbottom-D. These positions work best if you have modules in three or four of them, with each being a custom module containing a square image measuring 460 pixels per side.  The images within the modules should be linked to important pages on the website.  
    • extension positions - These module positions occupy the area below the Mainbottom positions, and essentially serve the same purpose. Use the extension positions if you need a second row of square custom modules below the Mainbottom modules.  The extension positions are named (from left to right) extension-a, extension-b, extension-c and extension-d.
    • Video Included: Video Included
  • Overview: What is a Module?

    • How to video:

    Overview

    A module in Joomla! is a "mini program" that can be displayed in various positions on the website.  Modules can make your site more dynamic and easier to work with if used properly.  You can usually identify an article by its location on the website outside the main content area where articles appear.

    Types of modules

    There are many different types of modules, each with different functionality.  Some modules are included with Joomla!; these are called "core modules."  Other modules come from developers outside the Joomla! Project; these are called "third-party modules."

    Core modules

    Some of the core Joomla! modules documented on this website include:

    Third-party modules

    Some of the third-party modules documented on this website include:

    Properties

    Every module has two very important properties:

    1. Position
    2. Menu Assignment
    • Video Included: Video Included
  • Overview: What is a Module? (Joomla!4)

    • How to video:

    Overview

    A module in Joomla! is a "mini program" that can be displayed in various positions on the website.  Modules can make your site more dynamic and easier to work with if used properly.  You can usually identify an article by its location on the website outside the main content area where articles appear.

    Types of modules

    There are many different types of modules, each with different functionality.  Some modules are included with Joomla!; these are called "core modules."  Other modules come from developers outside the Joomla! Project; these are called "third-party modules."

    Core modules

    Some of the core Joomla! modules documented on this website include:

    Third-party modules

    Some of the third-party modules documented on this website include:

    Properties

    Every module has two very important properties:

    1. Position
    2. Menu Assignment
    • Video Included: Video Included

Page 1 of 2