• user-manual-2

  last modified February 24, 2008 by emanuel

Agregando Contenido

Note: Return to reference manual view.

Un manual de usuarios para creadores de contenido administradores de Plone

1. Agregando Carpetas

Agregar carpetas a un sitio web Plone es la forma básica de controlar la organización del contenido.

Sin dudas usted ha creado carpetas (directorios) en su computadora. En los sistemas Windows para PC, a menudo se crea una jerarquía de carpetas en los discos c: o d:, o dentro de una carpeta Documentos. En Mac y otros sistemas, las carpetas son creadas de una forma similar. Las carpetas de Plone son esencialmente idénticas, excepto que son creadas en un sitio web Plone para organizar contenido en el sistema de almacenamiento que trae Plone.

Las carpetas son agregadas clickeando en el menú Agregar ítem (usted necesita estar autenticado para ver el menú Agregar ítem):

add-new-menu.png

Después de clickear para agregar una carpeta usted verá el panel Agregar Carpeta:


Rellene el título, que es requerido como lo indica el cuadrado rojo. La descripción es opcional; usted siempre puede volver al panel de edición si necesita agregar una descripción de la carpeta. Las descripciones son útiles cuando un visitante del sitio usa la herramienta de búsqueda incluida con Plone - los resultados se mostraran con ambos, el Título y la descripción del ítem.

Usted también notará pestañas en la parte superior: Predeterminado, para ingresar los campos Título y Descripción, Categorización, para especificar las categorías que se aplican a la carpeta (usted tal vez las conozca como palabras claves o keywords), Fechas, para configurar el período de tiempo durante el cual la carpeta debería estar disponible para ser vista en el sitio web, Propietario, para especificar el creador y/o contribuidores al ítem de contenido, y Configuración, para permitir comentarios acerca del ítem y si este se muestra en el menú de navegación del sitio web.

Esas pestañas son estándar, por lo tanto las verá cuando clickee en otros tipos de contenido. Cubriremos esas pestañas en otra sección de este manual de usuario.

Asegurese de clickear el botón Guardar de la página cuando haya terminado. Esto completará el proceso de creación de la carpeta.

lights-camera-action.png Mirar un video sobre cómo agregar una carpeta en Plone 2 (significativamente diferente).

 

2. ¿Qué hay en un Nombre Web?

Los items individuales de contenido en un sitio web Plone tienen direcciones web discretas. Plone las crea automáticamente basándose en el título que usted elige.

¿Qué hay en un Nombre Web?

The Title of content items, including folders, images, pages, etc., can be anything you want -- you can use any keyboard characters, including blanks. Titles become part of web address for each item you create in Plone.  Web addresses, also known as URLs, are what you type in a web browser to go to a specific location in a web site (Or, you would click your way there), such as:

El Título de los ítems de contenido, incluyendo carpetas, imágenes, páginas, etc., puede ser cualquier cosa que usted quiera -- puede usar cualquier caracter del teclado, incluyendo espacios. Los Títulos se vuelven parte de la dirección web de cada item que usted crea en Plone. Las direcciones web, también conocidas como URLs, son lo que usted escribe en un navegador web para ir a una posición específica en un sitio web (Or, you would click your way there), como:

www.mysite.com/about/personnel/sally/bio

Ó

www.misitio.com/imagenes/mariposas/skippers/long-tailed-skippers

Las direcciones web tienen restricciones sobre los caracteres del teclado permitidos, y los espacios no son permitidos. Plone hace el buen trabajo de mantener las direcciones web correctas mediante el uso de direcciones muy similares al Título que usted eligió, convirtiéndolas a minúsculas, y sustituyendo guiones por espacios y otras puntuaciones.

Para ilustrar tomemos cada una de estas direcciones web y dividamolas en las partes que las componen: 

www.misitio.com/acerca/personal/sally/bio
^
nombre del sitio web
               ^
               una carpeta llamada Acerca
                      ^
                      una carpeta llamada Personal
                               ^
                               una carpeta llamada Sally
                                     ^
                                     una carpeta llamada Bio


En este ejemplo Plone cambió cada título de carpeta a minúscula, por ejemplo, de Personal a personal. Usted no tiene que preocuparse por esto. Plone se encarga de las direcciones web; usted sólo escribe los títulos de la forma que quiere. 

Y para el segundo ejemplo: 

