Differences

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

--- res:plugins:photoswipe [2020/04/19 13:29] – arvid
+++ res:plugins:photoswipe [2025/01/12 15:48] (current) – moved to doc:plugins:photoswipe arvid
@@ Line 1: / Line 1: @@
-====== PhotoSwipe ======
-This FlatPress plugin displays single images and whole image galleries with the JavaScript library [[http://photoswipe.com/|PhotoSwipe]] which provides a very appealing fullscreen display of the images. And on mobile devices such as tablets or smartphone you can browse through the images by swipe gestures.
-Since the plugin uses FlatPress default functionality for building the image HTML, you may use the documented parameters of the [img] tag such as "alt", "title", "height", "width" or "float" (see [[doc:plugins:bbcode|FlatPress BBCode documentation]] for details).
-Author: [[https://www.arvidzimmermann.de|Arvid Zimmermann]]
-===== Download =====
-{{ :res:plugins:arvid:photoswipe1.0.1.zip |}}
-===== Usage =====
-For a single image:
-<code>[photoswipeimage="images/image.jpg"]</code>
-Floating image with given width:
-<code>[photoswipeimage="images/image.jpg" width="200" float="right"]</code>
-For an image gallery:
-<code>[photoswipegallery="images/NameOfTheGallery"]</code>
-Gallery width given image height:
-<code>[photoswipegallery="images/NameOfTheGallery" height="100"]</code>
-===== HTML+CSS =====
-The HTML code of the images is generated by the BBCode standard function //do_bbcode_img()// (see fp-plugins/bbcode/plugin.bbcode.php). Therefore, standard image attributes (such as "width", "height", etc.) can be used. Floating images will get a corresponding CSS class (e.g. "floatright").
-The plugin will wrap that HTML in a <figure> element with the same CSS class as the image (e.g. "floatright"). The <figure> also contains a <figcaption> displaying the title of the image.
-The <figure> element itself is surrounded by a <div class="photoswipe">.
-Galleries are displayed as a series of images as described above, encapsulated by a <div class="img-gallery">.
-===== Captions =====
-Captions of the gallery images will be read from a text file "texte.conf" within the gallery directory.
-For having the title attribute in the gallery images (and therfore, also see it as description below the images in the gallery), just create a file "texte.conf" within the gallery directory. If you have the gallery images 1.jpg, 2.jpg and someother.jpg, your texte.conf should look like this:
-<code>
-.jpg = Description of the first image
-.jpg = This is the second image.
-someother.jpg = OMG, another image!
-</code>
-For now, you have to create the texte.conf files for each gallery manually via FTP, I haven't developed a convenient plugin UI for that. You may if you want to :)