|
|
| Line 1: |
Line 1: |
| − | {{Entry
| + | #REDIRECT [[IceCat/Print Edit]] |
| − | |Name=Print Edit Jump to: navigation,
| |
| − | |Short description=Allows editing of web page content while in Print Preview mode, prior to printing or saving as HTML or PDF. Compacts the layout and removes unwanted content such as adverts, sidebars and blank pages. Any element can be formatted, hidden or deleted.
| |
| − | |Full description=OVERVIEW
| |
| − | | |
| − | Print Edit allows editing of the web page content while in Print Preview mode. Editing the web page prior to printing can compact the layout and remove unwanted content such as adverts, sidebars and blank pages.
| |
| − | | |
| − | In Print Edit mode, the displayed content elements can be edited, formatted, hidden or deleted, prior to printing in Print Preview mode. It is possible to switch repeatedly between Print Edit mode and Print Preview mode.
| |
| − | | |
| − | Any "active" elements (such as animated graphics) are disabled on first entry into Print Edit mode, and are shown as grey vertically striped blocks.
| |
| − | | |
| − | CSS Print Stylesheets are applied on first entry into Print Edit mode, so that the editable page looks similar to the print pages displayed in Print Preview mode. CSS Print Stylesheets can be removed, using the Web Style feature, so that both the editable page and the print pages looks similar to the web page displayed in normal browsing mode.
| |
| − | | |
| − | Normally, changes are applied to whole elements and where appropriate to their nested sub-elements. However, using the Text Pieces feature, it is possible for individual pieces of text within elements to be edited, hidden, deleted or formatted, without affecting any nested sub-elements.
| |
| − | | |
| − | Print Edit includes a feature to fix the pagination problems (blank pages and truncated pages) that exist in Firefox's print and print preview functionality. This feature can be used even if web page editing is not required.
| |
| − | | |
| − | GETTING STARTED
| |
| − | | |
| − | To get started with Print Edit, try the following steps:
| |
| − | | |
| − | Start Firefox and load the web page to be edited into a tab as normal.
| |
| − | If the Firefox main menu bar is visible, select File and then select Print Edit. Otherwise, click the orange Firefox button, select Print and then select Print Edit. The print edit toolbar will be displayed at the top of the window with the web page to be edited beneath.
| |
| − | Move the mouse over the web page contents and a red box will highlight the element that the mouse is over. Click to select the highlighted element. Move the mouse to highlight another element and click to select that element.
| |
| − | Click the Delete button on the toolbar and the two selected elements will be deleted. Click the Undo button to restore the deleted elements
| |
| − | Click the Delete Except button on the toolbar, then select Restricted, and everything except the two selected elements will be deleted.
| |
| − | Click the Preview button to see how the page will look when printed. Click the Print button to print the edited web page.
| |
| − | Click the Edit button to return to print edit mode and continue editing the web page. Click the Close button to end editing and return to normal browsing mode.
| |
| − | | |
| − | THINGS TO TRY
| |
| − | | |
| − | A common requirement is to print one block of text or one section of a document. The simplest way to do this is to select the block of text or the section, then click on Delete Except, and then click on Restricted. To see if Without Float or Unrestricted would give better results, click on Undo, then click on Delete Except again, and then click on Without Float or Unrestricted.
| |
| − | | |
| − | Another common requirement is to expand text blocks to fill the full width of the page. The simplest way to do this is to select the whole page, then click on Format, then click on Fit to Content, then tick Apply to sub-elements, and then click on OK.
| |
| − | | |
| − | USER REFERENCE
| |
| − | | |
| − | Initiating Print Edit
| |
| − | | |
| − | Print Edit is initiated from Print Preview by clicking on the Edit button next to the Close button on the toolbar.
| |
| − | | |
| − | Alternatively, Print Edit can be initiated from the Print Edit button drop-down menu on the main toolbar, or from the File menu on the main menu bar, or from the Print... submenu on the app menu, or from the Print... submenu on the context menu (after right-clicking the web page).
| |
| − | | |
| − | The Print Edit button can be added to the main toolbar by right-clicking the toolbar and selecting Customize. The default action for the Print Edit button can be changed.
| |
| − | | |
| − | Mode Buttons
| |
| − | | |
| − | There are three mode change buttons:
| |
| − | * Edit - enters Print Edit mode from Print Preview mode.
| |
| − | * Preview - exits Print Edit mode and returns to Print Preview mode.
| |
| − | * Close - exits Print Edit mode or Print Preview mode and returns to normal browsing mode.
| |
| − | | |
| − | Feature Buttons
| |
| − | | |
| − | There are two feature toggle buttons:
| |
| − | * Text Pieces - allows selection and editing of individual pieces of text.
| |
| − | * Web Style - alternately removes or applies CSS Print Stylesheets.
| |
| − | | |
| − | When the Text Pieces feature is toggled off, any individual pieces of text that have been edited will be remain selectable and editable.
| |
| − | | |
| − | There are options to enable these features on first entry into Print Edit mode.
| |
| − | | |
| − | Edit Buttons
| |
| − | | |
| − | There are ten edit command buttons:
| |
| − | * Select - selects all elements or all graphic elements, or re-selects elements from previous command.
| |
| − | * Deselect - deselects all currently selected elements.
| |
| − | * Hide - hides the currently selected elements (will not affect the position of other elements).
| |
| − | * Delete - deletes the currently selected elements (will affect the position of other elements).
| |
| − | * Hide Except - hides all elements except those currently selected.
| |
| − | * Delete Except - deletes all elements except those currently selected.
| |
| − | * Format - formats the currently selected elements (may affect the position of other elements).
| |
| − | * Text - edits a selected text piece or inserts text before or after selected element.
| |
| − | * Undo - undoes the affect of the last edit command.
| |
| − | * Undo All - undoes the affect of all previous edit commands.
| |
| − | | |
| − | The Select and Deselect commands are mutually exclusive. The Select button is displayed when no elements are selected and has a drop-down menu with three items:
| |
| − | •Select All - selects all elements.
| |
| − | •Select Graphics - selects all graphic elements (e.g. images).
| |
| − | •Select Again - selects the elements that were selected immediately before the last edit command.
| |
| − | The Deselect button is displayed when one or more elements are selected.
| |
| − | | |
| − | The Delete Except command has a drop-down menu with three menu items:
| |
| − | * Restricted - retains position and size restrictions on higher level elements.
| |
| − | * Without Float - retains position and size restrictions, and removes float, on higher level elements.
| |
| − | * Unrestrictedt - removes position and size restrictions, and removes float, on higher level elements.
| |
| − | Note that Without Float and Unrestrictedt also remove float from the selected elements.
| |
| − | | |
| − | The Hide command can use either of two techniques to hide elements. Using the normal technique, elements cannot be selected after being hidden. Using the alternative technique, elements can still be selected after being hidden, but may not always be fully hidden.
| |
| − | | |
| − | The Undo command normally reinstates the select boxes that were displayed prior to the 'undone' command, but this behaviour can be turned off.
| |
| − | | |
| − | Other Buttons
| |
| − | | |
| − | There are three more buttons in Print Edit mode:
| |
| − | * Save - saves the edited web page as an HTML file (see section below).
| |
| − | * Tools - provides access to Fix Page Breaks and Options dialog (see sections below).
| |
| − | * Help - opens the Help popup panel showing Mouse Actions and Keyboard Shortcuts.
| |
| − | | |
| − | There is a new checkbox in Print Preview mode:
| |
| − | * PDF - selects a PDF file as the destination instead of a printer (see section below).
| |
| − | | |
| − | Keyboard Shortcuts
| |
| − | | |
| − | Each button on the edit toolbar has a keyboard shortcut, which is Alt plus the letter that is underlined in the button name, for example Alt+D for the Delete button.
| |
| − | | |
| − | Five of the edit commands have additional keyboard shortcuts:
| |
| − | * Deselect - ] key (when one or more elements are selected)
| |
| − | * Select Again - [ key (when no elements are selected)
| |
| − | * Hide - Insert key
| |
| − | * Delete - Delete key
| |
| − | * Undo - Backspace key or Ctrl+Z
| |
| − | | |
| − | The three buttons in the Inspect popup panel also have keyboard shortcuts:
| |
| − | * Expand - UpArrow key
| |
| − | * Shrink - DownArrow key
| |
| − | * Select - Enter key
| |
| − | | |
| − | Editing and Inserting Text
| |
| − | | |
| − | The Text command allows a selected piece of text to be edited or new text to be inserted before or after a selected element. The Text command button is only enabled when a single piece of text or single element is selected.
| |
| − | | |
| − | The Text popup panel can be dragged by its title bar to a new position so that it doesn't obscure important parts of the web page. The title bar shows #text when editing a text piece or the HTML tag of the selected element when inserting text before or after that element.
| |
| − | | |
| − | Normally, an individual piece of text can only be selected if the Text Pieces feature is enabled. However, when the Text Pieces feature is disabled, any individual pieces of text that have been previously edited will remain selectable and editable.
| |
| − | | |
| − | The Text popup panel provides a text box where existing text can be edited or new text can be prepared before being inserted. The text box is resizable by dragging the 'dotted triangle' in the bottom right corner of the text box. All of the standard editing keyboard shortcuts (e.g. arrow keys, Ctrl+C, Ctrl+V) can be used in the text box.
| |
| − | | |
| − | When an element is selected, text can be inserted before or after that element, either as inline text, or as a text block or as a 'sticky note'. The type of insertion is chosen using the drop-down menu list in the footer of the Text panel. The width of an inserted text block or 'sticky note' will be the same as the current width of the text box in the Text panel.
| |
| − | | |
| − | Clicking on the Apply button allows the appearance of the edited/inserted text to be seen in the web page, without closing the Text panel, so that editing can be continued. After closing the Text panel, any inserted text must in future be edited as individual text pieces.
| |
| − | | |
| − | Applying Format Properties and Using Quick Styles
| |
| − | | |
| − | The Format command allows up to twenty-six format properties to be applied to the selected elements. These format properties affect both the layout of the content and its appearance, and can be used to reduce the space that the content occupies on the printed page and to improve its readability. The format properties correspond to similarly named CSS properties.
| |
| − | | |
| − | The Format popup panel can be dragged by its title bar to a new position so that it doesn't obscure important parts of the web page. The title bar shows the HTML tag of the first element that is being formatted.
| |
| − | | |
| − | The format properties can be applied individually by ticking the checkboxes in the Properties section, or in groups by using the buttons in the Quick Styles section. The values of some format properties can be changed by clicking on the small arrow buttons next to the property name.
| |
| − | | |
| − | The Properties section can be shown or hidden by clicking the Show/Hide Properties (down/up chevron) button. The values of all of the format properties can be reset to their default values by clicking the Reset Properties (arrows target) button.
| |
| − | | |
| − | The Width and Height format properties also remove any corresponding min-width/max-width and min-height/max-height CSS properties. The Font Style format property affects the font-style and font-weight CSS properties. The Table Border property affects the border-collapse and border-spacing CSS properties. The Page Break property affects the page-break-before, page-break-after and page-break-inside CSS properties.
| |
| − | | |
| − | Each Quick Style button applies several format properties and the currently active Quick Style buttons will be colored green. If any of the format properties applied by an active Quick Style button are subsequently un-ticked, then the Quick Style button will be colored amber to indicate it is only partially active. Clicking a partially active (amber) Quick Style button will make it fully active (green). Clicking a fully active (green) Quick Style button will make it inactive (not colored).
| |
| − | | |
| − | The format properties can be applied to just the selected elements or to their nested sub-elements as well, and can also be restricted to specific content types (e.g. Blocks or List Items). The Format command can be applied multiple times to the same element.
| |
| − | | |
| − | Inspecting Format Properties
| |
| − | | |
| − | The current format properties for an element can be displayed in the Inspect popup panel. This is displayed by moving the mouse, so that the highlight box (solid border) is positioned over the element, and then right-clicking the mouse.
| |
| − | | |
| − | The Inspect popup panel can be dragged by its title bar to a new position so that it doesn't obscure important parts of the web page. The title bar shows the HTML tag of the element that is being inspected.
| |
| − | | |
| − | The format property values are simplified versions of the full CSS property values, but should be sufficient to determine which format properties to apply with the Format command.
| |
| − | | |
| − | The Inspect panel has three buttons (Expand, Shrink and Select) which allow positiong of the highlight box and selection of the highlighted element.
| |
| − | | |
| − | Positioning the Highlight Box
| |
| − | | |
| − | The highlight box is positioned over an element by moving the mouse over the element. If necessary, the position of the highlight box can be adjusted using the Expand (Up Arrow) and Shrink (Down Arrow) keys. The element is then selected by clicking the mouse or by pressing the Select (Enter) key.
| |
| − | | |
| − | The position of the highlight box can also be adjusted and the element selected using the Expand, Shrink and Select buttons in the Inspect panel.
| |
| − | | |
| − | Selecting and Deselecting Individual Elements
| |
| − | | |
| − | Individual elements can be selected (or deselected) using a highlight box (see previous section).
| |
| − | | |
| − | An individual element is selected by moving the mouse, so that the highlight box (solid border) is positioned over the element, and then clicking the mouse (or pressing Enter). The highlight box then changes to a selection box (dashed border). Any number of elements can be selected, one after another, before applying an edit command.
| |
| − | | |
| − | Any selected element can be deselected by moving the mouse, so that the highlight box (solid border) is positioned over the selected element, and then clicking the mouse (or pressing Enter). The selection box (dashed border) then disappears.
| |
| − | | |
| − | All selected elements can be deselected by clicking the Deselect button.
| |
| − | | |
| − | The border color and border width of the highlight box and select boxes can be changed.
| |
| − | | |
| − | Selecting and Deselecting Multiple Elements
| |
| − | | |
| − | Multiple elements can be selected (or deselected) together using a draggable capture area.
| |
| − | | |
| − | Multiple elements can be selected together by dragging the mouse to draw a rectangular capture area which encloses the elements. When the mouse is released, all of the elements within the capture area are selected.
| |
| − | | |
| − | It is also possible to only select the graphic elements within the capture area by holding down the Shift key, then dragging the mouse to draw a rectangular capture area which encloses the graphic elements.
| |
| − | | |
| − | Multiple elements can be deselected together by holding down the Ctrl key, then dragging the mouse to draw a rectangular capture area which encloses the elements. When the mouse is released, all of the elements within the capture area are deselected.
| |
| − | | |
| − | If the start point of the capture area is close to the edge of the web page, then the start point will snap to the edge. While drawing the capture area, the web page will be automatically scrolled as required.
| |
| − | | |
| − | If the start point of the capture area is within a nested document, then normally the capture area can only be dragged within the boundaries of the nested document. However, by holding down the Alt key before dragging the mouse, the capture area can be dragged outside the boundaries of the nested document.
| |
| − | | |
| − | All selected elements can be deselected by clicking the Deselect button.
| |
| − | | |
| − | The border color and area opacity of the capture box can be changed.
| |
| − | | |
| − | Saving As PDF
| |
| − | | |
| − | In Print Preview mode, an edited web page can be previewed as a PDF file by enabling the PDF checkbox. This selects a PDF file as the destination (instead of a printer) and replaces the Print... button with a Save PDF... button.
| |
| − | | |
| − | The edited web page can then be saved as a PDF file by clicking on the Save PDF... button.
| |
| − | | |
| − | The page setup for the PDF file can be configured using the Page Setup dialog and/or using the controls on the Print Preview toolbar.
| |
| − | | |
| − | The PDF feature works on Linux, on Windows XP, and on Windows Vista/7/8 with Firefox 3.6 or Firefox 28.0 or later. The PDF feature also works on Windows Vista/7/8 with Firefox 4.0 - 27.0, if Firefox is run in Windows XP compatibility mode or if Firefox's hardware acceleration option is disabled.
| |
| − | | |
| − | The PDF feature is not available on Mac OS X, and is initially disabled on Windows Vista/7/8 with Firefox 4.0 - 27.0 (there is an option to enable).
| |
| − | | |
| − | Saving As HTML
| |
| − | | |
| − | In Print Edit mode, an edited web page can be saved as an HTML file by clicking on the Save button and then on the drop-down menu selecting either Save HTML... or Save HTML with Purge....
| |
| − | | |
| − | This will save the edited web page using any of Firefox's standard save methods: 'Web Page, complete', 'Web Page, HTML only' or 'Text Files'.
| |
| − | | |
| − | This feature is also compatible with both the Mozilla Archive Format add-on (3.0.0) and the UnMHT add-on (5.7.7, 6.0.0, 6.3.3, 6.4.5 or 7.0.3, but not 6.5.*). The Mozilla Archive Format add-on provides it's own save methods (MAFF and MHT), and also provides access to the save methods (MHT) of the UnMHT add-on (which usually gives the best results).
| |
| − | | |
| − | Note that the Mozilla Archive Format add-on and the UnMHT add-on are not currently compatible with Multi-Process Firefox and cannot be used in 'e10s' windows.
| |
| − | | |
| − | Note that saving as 'Web Page, complete' always uses Firefox's standard save method, and ignores the "When saving complete web page contents" option in the Mozilla Archive Format add-on.
| |
| − | | |
| − | Using Save HTML with Purge..., it is possible to purge unwanted elements in order to reduce the saved file size. There are options to select which elements to purge: deleted elements, hidden images, scripts, style sheets. The initial settings are to purge deleted elements and hidden images.
| |
| − | | |
| − | When closing Print Edit, there is an option for the user to be asked whether to close without saving the edited web page.
| |
| − | | |
| − | When re-editing a saved edited web page, the user will be asked whether to retain or discard the edits from the previous session.
| |
| − | | |
| − | Fix Page Breaks
| |
| − | | |
| − | Firefox's print preview and print functionality has several long standing problems that cause unwanted blank pages and truncated pages. In most cases, it is possible to fix these problems in Print Edit mode by selecting Fix Page Breaks from the Tools button menu.
| |
| − | | |
| − | Options
| |
| − | | |
| − | The Options Dialog can be accessed by clicking the Options button, or by selecting Tools | Add-ons on the Firefox main menu.
| |
| − | | |
| − | The Options Dialog allows the user to:
| |
| − | * Choose the default action for the Print Edit toolbar button.
| |
| − | * Choose the original toolbar layout (text labels) or a more compact toolbar layout (icons).
| |
| − | * Choose that elements can still be selected after Hide.
| |
| − | * Choose to reinstate the select boxes after Undo.
| |
| − | * Choose not to ask about saving on Close.
| |
| − | * Choose to enable the Text Pieces and Web Style buttons on first entry.
| |
| − | * Choose which elements to purge when saving as HTML.
| |
| − | * Enable Save PDF feature for Firefox 4-27 on Windows Vista/7/8.
| |
| − | * Set the border color and border width for the highlight box.
| |
| − | * Set the border color and border width for the select boxes.
| |
| − | * Set the border color and area opacity for the capture box.
| |
| − | * Set the distance within which the capture box start point will snap to edge.
| |
| − | | |
| − | Notes for Mac Users
| |
| − | | |
| − | The Save PDF feature is not available on Mac OS X, but Mac OS X has a built-in feature for saving as a PDF file.
| |
| − | | |
| − | The Portrait and Landscape buttons (available on other platforms) are not available on the print preview toolbar. Instead, on Mac OS X, the orientation can be changed by clicking on the Page Setup button and then selecting Portrait or Landscape.
| |
| − | | |
| − | The Scale button on the print preview toolbar works the same for all platforms. In addition, on Mac OS X, the scale can be adjusted by clicking on the Page Setup button and then entering a value in the Scale box. The value entered in the Scale box acts as a multiplier for the scale set by the Scale button.
| |
| − | |Homepage URL=https://addons.mozilla.org/firefox/addon/print-edit/
| |
| − | |Submitted by=David Hedlund
| |
| − | |Submitted date=2015/04/19
| |
| − | |Status=
| |
| − | |Is GNU=No
| |
| − | }}
| |
| − | {{Project license
| |
| − | |License=GPLv3
| |
| − | }}
| |
| − | {{Software category}}
| |
| − | {{Featured}}
| |