www.misitio.com/imagenes/mariposas/skippers/long-tailed-skippers
^
nombre del sitio web
               ^
               Una carpeta llamada Imágenes
                        ^
                        una carpeta llamada Mariposas
                                  ^
                                  una carpeta llamada Skippers
                                           ^
                                           una carpeta llamada Long-Tailed Skippers


Este ejemplo es similar al primero, ilustrando una conversión a minúscula del título de cada carpeta a la parte correspondiente del la dirección web. Notar el caso de la carpeta llamada  Long-tailed Skippers. Plone mantiene el guión, ya que este es permitido en el título y como parte de la dirección web, pero cambió por un guión el espacio entre las palabras Tailed y Skippers en la dirección web, así también como la conversión a minúscula.

En Plone nos referimos a la dirección web de un ítem dado como nombre corto. Cuando usted use la función Renombrar verá el nombre corto además del título.
 

3. Adding Images

Agregar imágenes a un sitio web Plone es una tarea básica que puede involucrar un poco de trabajo en su computadora local, pero es esencial porque las fotografías, mapas y gráficos personalizados son muy importantes en los sitios web.

Preparando imágenes para la Web

Recuerde usar formatos de archivos que sean estándares para la web para todas las imágenes. Los formatos aceptables incluyen: JPG, JPEG, GIF, y PNG. No use formatos BMP o TIFF ya que estos no son ampliamente soportados por los navegadores web.

Cuando esté listo para agregar una imagen use el menú desplegable Agregar ítem (usted sólo verá el menú Agregar ítem después de autenticarse):

Después de clickear para agregar una Imagen usted verá el panel Agregar Imagen:

Ahí se encuentran los campos Título y Descripción (campo como en "campo de entrada de datos") como cuando agregamos una Carpeta, y en la parte inferior hay un lugar para subir una imagen. Veamos los tres campos de entrada individualmente:

  • Título - Use el texto que usted quiera, incluso con espacios y puntuación (Plone se encarga de generar la dirección web).
  • Description - Always a good idea, but always optional. Leave it blank if you want.
  • Descripción - Siempre es una buena idea, pero siempre es opcional. Dejela vacía si quiere.
  • Imagen - El campo Imagen es una caja de entrada de texto para subir (Recordar. Usted necesita recordar dónde tiene sus imágenes en su computadora).

Para las imágenes, como mínimo usted escribirá el título y buscará la imagen en su computaora local, luego clickea Guardar en la parte inferior para subir la imagen al sitio web Plone. Usted tendrá que esperar algunos segundos hasta que termine de subirse la imagen (o un minuto más o menos si tiene una conexión web lenta). Se mostrará una previsualización de la imagen subida cuando la imagen haya subido por completo.

4. Agregando Páginas

Las páginas en Plone varían mucho, pero son sólo "páginas web", de un tipo u otro. 

Para agregar una página use el menú Agregar ítem en una carpeta. 

Seleccione Página en el menú desplegable y usted verá el panel Agregar Página:


Los campos Título y Descripción se encuentran en la parte de arriba. Rellene cada uno de ellos apropiadamente. Hay un campo Nota sobre el cambio en la parte de abajo, este es también un campo estándar que es muy útil para almacenar memos útiles describiendo los cambios a un documento a medida que se hacen. Esto es útil para páginas en las cuales usted puede estar colaborando con otros.

El panel del medio, Cuerpo del texto, es donde está la acción para las páginas. El software usado para hacer Páginas en Plone, genéricamente llamado editor visual y específicamente una herramienta llamada Kupu es una característica muy importante permitiéndole hacer edición WYSIWYG. La edición WYSIWYG -- del inglés What You See Is What You Get que se traduce como "lo que ves es lo que obtienes" --  describe cómo funciona el software de prosesamiento de palabras. Cuando usted hace un cambio, como poner una palabra en negrita, usted ve el texto en negrita inmediatamente. Lo que usted ve es el texto en negrita - Plone se encarga de la parte HTML.

If you are the sort of person who likes to enter text using so-called mark-up formats, you may switch off the visual editor under your personal preferences, which will replace Kupu with a simplified text entry panel. The mark-up formats available in Plone are:

Each of these works by the embedding of special formatting codes within text. For example, with structured text formatting, surrounding a word or phrase by double asterisks will make that word or phrase bold, as in **This text would be bold.** These mark-up formats are worth learning for speed of input if you do a lot of page creation, or if you are adept at such slightly more technical approaches to entering text. Some people prefer such formats not just for speed itself, but for the fluidity of expression. There are very many special codes to learn for most of these formats, so using one really doesn't carry much overhead.

