Actions

Help15

Difference between revisions of "Screen.content.edit.15"

From Joomla! Documentation

Line 35: Line 35:
  
 
==Editor - TinyMCE==
 
==Editor - TinyMCE==
The default editor for both front-end and back-end users in Joomla! is the TinyMCE editor.
 
 
 
{{Chunk:TinyMCE}}
 
{{Chunk:TinyMCE}}
  
 
==Editor - No Editor==
 
==Editor - No Editor==
If 'No editor' is selected for a User, then a simple text editor displays. This allows you to enter in raw, unformatted HTML. You can use the toolbar 'Preview' button to preview how the HTML will display.
+
{{Chunk:No editor}}
 
+
Note that the 'No Editor' option can be useful if you are entering in 'boilerplate' or custom HTML, for example to create a PayPal link. TinyMCE automatically re-formats and strips some HTML when a file is saved. This can cause complex HTML to not work correctly.
+
 
+
If this happens, you can temporarily change the editor to 'No Editor' and create the desired content. Note that if you wish to edit this content in the future, you should be careful to change your editor to 'No Editor'. Otherwise, if you open and save the content with TinyMCE, you may lose your custom HTML.
+
  
 
==Parameters - Article==
 
==Parameters - Article==

Revision as of 17:45, 25 April 2008

Copyedit.png
This Page Needs Your Help

This page is tagged because it NEEDS REVIEW. You can help the Joomla! Documentation Wiki by contributing to it.
More pages that need help similar to this one are here. NOTE-If you feel the need is satistified, please remove this notice.


Contents

How to Access

You can access the Article:[New] page either by pressing the 'Add New Article' button on the Control Panel or by clicking the 'New' button on the Article Manager. You can access the Article:[Edit] page from the Article Manager either by clicking on an Article's Title or by clicking the Article's check box and then clicking the 'Edit' button. Both screens have the same functionality.

Description

This is the back-end screen where you can add and edit Articles. The same screen is used for adding a new Article and editing an existing Article. You also select the Section and Category for an Article and indicate whether or not it has a Published state or is selected for the Front Page.

The Article's content is edited using the default editor selected in the User Manager - New/Edit. The Joomla! default editor is called TinyMCE.

A number of Parameters can be set for the Article. Metadata Information can also be entered.

Screenshot

Article edit.png

Heading Information

Enter the heading information for the Article, as shown below:

Article edit header1.png
  • Title. The Title for this item. This may or may not display on the page, depending on the parameter values you choose.
  • Published. Whether or not this item is published. Select Yes or No from the radio button group to set the Published state for this item.
  • Alias. The internal name of the item. Normally, you can leave this blank and Joomla! will fill in a default value. The default value is the Title or Name in lower case and with dashes instead of spaces. You may enter the Alias manually. The Alias should consist of lowercase letters and hyphens (-). No blank spaces or underscores are allowed. The Alias will be used in the URL when SEF is activated. Note: If the title consists of non-Latin characters, the Alias will default to the current date and time, for example "2009-02-11-17-54-38".
  • Front Page. Select No or Yes from the radio button group to indicate whether this Article will show on the Front Page.
  • Section. Select the Section for this Article from the drop-down list box. Note that you can select 'Uncategorized' if you do not want this Article associated with a Section or Category. This can be used for Articles that are displayed in an Article Layout as static content.
  • Category. Select the Category for this Article from the drop-down list box. If you selected 'Uncategorized' for the Section, the Category will automatically be 'Uncategorized'.

On the right side of the header area, information about the Article is displayed, as shown below:

Article edit header2.png
  • Reset button. Press this button to change the Hits to 0.

Image, Pagebreak, and Read More Buttons

Three buttons are located just below the edit window, as shown below:

