Difference between revisions of "Extensions Module Manager Custom HTML"
From Joomla! Documentation
m (→Menu Assignment: category reorganizing) |
m (removing needs images) |
||
| (4 intermediate revisions by 2 users not shown) | |||
| Line 1: | Line 1: | ||
| − | =Custom HTML Module | + | {{RightTOC}} |
| − | == | + | ==How to Access== |
| + | To ''''add'''' a new Custom HTML module or ''''edit'''' an existing Custom HTML module, navigate to the [[Help25:Extensions_Module_Manager|Module Manager]]: | ||
| + | * Select {{rarr|Extensions,Module Manager}} | ||
| + | |||
| + | Click the ''''New'''' button and click on Custom HTML in the modal popup window. | ||
| + | |||
| + | To ''''Edit'''' an existing Custom HTML module, in the Module Manager click on an '''Custom HTML Modules Title''' or click the '''Custom HTML modules check box''' and then click the '''Edit''' button in the Toolbar. | ||
| + | |||
| + | ==Description== | ||
This allows you to create a Module that contains any valid HTML code. There are many cases where you might want to put free-form HTML inside a web page. For example, you might want to create an HTML Image Map or you might want to copy HTML code from PayPal, Amazon, or some other site. | This allows you to create a Module that contains any valid HTML code. There are many cases where you might want to put free-form HTML inside a web page. For example, you might want to create an HTML Image Map or you might want to copy HTML code from PayPal, Amazon, or some other site. | ||
The Custom HTML Module allows you to create a self-contained HTML unit and then put it in any valid location on a page. | The Custom HTML Module allows you to create a self-contained HTML unit and then put it in any valid location on a page. | ||
| − | == | + | ==Screenshot== |
| − | {{Chunk25: | + | [[File:Help25-module-manager-custom-html-screenshot.png]] |
| + | |||
| + | ==Details and Options== | ||
| + | ===Details=== | ||
| + | {{Chunk25:Module Details}} | ||
| − | == | + | ===Basic Options=== |
| + | [[Image:25custom htmlmod-basicparams.png]] | ||
| + | {{Chunk25:colheader|Prepare Content}} | ||
| + | *'''Select a Background-Image.''' Select an image to be applied as a background to the inner-div. | ||
| − | == | + | ===Advanced Options=== |
| − | + | {{Chunk25:Module Advanced Options}} | |
| − | == | + | ===Menu Assignment=== |
| − | + | {{Chunk25:Menu Assignment}} | |
| − | |||
| − | |||
| − | |||
| − | ==Custom Output== | + | ===Custom Output=== |
When you create or edit a Custom HTML Module, an editor session is opened using your default editor. | When you create or edit a Custom HTML Module, an editor session is opened using your default editor. | ||
:''Important Note:'' The editor does not allow you to enter certain HTML tags. To work around this, you can temporarily change your User's editor to "No Editor", create the Custom HTML Module, and then change the editor back to TinyMCE. Another option is to use an editor from an Extension that allows HTML code to be entered. Another possibility is (if the editor has this option) to switch to the HTML mode, enter the code, save and switch back to normal view. | :''Important Note:'' The editor does not allow you to enter certain HTML tags. To work around this, you can temporarily change your User's editor to "No Editor", create the Custom HTML Module, and then change the editor back to TinyMCE. Another option is to use an editor from an Extension that allows HTML code to be entered. Another possibility is (if the editor has this option) to switch to the HTML mode, enter the code, save and switch back to normal view. | ||
| − | An example of a Custom HTML editor session is shown below. Note that the "No Editor" option is being used.[[Image: | + | An example of a Custom HTML editor session is shown below. Note that the "No Editor" option is being used. |
| + | |||
| + | [[Image:Help25-module-manager-custom-html-custom-output-no-editor.png]] | ||
| + | |||
| + | ==Toolbar== | ||
| + | {{Chunk25:Help_screen_module_manager_edit_toolbar}} | ||
| + | |||
| + | ==Front End Screenshot== | ||
| + | {{Chunk25:Help screen screenshot disclaimer}} | ||
| + | Custom HTML module shown: | ||
| + | |||
| + | [[Image:Help25-module-manager-custom-html-frontend-screenshot.png]] | ||
| − | + | The Module Type name for this Module is "mod_custom". It is not related to any other component. | |
<noinclude>{{cathelp|2.5|Module Manager Help Screens|Extensions Help Screens}}</noinclude> | <noinclude>{{cathelp|2.5|Module Manager Help Screens|Extensions Help Screens}}</noinclude> | ||
Latest revision as of 07:32, 10 April 2013
How to Access[edit]
To 'add' a new Custom HTML module or 'edit' an existing Custom HTML module, navigate to the Module Manager:
- Select Extensions → Module Manager
Click the 'New' button and click on Custom HTML in the modal popup window.
To 'Edit' an existing Custom HTML module, in the Module Manager click on an Custom HTML Modules Title or click the Custom HTML modules check box and then click the Edit button in the Toolbar.
Description[edit]
This allows you to create a Module that contains any valid HTML code. There are many cases where you might want to put free-form HTML inside a web page. For example, you might want to create an HTML Image Map or you might want to copy HTML code from PayPal, Amazon, or some other site.
The Custom HTML Module allows you to create a self-contained HTML unit and then put it in any valid location on a page.
Screenshot[edit]
Details and Options[edit]
Details[edit]
- Title. The title of the module. This is also the title displayed in the front end for the module depending on the Show Title Form Field
- Show Title. (Show/Hide) Choose whether to show or hide the modules title in the front end. The title will be the one in the Form Field above.
- Module Position. Choose the module position you wish this module to be displayed in. A custom module position can be entered for use with the load position plugin or the position button can be pressed to select a module position from the template.
- Status. (Published/Unpublished/Archived/Trashed) The published status of the item.
- Access. The viewing level access for this item.
- Module Ordering. This shows a drop down of every module in the position that the current module is in. This is the order that the modules will display in when displayed on in the front end as well as in the Module Manager.
- Start Publishing. Date and time to start publishing. Use this field if you want to enter content ahead of time and then have it published automatically at a future time.
- Finish Publishing. Date and time to finish publishing. Use this field if you want to have content automatically changed to Unpublished state at a future time (for example, when it is no longer applicable).
- Language. Item language.
- Note. Item note. This is normally for the site administrator's use (for example, to document information about this item) and does not show in the front end of the site.
Basic Options[edit]
- Prepare Content. (Yes/No) Prepare the content with the Joomla content plugins.
- Select a Background-Image. Select an image to be applied as a background to the inner-div.
Advanced Options[edit]
- Alternative Layout. If you have defined one or more alternative layouts for a module either in the template or Joomla! Core, you can select the layout to use for this module. See Layout Overrides in Joomla 2.5 for more information about alternative layouts.
- Module Class Suffix. Setting this parameter causes Joomla! to either add a new CSS class or modify the existing CSS class for the div element for this specific module. See here for more information
- Caching. (Use Global/No Caching) Choose whether you wish to cache the contents of the module.
- Cache Time. The time before a module is recached.
Menu Assignment[edit]
On the left there is a list of menu items. You can chose between None, All and Select Menu Item(s) from the List. To assign to some but not all pages choose the third option and select the menu links that you want the module associated with. See How do you assign a module to specific pages? for more information
Custom Output[edit]
When you create or edit a Custom HTML Module, an editor session is opened using your default editor.
- Important Note: The editor does not allow you to enter certain HTML tags. To work around this, you can temporarily change your User's editor to "No Editor", create the Custom HTML Module, and then change the editor back to TinyMCE. Another option is to use an editor from an Extension that allows HTML code to be entered. Another possibility is (if the editor has this option) to switch to the HTML mode, enter the code, save and switch back to normal view.
An example of a Custom HTML editor session is shown below. Note that the "No Editor" option is being used.
Toolbar[edit]
At the top right you will see the toolbar:
The functions are:
- Save. Saves the module and stays in the current screen.
- Save & Close. Saves the module and closes the current screen.
- Save & New. Saves the module and keeps the editing screen open and ready to create another module.
- Save as Copy. Saves your changes to a copy of the current module. Does not affect the current module. This toolbar icon is not shown if you are creating a new module.
- Cancel/Close. Closes the current screen and returns to the previous screen without saving any modifications you may have made.
- Help. Opens this help screen.
Front End Screenshot[edit]
Example Front End Site images are generic images using Joomla! core installation supplied free Front End Templates. The actual view can depend on the installed custom template used and the template's style for those views on a Joomla! website. Custom HTML module shown:
The Module Type name for this Module is "mod_custom". It is not related to any other component.