But, most people are naturally comfortable with the WYSIWYG approach of typical word processors.

So, we'll continue here with how to take the typical approach: to use the visual editor (Kupu) tool.

lights-camera-action.png Watch a Plone 2 video on using the visual editor to edit the body text of a page.

We will assume here that you understand how to use basic word processing software.  There are a few web-specific things in the icon menu, but you'll recognize most as basic standard features:

 


 

Bold & Italics

Very simple. Highlight some text with your mouse pointer and click the "B" for bold or the "I" for italics.

Alignment (Justification)

To set alignment, highlight the paragraph of text you wish to adjust and click the appropriate icon for left, center, or right justification. You can also select multiple paragraphs to apply the same justification across several paragraphs.

Numbered and Bulleted Lists

Numbered and bulleted list formatting are applied to paragraphs by first selecting the paragraphs, then clicking one of the icons. You may set formatting such as bold or italics, to individual words or phrases before or after setting the paragraphs to a numbered or bulleted list.

Definition Lists

Definition lists are ideal for items involving a word or phrase associated with a paragraph, such as a list of butterfly groups and their descriptions.

Here's what a definition list looks like:

Swallowtails
Family Papilionidae - Swallowtails derive their name from their split long tails. These butterflies are among the largest and most graceful.
Skippers
Family Hesperiidae - Skippers derive their name from their characteristic rapid darting flight.

The steps to create a definition list are a little involved. Follow these steps:

  1. Put your cursor on a new blank paragraph where you want the definition list to go.
  2. Click the definition list icon.
  3. Type the first word or phrase. The word or phrase will be left-aligned and will be in bold.
  4. Hit the Return key (Enter key) to make a new line.
  5. Type the definition. You will see that the formatting is normal and that it is now indented.
  6. Hit the Return (Enter key) to make a new line.
  7. Repeat 3 - 6 to add new words or phrases and definitions.

Important: When you are finished with the last definition, you have to hit the Return key twice to go back to normal formatting.

Blockquotes

Blockquotes are a special kind of paragraph indentation that has a visual style clearly setting it apart from other, normal paragraphs. This formatting style is useful for quotations, hence the name, but can also be used for stylized indentation like this:

indentation level one

indentation level two

indentation level two

indentation level two

indentation level one

indentation level two

indentation level three

indentation level three

indentation level two

indentation level one

To accomplish such blockquote formatting, have your cursor on a paragraph and click either of the blockquote indentation level icons.  You may also select multiple paragraphs to change indentation level for a block. Clicking an indentation icon several times creates deeper levels of indent.

Images

Plone's visual editor allows you to insert images as you edit a page. To add an image, put the cursor where you want the image to appear and click the image icon insert image .  You'll see the following image insert panel:

The insert image panel shows some links in the left column that will help you find images already uploaded to the Plone web site. Home is the "root" of the entire website (akin to clicking the "c: drive" on a Windows PC or "MacIntosh HD" on a Mac). Current folder is just that, the folder where you are adding the new Page. My recent items and Recent items show list of images that have been added to the Plone web site already, no matter where they are located. 

Normally you will just click Current folder so you can upload the image to be inserted.  We will assume this is the case, and you will see the following panel:

There's the Upload link you need to insert your image.  Click it and you'll see a familiar file selection dialog box on your local computer, like this one on the Mac:

Here, the file selection dialog has been used to select a folder named "family" on the local computer.  Any of the images could be selected for upload, and then the image would be transferred up to the Plone web site and -- here's the nice part -- it would also appear within the Page being created, already linked in properly.  This is the sort of thing you have to try to appreciate, but it is one of the most important operations you can learn for creating pages on a Plone web site.

lights-camera-action.png Watch a Plone 2 video on adding images to a page.

Internal Links

Select a word or phrase, click the internal link icon, and the insert link panel will appear:

You use this panel by clicking on Home or Current folder to begin navigating the Plone web site to find a folder, page, or image to which you wish to make a link. In the example above, a page named "Long-tailed Skippers" has been chosen for the link.  After this panel is closed, a link to the "Long-tailed Skippers" page will be set for the word or phrase selected for the link.

External Links

Select a word or phrase, click the external link icon, and the External link panel will appear:

Type the web address of the external website in the box starting with http://. You can click preview if you need to check the address.  If you paste in the web address, make sure you don't have duplicate http:// at the beginning of the address. Then click ok.  The external link will be set to the word or phrase you selected.

Anchors

Anchors are like position markers within a document, based on headings, subheadings, or another style set within the document. As an example, for a page called "Eastern Tiger Swallowtail," with subheadings entitled "Description," "Habitat," "Behavior," "Conservation Status," and "Literature," an easy set of links to these subheadings (to the positions within the document at those subheadings) can be created using anchors.

First, create the document with the subheadings set within it, and re-type the subheadings at the top of the document:

Then select each of the re-typed subheadings at the top and click the anchor icon to select by subheadings:

A panel will appear for selecting which subheading to which the anchor link should connect:

 

The Link to anchor tab will appear. The left side shows a list of styles that could be set within the document. For this example, the subheadings are used for each section, which is the usual case, so subheadings has been selected. The right side of the panel shows the subheadings that have been set within the document. Here the Description subheading is chosen for the link (for the word Description, typed at the top of the document).

You can be creative with this powerful feature, by weaving such links-to-anchors within narrative text, by setting anchors to other styles within the document, and coming up with clever mixes. This functionality is especially important for large documents.

Tables

Tables are handy for tabular data and lists. To add a table, put your cursor where you want it and click the add table icon.  You'll see the add table panel:

Setting rows and columns is straightforward. If you check the Create Headings box you'll have a place to type column headings for the table.  Table class refers to how you want the table to be styled. You have choices such as these:

Here are examples of these table styles:

plain:
 
Thoroughbred Champions
Quarter Horse Champions
Man O' War
First Down Dash
Secretariat
Dashing Folly
Citation
Special Leader
Kelso
Gold Coast Express
Count Fleet
Easy Jet

 

listing:

Thoroughbred Champions
Quarter Horse Champions
Man O' War
First Down Dash
Secretariat
Dashing Folly
Citation
Special Leader
Kelso
Gold Coast Express
Count Fleet
Easy Jet
 After the table has been created you can click in a cell to show table resizing handles and row and column add/delete icons:

In the table above, the cursor has been placed in the "Special Leader" cell, which activates little square handles around the edges for resizing the entire table.  It also activates add/delete icons for the current cell, the "Special Leader" cell.  Clicking the little x in the circle will delete the entire row or column that contains the current cell. Clicking the little arrowhead icons will add a row above or below, or a column to the left or right of the current cell.

HTML Editor

The HTML Editor is available to people who want to edit the actual HyperText Markup Language code, which web browsers use to describe web pages and web site. Learning HTML basics lets you do special things, but it isn't necessary for typical use.  If you click the HTML icon you'll see a panel with the actual code, which you can edit, and then close the panel to get back to the WYSIWYG view.

Styles

The Styles pull-down menu lets you set the style for a selected block of text.  Here are typical choices:

Normal is for normal text.  Heading is usually bold, a slightly larger font, left-aligned, and with a single horizontal line extending across the page.  Subheading is usually bold, an intermediate size font, and left-aligned. Literal is useful for quotes and for lining up text precisely, as with programming language code. Literal text is monospaced text set off by a box:

programming language code:

class SortAdvectionVelocities
     ___init__(self, advectionVelocities):
          this.advectionVelocities = advectionVelocities

     sortVelocities():
          this.advectionVelocities.sort()

or columns of numbers:

   location        velocity
   --------        --------
   vector a        21.7
   vector b        15.4
   vector c        48.3
   vector d        38.2

You could also use a table for such data.

Zoom

The zoom icon expands the edit panel to take up the full browser window.  Click the icon again and it will toggle back to the normal edit panel size.

5. Adding Files

Files of various types can be uploaded to Plone web sites.

Choose file in the Add new... menu for a folder to upload a file:

add-new-menu.png

You will see the Add File panel:

Click the Browse button to navigate to the file you want to upload from your local computer. Provide a title (you can use the same file name used on your local computer if you want). Provide a description if you want. When you click the save button the file will be uploaded to the folder.

lights-camera-action.png Watch a Plone 2 video on adding a file.

Example file types include PDF files, Word documents, database files, zip files... -- well, practically anything.  Files on a Plone web site are treated as just files and will show up in contents lists for folders, but there won't be any special display of them. They will appear by name in lists and will be available for download if clicked.

There are specialized add-on tools for Plone web sites that search contents of files. If you are interested in this functionality, ask your Plone web site administrator.

 

 

 