Article edit bottom buttons.png
  • Image. This button provides an easy way to insert an image into an Article. Images may be inserted from the 'images/stories' folder and may also be uploaded. When you click the Image button, a window pops up, as shown below:
    Article Button.Image Popup.png
    • Directory. The current directory on the host server. This is the 'images/stories' directory under your Joomla! home directory. Use the drop-down list box to select a subdirectory.
    • Up. Navigate to the parent directory. Note that the top directory for this function is 'images/stories'. You can not navigate to a higher directory.
    • Insert. Insert the selected image. The insert point will be the current cursor position. You will see the image display inside the edit window.
    • Cancel. Cancel the operation and close the popup window. You can cancel also in clicking the X at right top corner.
    • Thumbnail Browse Area. Click on an image thumbnail to select the image. Click on a folder icon to navigate to that subdirectory.
    • Image URL. Click on one of the image thumbnails and the URL for the image will be entered for you.
    • Align. Select the desired alignment (left or right) from the drop-down list box.
    • Image Description. Enter a description for the image.
    • Image Title. Enter a Title for this image. This displays when a User hovers the mouse on the image.
    • Caption. If checked, image title will display as a caption below the image.
    • Search... Click this button to browse to an image file to upload from your local computer. A file dialog will open allowing you to select a file.
    • Start Upload. Once you have selected a file, press this button to upload the file to your Joomla! 'images/stories' folder. The thumbnail for the new image will now show in the thumbnail area.
  • Pagebreak. This button allows you to insert a pagebreak inside an Article. A pagebreak allows for page navigation when the article is displayed on a layout. This is useful for long articles. When this button is pressed, a popup window is displayed as shown below:
    Article pagebreak popup.png
    • Page Title. Enter the title to display for the new page (for example, 'Page 2').
    • Table of Contents Alias. Optional field to display in the table of contents for this page. In a multi-page article, Joomla! displays a 'table of contents' for the page that allows the user to select any page. If this field is blank, the Page Title will be used. If you want a different title in the table of contents, enter it here.
    • Insert Pagebreak. Click this button to insert the pagebreak with the entered fields. The Pagebreak will display as a gray dashed line across the Article. Note that a pagebreak cannot be edited. If you need to change a field in the pagebreak, click on the Article just past the pagebreak, press Backspace until the pagebreak is deleted, then insert a new pagebreak with the desired information.
  • Read more... This button inserts a 'Read more...' break in the Article. This shows as a red dotted line across the Article. If an Article has a 'Read more...' break, only the text before the break, called the Into Text, will initially display, along with a 'Read more...' link. If the User clicks this link, either the entire Article or just the part after the 'Read more...' link is displayed. This depends on the setting of the 'Intro Text' parameters for the Article and in the Global Configuration. The 'Read more...' break allows you to save space on pages by just showing the Intro Text. Note that the 'Read more...' break only shows in the Front Page, Section, and Category Blog layouts. If you want to insert breaks for an Article shown in an Article Layout, use the Page Break button.

Editor - TinyMCE

The default editor for both front-end and back-end users in Joomla! is the TinyMCE editor.

TinyMCE is a WYSIWYG (what you see is what you get) editor that allows users a familiar word-processing interface to use when editing Articles and other content. The 3-row toolbar below provides many standard editing commands:

Article tinymce buttons.png
  • Top Row.
    • Buttons in the upper left allow you to make text bold, italic, underlined, or strikethrough. Next to that are buttons for align left, right, center, and full.
    • Styles. Caption and System Pagebreak styles can be set. Highlight the desired text and select the style. This will allow this text to be formatted based on CSS rules.
    • Format. Select pre-defined formats for Paragraph, Address, Heading1, and so on.
    • Font Family. Select the desired font.
  • Second Row.
    • Unordered List, Ordered list, Outdent (move left) and Indent (indent right).
    • Undo (Ctrl+Z) and Re-do (Ctrl+Y).
    • Insert/Edit Link. To insert or edit a link, select the linked text and press this button. A popup dialog displays that lets you enter details about the link.
    • Unlink. To remove a link, highlight the linked text and press this button.
    • Insert/Edit Anchor. An anchor is a bookmark inside an article that lets you link directly to that point in the article. To insert an anchor, move the cursor to the desired location within the article and click this button. A window will display. Enter the name of the Anchor and press Insert. A small anchor icon will show in the location of the anchor. You can edit the name of the anchor by clicking on it and pressing this button. You can delete the anchor just by selecting it and pressing the Delete key.
    • Insert/Edit Image. To insert and image, place the cursor in the desired location and press this button. A popup dialog displays that lets you enter in the Image URL and other information about how the image will display.
    • Cleanup Messy Code. This button allows you to clean up HTML code, perhaps from HTML text that you copied in from another source.
    • Edit HTML Source. A popup displays showing the HTML source code, allowing you to edit the HTML source code.
    • Find and Find/Replace.
    • Insert Date, Time, or Emotions.
    • Insert Embedded Media. To insert embedded media (such as Flash), place the cursor at the desired location and press this button. A popup dialog will display that allows you to enter the Type, File or URL, and other information about the media.
    • Direction Left to Right and Direction Right to Left. These buttons allow you to enter or change the text direction, for example for languages that read right to left.
    • Insert New Layer, Move Forward, Move Backware, Toggle Absolute Position. For working with layered items.
    • Select Text Color.
  • Third Row.
    • Insert Horizontal Ruler.
    • Remove Formatting.
    • Toggle Guidelines/Invisible elements.
    • Subscript, Superscript, Insert Custom Character, Horizontal Rule.
    • Insert New Table, Table Row Properties, Table Cell Properties, Insert Row Before, Insert Row After, Delete Row, Insert Column Before, Insert Column After, Delete Column, Split Merged Table Cells, Merge Table Cells.
    • Toggle Full Screen Mode.
    • Edit CSS Style. A popup dialog box displays that allows you to enter CSS style information for the selected text.

