Add an image to an article using SPIP 3

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.
IconImage typeSuggested shortcut templates
Postcard Illustration <img>
Paper-clip Portfolio <doc> and <emb>

Read also : SPIP images shortcuts : know-how

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), or
  • Remove from the Portfolio (if the image is set in the Portfolio).

Author naema Published : Updated : 29/01/19

Translations : English, français, Nederlands