6. Adding Links

In addition to links embedding within pages, Links can be created as discrete content items. Having links as discrete items lets you do things like organizing them in folders or setting keywords on them to facilitate grouping in lists and search results.

Add a link by clicking the menu choice in the Add new... menu for a folder:

add-new-menu.png

You will see the Add Link panel:

Good titles for links are important, because the titles will show up in lists of links, and because there tend to be quite a number of links held in a folder as a set.  Paste the web address in the URL field or type it in. There is no preview feature here, so it is best to paste the web address from a browser window where you are viewing the target for the link.

lights-camera-action.png Watch Plone 2 videos about adding a link for an email address and adding links to external and internal documents.

7. Adding Events

Plone web sites have a built-in system for managing and showing calendar events.

Use the Add new... menu for a folder to add an event:

add-new-menu.png

You will see rather large Add Event panel:


From the top, we have the following fields:
  • Title - REQUIRED
  • Description
  • Event location
  • Start date and time - REQUIRED
  • End date and time - REQUIRED
  • Event body text (visual editor panel)
  • Attendees
  • Event type(s)
  • Event URL
  • Contact Name
  • Contact Email
  • Contact Phone
  • Change note
Note that only three fields, title and start and end date and time, are required.  So, although this is a large input panel, if you are in a hurry, just type in the title and the start and end times and save.  Of course, if you have the other information, you should type it in.

One part of the panel needs a bit more explanation: the event start and end times.  The year, month, day, and other fields are simple pull-down menus.  But for the day, often you can't remember exactly and you need to consult a calendar. There is a handy pop-up calendar that offers an alternate way to select the day.  If you click one of the little calendar icons adjacent to the day pull-down, :

you'll see this pop-up calendar:
Just click the day and it will be set. Fill in the fields for which you have information and save the event, but remember:

IMPORTANT: It will not show on the main web site calendar until it has been published.

lights-camera-action.png Watch a Plone 2 video on adding an event.

8. Adding News Items

Plone web sites have a built-in system for publishing news items.

Use the Add new... menu for a folder to add a news item:

add-new-menu.png

You will see the Add News Item panel:

The standard fields for title, description, and change note are in the panel, along with a visual editor area for body text and image and image caption fields. You can be as creative as you want in the body text area, and you can use the insert image (upload image) function to add as much illustration as needed. The images you upload for the news item will be added to the folder in which you are adding the news item.

The Image and Image Caption fields are for adding an image to be used as a representative graphic for the news item, for posting in news item listings. The image will be automatically resized and positioned. Use the Body Text to insert an image in the actual body of the News Item.

IMPORTANT: News items will not appear in the main web site news listing or news portlet until they are published.

lights-camera-action.png Watch a Plone 2 video on adding a news item.

9. Setting Basic Properties

The tab panels available on each content item has fields for basic information. Providing such data is important, providing fuel for the engines that run Plone.

Any content item, when clicked by a user with edit rights for the item, will show a set of tabs at the top for setting basic properties:

These basic properties tabs are:

  • Default - shows the main data entry panel for the content item
  • Categorization - shows a panel for creating and setting categories (keywords) for the item
  • Dates - shows the publishing date and expiration date for the item
  • Ownership - shows a panel for setting creators, contributors, and any copyright information for the item
  • Settings - shows a small panel for setting whether or not the item will appear in navigation menus and if comments are allowed on the item

The input fields under these tabs cover basic descriptive information called metadata.  Metadata is sometimes called "data about data." Plone can use this metadata in a multitude of ways.

Here is the Categorization panel, shown for a page content item (would be the same for other content types):

 

Note: Categories were formerly called keywords in Plone, prior to version 3.0.

The main input field for the panel is for specifying categories. Create them anew, just by typing in words or phrases, one per line, in the New categories box. When you save, the new categories will be created within the system of categories for the web site, and this content item will be filed under them. If you re-edit this item, or edit any other, the new categories will show up as Existing categories.

The Related Items field lets you set links between content items, which will show as links at the bottom, when a content item is viewed. This is useful when you don't want to use explicit categories to connect content.

The Location field is a geographic location, suitable for use with mapping systems, but appropriate to enter, for general record keeping.

The Language choice normally would be allowed to fall to the site default, but on multilingual web sites, different languages could be used in a mix of content.