Editor - No Editor

If 'No editor' is selected for a User, then a simple text editor displays. This allows you to enter in raw, unformatted HTML. You can use the toolbar 'Preview' button to preview how the HTML will display.

Note that the 'No Editor' option can be useful if you are entering in 'boilerplate' or custom HTML, for example to create a PayPal link. TinyMCE automatically re-formats and strips some HTML when a file is saved. This can cause complex HTML to not work correctly.

If this happens, you can temporarily change the editor to 'No Editor' and create the desired content. Note that if you wish to edit this content in the future, you should be careful to change your editor to 'No Editor'. Otherwise, if you open and save the content with TinyMCE, you may lose your custom HTML.

Parameters - Article

This section allows you to enter parameters for this Article, as shown below:

Article parameters article.png

These entries are optional. Joomla! automatically creates default entries for these values.

  • Author. Select the Author from the drop-down list box. Default is the current user.
  • Author Alias. This optional field allows you to enter in an alias for this Author for this Article. This allows you to display a different Author name for this Article.
  • Access Level. Who has access to this item. Current options are:
    • Public: Everyone has access
    • Registered: Only registered users have access
    • Special: Only users with author status or higher have access
You can change an item's Access Level by clicking on the icon in the column.
  • Created Date. This field defaults to the current time when the Article was created. You can enter in a different date and time or click on the calendar icon to find the desired date.
  • 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).

Parameters - Advanced

This section allows you to enter additional parameters for this Article, as shown below:

Article parameters advanced.png

These parameters allow you to override the parameters set in the Parameter/Global Configuration setup in the Article Manager and the Parmeters - Component settings in the Menu Item Manager.

A value of 'Use Global' means that either the setting from the Menu Item or the setting from the Global Configuration will control the action. A setting other than 'Use Global' will always control the action and override settings from these other areas. The setting here takes top priority. The setting in the Menu Item is second priority. The setting in the Global Configuration controls if both of the other setting are set to 'Use Global'.

  • Show Title. (Use Global/No/Yes). Whether or not to show the Article's Title.
  • Title Linkable. (No/Yes/Use Global) Whether or not the Title of the Article will be a hyperlink to the Article.
  • Intro Text. (Use Global/Hide/Show). Hide or Show the Article's Intro Text when the 'Read more...' link is selected. Intro Text is the first part of the Article before a 'Read more...' break. If this parameter is 'Show', when the User selects the 'Read more...' link, the entire article will display. If this parameter is 'Hide', when the User selects the 'Read more...' link, only the part of the Article after the 'Read more...' link will display.
  • Section Name. (Hide/Show/Use Global) Whether or not the Section Name will display.
  • Section Title Linkable. (No/Yes/Use Global) Whether or not the Title of the Section will be a hyperlink to the Section page.
  • Category Title. (Hide/Show/Use Global) Whether or not the Category Title will display.
  • Category Title Linkable. (No/Yes/Use Global) Whether or not the Title of the Category will be a hyperlink to the Category page.
  • Article Rating. (Use Global/Hide/Show). Hide or show the Article Rating.
  • Author Name. (Hide/Show/Use Global) Whether or not to display the Author Name.
  • Created Date and Time. (Hide/Show/Use Global) Whether or not to display the date and time the Article was created.
  • Modified Date and Time. (Hide/Show/Use Global) Whether or not to display the date and time the Article was last modified.
  • PDF Icon. (Hide/Show/Use Global) Whether or not to display a button to allow the Article to be rendered in a new window in PDF format. This allows the User to view, print, or save the Article as a PDF file.
  • Print Icon. (Hide/Show/Use Global) Whether or not to display a button to allow the Article to be printed. This allows the User to print the current Article in a printer-friendly format.
  • E-mail Icon. (Hide/Show/Use Global) Whether or not to display a button to allow a link to the Article to be e-mailed. This displays a form that allows the user to send an e-mail with a link to the current Article.
  • Content Language. Language in which this Article is written. This is optional. If no language is selected, the default language for the site is assumed.
  • Key Reference. Optional text key that an Article may be referenced by (for example, a help reference). A normal Joomla! link to an Article is in the form "<home URL>/index.php?option=com_content&view=article&id=22&Itemid=34". In this example, Joomla! is using the "com_content" component, using an "article" layout, showing the Article whose ID is "22", and using the Menu Item whose ItemID is "34". The Key Reference of an Article can be used in a URL instead of the Article's ID. For example, if an Article's Key Reference is "whats.new", then the URL "<home URL>/index.php/?option=com_content&view=article&Itemid=34&task=findkey&keyref=whats.new" could also be used to display the page. The "task=findkey" tells Joomla! to search by Key Reference, and the "keyref=whats.new" provides the Key Reference to search for. Using the Key Reference to link to Articles is more flexible than using Article ID, since you can edit the Key Reference field of existing Articles. Note that, if more than one Article has the same Key Reference, this URL will only find the first Article with this Key Reference.
  • Alternative Read more: text. Optional text to display next to the 'Read more...' link. If no entry is made, the Article Title is used.

