PUBLISHED : Add an image to an article using SPIP 3

**SPIP**

# Article validated

The article "**Add an image to an article using SPIP 3 **
(https://www.spip.net/en_article6491.html)" was validated by
<multi>[ar]جورج[fr]George [en]George</multi>.

* * *

## Add an image to an article using SPIP 3

Monday 28 January 2019 , by [naema](.././?page=auteur&id_auteur=8207&)

SPIP 3 provides two ways for adding images:

* **As an illustration** : used to illustrate the text of your article,
i.e. inside the very body of your article ;
* **As attached documents or portfolio**: used to insert heavier images,
to create a sideshow, a contact sheet... i.e. outside of the text of your
article, that will be displayed below the text. Please note, this option is
only available if the webmaster has activated the feature in :
*Configuration* > *Site content* > *Attached documents* > *Enable the
upload of documents for the contents : Articles*.

SPIP 3 integrates the image download method from the Medias plugin (that is
provided by default with SPIP 3, previously known as multimedia library).
You can now add/upload images (or documents) in one of the following ways :

* **From my computer**: to upload a document that is saved on the
hard-drive of your machine (or any other device connected to your computer,
eg. a pen drive, just select the appropriate directory) ;
* **From the media library**: to select a document that has already been
uploaded into the website, by browsing through the main Media page that
lists all "media" documents ;
* **From the server**: to upload documents previously transferred by FTP
in the /tmp/upload directory (the best way to rapidly upload large
documents, heavy files or large quantities of documents to your site) ;
* **From the internet**: to upload a remote document such as a YouTube
video, a Flickr image, a zip file from the GitHub community, etc.

## Add an image as an Illustration

Go to your article page. The document upload form is accessible both
through the View/Consultation and the Edit pages of your article.

**Document upload from the Edit page of the article **
On your left-hand side is a tool box to upload a document, as below:

Select or upload your document through one of the 4 methods described above
and click on "Upload".

Your image will now be listed on the left-hand side, with its thumbnail,
its title (if there was one attributed to the image, otherwise it says "No
title") and below, a list of shortcut templates to help you insert your
image in the body of your article.

You can upload several documents, they will be listed in queue in the
upload order.

**Please note :** At this point, your image is not yet in the body of your
article : you need to explicitly write the shortcut of your choice (chosen
from the shortcut templates - simply copy and paste the code) in the text
of your article where you wish your image to appear.

You can update the document information (eg. the title, description, or
credit line...) by clicking on the listed document and add or modify the
appropriate field. Don’t forget to save your modifications. You might do
so either before or after including the image to your text, the update will
be taken into account in either cases.

**Document upload from the Consultation/View page of the article **
On the very bottom of the article stands the Document icon, as below :

Click on it and it will display the same tool box as illustrated above.
Select or upload your document in the exact same way.

Your image will be displayed at the bottom of the article in the
"Illustration" insert.

## Add an image in the Portfolio

**Reminder :** This option is available only if the webmaster has enabled
the Attached Document feature.

Add your image in the exact same way as described above.

In the image thumbnail box you’ll see another link : "Drag in the
Portfolio".

**Tip:** If you upload your documents altogether in a zip file, during
extraction, SPIP will further offer extra options such as adding all the
images to the portfolio, automatically adding titles to them, etc.

## Identify if the document is set as an Illustration or in the Portfolio

**In the Edit page of your article **
When you edit your article, all media are listed on the left-hand side and
they are identified in a different way depending on which modality was
chosen :

* a different icon : postcard icon (document as Illustration) or
paper-clip (document in the Portfolio)
* different shortcut templates.

Icon
Image type
Suggested shortcut templates

Postcard
Illustration
`<img>`

Paper-clip
Portfolio
`<doc>` and `<emb>`

---------------------------------------------------------------------------

Read also : SPIP images shortcuts : know-how
(https://www.spip.net/ecrire/?exec=article&id_article=6485)

**In the View/Consultation page of your article **
At the bottom of the page, both types of images are listed in their
appropriate section.

## How can I change the image setting, from an Illustration to the
Portfolio, or from the Portfolio to an Illustration ?

In the View page of the article, the Image setting insert offers the
appropriate option :

* Send the Portfolio (if the image is set as an illustration).
* Remove from the Portfolio (if the image is set in the Portfolio), or

— Sent by SPIP (https://www.spip.net/)

rubon209-56821.jpg