Adding images to articles and editing existing images in articles
Insert/Edit Image - this icon allows you to upload and add images to articles on the website. You can specify how the image appears in the text, its position, size, and add borders and so on. Clicking on this icon opens a new popup window titled 'Image Manager', shown below:
The funcionality of this window is very similar to that used to upload files to the website, outlined in a separate website help article. Using the lower panes, it is possible to browse the folder structure to select images already on the server, add new folders to the folder structure on the server, and upload new images to the site. To upload a new image, click on the icon labelled 'Upload' that is situated to the top right of the lower three panes. Clicking on this icon will open a further popup window, shown below:
Using this popup window you can either drag and drop images from your local machine, or use the button labelled 'Browse' to browse the contents of your local machine and any connected drives for images you wish to upload. Once you have added these images to the popup, clicking on the button labelled Upload will begin the upload process - please note that images should be in JPEG or PNG format for inclusion on the website, so any TIFFs will need to be converted to one of these two formats. Once the upload has process you will return to the previous Image Manager window, and the newly uploaded images or images will now be available for selection, as shown below:
With the appropriate image selected (in this case a jpeg with the filename 'editor_image_windowj.jpg') we can now turn our attentions to the top portion of the Image Manager popup. As you can see, this section of the popup is divided into three tabs, 'Image', 'Rollover', and 'Advanced'. For the sake of this site we can ignore the tab labelled 'Rollover', so will look at the two other tabs in turn. Firstly, the 'Image' tab, shown below:
This tab is divided into two sections, Properties and Preview. The Preview, loacted on the right, shows you how the image will appear in the text of the article, whilst the Properties section allows you to specify how the image should appear within the text. The Properties section contains a number of fields, as follows:
URL - this field contains the path to the image that you wish to insert. If you have selected an existing image or uploaded a new one to the server, this will be entered automatically as a local path preceded by 'images/', as shown above. You can also enter a path to an image available on the web using a standard web path (e.g. 'http://www.bbc.co.uk/logo.jpg' or similar)
Alternate Text - by default this will be the filename of the image selected, but you can change this to something more descriptive. The Alternative Text is used in web browsers where images are not displayed, or when someone has set the page to be read to them, so you may wish to use something like 'An screenshot of the Image Manager window', for example
Dimensions - these two fields allow you to specify the size of the image within the article, and is expressed in pixels for width and height. It also contains a checkbox marked 'Proportional' - generally you should leave this checked and change either width or height to your desired dimension. Within the articles of this site I would recommend a maximum width of 800 for images that should span the entirety of the articles layout - for images that will appear to the left or gith of text I would suggest a width of 300 pixels
Alignment - the Alignment field features a drop down list of available positions within the text, with the following options: '--Not Set--', 'Left', 'Right', 'Top', 'Middle', and 'Bottom'. You will generally be using either 'Left', 'Right', or '--Not Set--' for image alignment within articles on this site. 'Left' will align the image to the left of the article's layout, with text appearing to the right of it. 'Right' will align the image to the right of the article window, and text will wrap around it on the left hand side, whilst '--Not Set--' will insert the image on its own line, with text appearing above or below it but not wrapping around the image.
Margin - this field allows you to specify a margin around the image, so that text does not run right up to its edges, and is particularly useful when you are aligning images to 'Left' or 'Right'. To use this field uncheck the box marked 'Equal Values' and then enter a value in pixels to the sides of the images that should have margins. In general, if you have set an image to be aligned 'Right' you would enter 30 in Left and 20 in Bottom. For images aligned 'Left' you would enter 30 in Right and 20 in Bottom.
Border - this set of fields allows you to add a border to your inserted image. You can specify the width of the border (in pixels), the border style (solid, dotted, dashed etc.), and it's colour (expressed either as hex code or chosen from a popup window).
Any changes you make to the above Properties will be reflected in the Preview pane to the right, allowing you to see a visual representation of how the image will appear with the chosen settings.
Advanced tab of the Image Manager is shown below:
This tab governs image styles, and will not generally be used on this website. However, there is one important field, as 'Title' will be used to add any captions to images displayed on the website. If you wish to add a caption to an image, simply type the text for your caption into this field.
Once you have chosen your required settings for the image you wish to insert into the article, click on the 'Insert' button at the bottom of the Image Manager popup window to insert your image into the article. You can edit any image settings by selecting an image within an article and clicking on the Insert/Edit Image icon to open the popup window again, allowing you to change any of the fields you need to.
Latest Blog Posts
-
‘Un-Disciplining the Museum’ – 2023 MEG Conference in Cambridge, 18-19 April 2023
The prospect of writing a summary report of this year’s MEG conference is, quite frankly, pretty daunting. The range of papers, the complexity of ideas, the combined wealth of knowledge and experience shared both in the lecture hall and so freely over lunch, pages of notes to try and make sense of … So, what follows is a personal, but I hope adequate, overview of some themes, comments and...
-
Committe Role: Web Officer
MEG Web Officer Museum Ethnographers Group are a UK-based, but international collective, whose members include: Museum professionals, academics, researchers & students, artists, activists & enthusiasts Originally established in 1975, MEG has a long history of bringing individuals, institutions and museum collections together to build knowledge and understanding. MEG believes that our museums have an important role to play in building understanding, foregrounding respect, and caring for each other. However, this is predicated on institutional and practical changes that we...