Metadata Information

This section allows you to enter Metadata Information for this Article. Metadata is information about the Article that is not displayed but is available to Search Engines and other systems to classify the Article. This gives you more control over how the content will be analyzed by these programs. All of these entries are optional. The entry screen is shown below:

Article metadata.png
  • Metadata Description. Optional Metadata Description for this Article.
  • Metadata Keywords. Optional entry for keywords. Must be entered separated by commas (for example, "cats, dogs, pets") and may be entered in upper or lower case. (For example, "CATS" will match "cats" or "Cats"). Keywords can be used in several ways:
  1. To help Search Engines and other systems classify the content of the Article.
  2. In combination with Banner tags, to display specific Banners based on the Article content. For example, say you have one Banner with an ad for dog products and another Banner for cat products. You can have your dog Banner display when a User is viewing a dog-related Article and your cat Banner display for a cat-related Article. To do this, you would:
    1. Add the keywords 'dog' and 'cat' to the appropriate Articles.
    2. Add the Tags 'dog' and 'cat' to the appropriate Banners in the Banner Manager New/Edit screen.
    3. Set the Banner module Parameter 'Search By Tags' to 'Yes in the Banner Module Edit screen.
  3. In combination with the Related Articles module, to display Articles that share at least one keyword in common. For example, if the current Article displayed has the keywords "cats, dogs, monkeys", any other Articles with at least one of these keywords will show in the Related Articles module.
  • Robots. Optional keywords for Robots. Robots are automated software programs that surf the web and catalog web content. If special keywords are desired for Robots to use, enter them here.
  • Author. Optional entry for an Author name within the metadata.

Toolbar

At the top right you will see the toolbar:

Article edit toolbar.png


  • Preview. Opens a popup window that displays a preview of the Article. This is normally not needed when using a WYSIWYG editor, such as TinyMCE. However, if you are using a plain text editor (for example, the 'No Editor' option), this preview lets you see what the Article will look like when shown on the web site.
  • Save. Save it and return to editing the menu details.
  • Apply. Save it, but stay in the same screen. If you have been working on a screen for a long time and don't want to risk losing your work, pressing Apply saves your work and lets you continue working. If, for example, you lost your Internet connection, your work will be saved up this point.
  • Close. Return to the previous screen without saving your work. If you press Close while adding a new item, this new item will not be created. If you were modifying an existing item, the modifications will not be saved.
  • Help. Opens this Help Screen.

Quick Tips

  • The hierarchy of display parameters is as follows:
    1. Parameters - Advanced for the specific Article. A setting other than 'Use Global' here always controls the setting.
    2. Parameters - Component for the Menu Item. If the Parameters - Advanced above is 'Use Global' and this setting is not 'Use Global', then this controls the setting.
    3. Global Configuration settings in the Article Manager/Parameters section. Settings here only apply if both of the above are set to 'Use Global'.
Example: The 'Title Linkable' setting in the Article's 'Parameters - Advanced' section is set to 'Use Global'. The Menu Item is an Article Layout, and 'Title Linkable' in the 'Parameters - Component' is 'No'. The Global Configuration 'Title Linkable' is set to 'Yes'. The result will be 'Yes', since the Menu Item overrides the Global Configuration.
  • You can add images using either the TinyMCE Insert/Edit Image icon or the Image button below the edit area. For adding new images in an Article, it is easier to use the Image button (below the edit area). This is because it lets you browse to the image file and also lets you upload images. However, for editing an existing image, you need to use the TinyMCE icon. The Image button only supports adding new images.
  • 'Read more...' breaks allow you to save space on the Front Page or on any blog layout page by showing just the first portion of an Article. 'Pagebreaks' allow you to provide multi-page navigation for long Articles. You can use both on one Article, if desired. For example, you could put a 'Read more...' break after the first paragraph of a multi-page article, and have Pagebreaks after each page. No page navigation would display on the Front Page until the User selects the 'Read more...' link. At that time, the Article's table of contents would display showing links to every page.

Related Information

Article Manager