Differences

This shows you the differences between two versions of the page.

--- faqs:about_this_wiki:adding_images_and_documents [07/04/2025 03:40 PM (7 months ago)] – removed - external edit (Unknown date) 127.0.0.1
+++ faqs:about_this_wiki:adding_images_and_documents [07/09/2025 06:34 PM (7 months ago)] (current) – ↷ Links adapted because of a move operation 20.171.207.37
@@ Line 1: / Line 1: @@
+====== Adding Images And Documents ======
+You can add a wide variety of image, media and document files to the wiki. Here's [[doku>mime#default_mime_types|a list]].
+You can upload images ahead of time using the Media Manager. Or you can add them as needed while editing a page - this way is a lot easier.
+===== The Steps =====
+It looks a little intimidating, but once you've done it a time or two, it's easy.
+  * Position the cursor where you want the image or file link to be displayed
+  * Click on the ''Insert image or file option'' in the edit bar: {{faqs:about_this_wiki:toolbar-insert_image_or_file.png?39}}
+  * The [[#Media Configuration window|Media Configuration window]] will appear.
+  * Click on the icon to the left of ''Image or document file'':{{faqs:about_this_wiki:toolbar-insert_image_or_file.png?39}}
+  * Another window will appear, [[#Media Files window|Media Files]].
+  * This window allows you to upload an image or file (if needed) and select the file to be used.
+  * If you select and image, a [[#Link Settings window|Link Settings window]] will appear where you can select the initial size and location of the image.
+  * Your selection is copied back to the [[#Media Configuration window|Media Configuration window]]. You can just click ''OK'' at this point.
+  * Take a look at the results. If you want to make changes, click on the image or file link to get back to the [[#Media Configuration window|Media Configuration window]].
+===== Media Configuration window =====
+This window is used to select the image or file and select how it will be displayed.
+{{ faqs:about_this_wiki:media_configuration.jpg?535 }}
+==== Media or file ====
+^ Image or document file | This identifies the media file to be displayed or linked.Use the {{faqs:about_this_wiki:toolbar-insert_image_or_file.png?39}} icon to select the file. It will bring up the //Media Configuration //window, described below. |
+^ Caption / link text | Adds a caption for an image file or the text to display if using a link, like for a PDF file.  |
+==== Dimensions ====
+^ Width (px) | The width of the image, in number of pixels. If an image is too big or too small, adjust the number accordingly. ^  If you leave both Width and Height blank, the original image size will be used.If you specify both Width and Height, the image will be reduced so that it fits inside the space specified. ^
+^ Height (px) | The height of an image, also in pixels. You usually leave this empty. The height will be adjusted automatically. | ::: |
+==== Alignment ====
+^ Default | The image will appear inline with the text -or- on the left if in a paragraph by itself. | This is the image {{faqs:about_this_wiki:skyscraper.png?20}} using the //default //option. |
+^ Left | The image will appear left justified on the page. Any following text will appear to the right of the image. | {{faqs:about_this_wiki:skyscraper.png?20 }}This is the image using the //left //option. |
+^ Center | The image will be centered on the page, with no text to the left or right, | {{ faqs:about_this_wiki:skyscraper.png?20 }}This is the image using the //center //option. |
+^ Right | The image will appear right justified on the page. Any following text will appear to the left of the image. | {{ faqs:about_this_wiki:skyscraper.png?20}}This is the image using the //right //option. |
+==== Linking ====
+What happens when you click on this media item.
+^ Default | Uses the "standard" way to handle this type of media file. |
+^ Direct | When an image is clicked, it goes to a page displaying the details for this image or file. |
+^ No Link | When clicked, does nothing. Normally used only with image files. |
+^ Link Only | Just display a link to the file, rather than the file itself. Especially useful with LARGE image files. The default for document files like PDF's. You really need a ''Caption / link text'' with this option. |
+==== Caching ====
+Use **Default**.
+===== Media Files window =====
+This window allows you to upload media files and select the one you want to use.
+{{ faqs:about_this_wiki:media_files.png?535 }}
+There is a lot of things you can do with this window. To learn all the options, [[doku>media_manager|click here]]. Here are the ones you'll want right away.
+==== Upload a new image or file ====
+To upload a new image or file:
+  * Click on ''Select files...'' and select the file you want to upload. -or- just drag and drop the file over the ''Select files...'' button.
+  * The file name will be displayed in a text box. You can change it as needed.
+  * Click on the ''Upload'' button to upload the file.
+  * After it's uploaded, click on the file name displayed to select it.
+==== Select an existing file ====
+To select an existing file, scroll down thru the list and click on the file name you want.
+==== If the file is in a different namespace ====
+If the file is in a different namespace, click on the left hand tree links to select the namespace where it's stored. then select the file.
+:!: If you have no idea where the file is stored, you can use the regular Media Manager and its ''Search'' function.
+===== Link Settings window =====
+{{ faqs:about_this_wiki:link_settings.jpg?300 }}
+When you select an image in the [[#Media Files window|Media Files window]], this window can pop up.
+Use the //Alignment //buttons to select //Default//, //Left Alignment//, //Centered//, or //Right Alignment//. This corresponds to the [[#Alignment|Alignment]] options above.
+Use the //Image size //buttons to select //Small//, //Medium//, //Large //or //Original //image size. This will set a number in the [[#Dimensions|Width]] field above.
+Click on Insert to complete the selection and return to the [[#Media Configuration window|Media Configuration window]].