The Dates panel has fields for the publishing date and the expiration date, effectively start and stop dates for the content if you wish to set them:


The Ownership panel has three free-form fields for listing creators, contributors, and information about copyright or ownership rights to the content:

The Settings panel has fields that may vary a bit from content type to content type, but generally there are input fields controlling whether or not the item appears in navigation, or if there are comments allowed, and other similar controls:


Recommendations

There is no requirement to enter the information specified through these panels, but it is a good idea to do so. For the Ownership panel, providing the data is important for situations where there are several people involved in content creation, especially if there are multiple creators and contributors working in groups.  You don't always need fields such as publishing and expiration dates, language, and copyrights, but these data should be specified when appropriate. A content management system can only be as good as the data completeness allows.

Specifying categories requires attention, but if you are able to get in the habit, and are zealously committed to creating a meaningful set of categories, there is a big return on the investment. The return happens through the use of searching and other facilities in Plone that work off the categorization.  The same holds for setting related items. You'll be able to put your finger on what you need, and you may be able to discover and use relationships within the content.

10. Restricting Types in a Folder

The Add new... menu has a choice for restricting the content types that can be added to the folder.

Restricting types available for adding to a folder is the simplest way to control content creation on a Plone web site. You may want to restrict content types if your site is going to be worked on by several people. In this way you can enforce good practices such as putting just images in the images folder.

First, select the last choice in the Add new... menu called Restrictions...:

add-new-menu.png

There are three choices shown for restricting types in the folder:

The default choice, to use the setting of the parent folder. Having this as the default means that if you create a folder and restrict the types that can be added, any subfolders created in the folder will automatically carry the restrictions. The second choice, to allow the standard types to be added, is a way to reset to the default, unrestricted setting. The last choice allows selection from a list of available types:

Types listed under the Allowed types heading are those available on the web site. The default, as shown, is to allow all types. Allowed types may be toggled on and off for the folder.

Use of Secondary types allows a kind of more detailed control. For example, if it is preferred to store images in one folder, instead of scattering them in different folders on the web site -- a scheme that some people prefer -- an "Images" folder could be created with the allowed type set to the Image content type only. Likewise an "Company Events" folder could be created to hold only the Event content type. If left this way, content creators would be forced (or a single web site owner) to follow this strict scheme. Perhaps some flexibility is desired for images, though. By checking the Image content type under the Secondary types heading for the "Company Events" folder, images could be added if really needed, by using the More... submenu, which would appear when this mechanism is in place.

Some people prefer a heterogeneous mix of content across the web site, with no restrictions. Others prefer a more regimented approach, restricting types in one organizational scheme or another. Plone has the flexibility to accommodate a range of designs.

11. Preparing Images for the Web

Preparing images for the web is an essential part of using images in Plone, or in any online context. As you will see, size matters.

Many people source photographs taken with a digital camera, but they can also be scanned images, graphical illustrations made with software, and other specialized images.  Let's take a look at the case of a butterfly photo taken with a digital camera. 

Digital photographs taken with modern cameras are usually too big to post directly on a website, so they need to be resized.  A typical web site design may have a width of around 1000 pixels. When a photograph comes off your camera, it may be several thousand pixels wide and tall, and several megabytes in file size.  You need to use software on your computer to resize the image to something less than 1000 x 1000 pixels, often much smaller than that.

The software you use to view or print your digital photos will often have this resizing functionality, or you may have graphics software such as Corel Draw, Adobe Photoshop, Irfanview, or Gimp on your computer.  Resizing an image, sometimes called resampling, is a standard function you should be able to find in your software, often under the Image menu.

How do you know what width, in pixels, to resize your image?  It depends. For a little "head shot" photograph to go in a biography, maybe 200 pixels wide is just right.  For a group photograph, 200 pixels would be too small to allow identification of the people in the photograph, so it may need to be closer to 400 pixels wide. For a scanned map image, perhaps the image width would need to be 1000 pixels for the map detail to be usable.

After saving your resized image, give it a name that indicates the new size (e.g., butteryfly-resized-300px.jpg). The file format is most commonly .jpg (or .jpeg). Other common formats for images include .png and .gif.  Take note of where you save images on your computer so that you can find them when you upload them to your Plone web site.

 

image_resizing.png

 

 

 

To summarize:

  1. Take your photograph with your camera, or find an existing image you want to use
  2. Transfer it to your computer
  3. Use image software on your computer to resize your photograph
  4. Upload it to your Plone website