{"id":24740,"date":"2013-09-07T22:58:49","date_gmt":"2013-09-07T22:58:49","guid":{"rendered":"https:\/\/wordpress.org\/plugins-wp\/fotorama\/"},"modified":"2014-12-31T13:02:58","modified_gmt":"2014-12-31T13:02:58","slug":"fotorama","status":"closed","type":"plugin","link":"https:\/\/wordpress.org\/plugins\/fotorama\/","author":12942275,"comment_status":"closed","ping_status":"closed","template":"","meta":{"version":"4.6.3","stable_tag":"4.6.3","tested":"3.9.40","requires":"3.5","requires_php":"","requires_plugins":"","header_name":"Fotorama","header_author":"Artem Polikarpov","header_description":"","assets_banners_color":"628390","last_updated":"2017-11-28 21:34:15","external_support_url":"","external_repository_url":"","donate_link":"https:\/\/www.paypal.com\/cgi-bin\/webscr?cmd=_s-xclick&hosted_button_id=7M9KK5AQPG6CC","header_plugin_uri":"http:\/\/fotorama.io\/","header_author_uri":"https:\/\/github.com\/artpolikarpov","rating":4.6,"author_block_rating":0,"active_installs":3000,"downloads":46477,"num_ratings":24,"support_threads":0,"support_threads_resolved":0,"author_block_count":0,"sections":["description","installation","faq"],"tags":[],"upgrade_notice":[],"ratings":{"1":"2","2":0,"3":0,"4":"2","5":"20"},"assets_icons":[],"assets_banners":{"banner-1544x500.jpg":{"filename":"banner-1544x500.jpg","revision":"768431","resolution":"1544x500","location":"assets"},"banner-772x250.jpg":{"filename":"banner-772x250.jpg","revision":"798913","resolution":"772x250","location":"assets"}},"assets_blueprints":{},"all_blocks":[],"tagged_versions":["4.5.0","4.5.1","4.5.2","4.6.0","4.6.3"],"block_files":[],"assets_screenshots":{"screenshot-1.png":{"filename":"screenshot-1.png","revision":"768431","resolution":"1","location":"assets"},"screenshot-2.png":{"filename":"screenshot-2.png","revision":"768431","resolution":"2","location":"assets"},"screenshot-3.png":{"filename":"screenshot-3.png","revision":"768536","resolution":"3","location":"assets"},"screenshot-4.png":{"filename":"screenshot-4.png","revision":"768431","resolution":"4","location":"assets"}},"screenshots":{"1":"Fotorama post with responsive \u201cTwenty Thirteen\u201d theme","2":"Neat with \u201cTwenty Twelve\u201d","3":"Seamless responsive","4":"Looks well with every background"}},"plugin_section":[],"plugin_tags":[150027,210,133,163,611],"plugin_category":[43,50],"plugin_contributors":[80311],"plugin_business_model":[],"class_list":["post-24740","plugin","type-plugin","status-closed","hentry","plugin_tags-fotorama","plugin_tags-gallery","plugin_tags-image","plugin_tags-images","plugin_tags-slider","plugin_category-customization","plugin_category-media","plugin_contributors-artpolikarpov","plugin_committers-artpolikarpov"],"banners":[],"icons":{"svg":false,"icon":"https:\/\/s.w.org\/plugins\/geopattern-icon\/fotorama_628390.svg","icon_2x":false,"generated":true},"screenshots":[{"src":"https:\/\/ps.w.org\/fotorama\/assets\/screenshot-1.png?rev=768431","caption":"Fotorama post with responsive \u201cTwenty Thirteen\u201d theme"},{"src":"https:\/\/ps.w.org\/fotorama\/assets\/screenshot-2.png?rev=768431","caption":"Neat with \u201cTwenty Twelve\u201d"},{"src":"https:\/\/ps.w.org\/fotorama\/assets\/screenshot-3.png?rev=768536","caption":"Seamless responsive"},{"src":"https:\/\/ps.w.org\/fotorama\/assets\/screenshot-4.png?rev=768431","caption":"Looks well with every background"}],"raw_content":"<!--section=description-->\n<p><a href=\"http:\/\/fotorama.io\/\">Fotorama<\/a> is a simple, stunning, powerful jQuery gallery.<\/p>\n\n<ul>\n<li>All Browsers. From IE 7 to Safari on iOS. Including Android and Windows Phone.<\/li>\n<li>Neat and transparent. Looks great by default, even better with your settings.<\/li>\n<li>Compact in-page and epic fullscreen mode.<\/li>\n<li>Touch gestures. Fine response to drag and swipe.<\/li>\n<li>Seamless responsive.<\/li>\n<li>Fast CSS3 transitions.<\/li>\n<li>Save Bandwidth. Fotorama lazy loads only one image ahead.<\/li>\n<li>Let Fotorama play photos automatically. The show will stop on touch.<\/li>\n<li>Thumbnails, shuffle, keyboard navigations, loop, and more...<\/li>\n<\/ul>\n\n<p>Licensed under the MIT.<\/p>\n\n<!--section=installation-->\n<ol>\n<li>Install Fotorama either via the WordPress.org plugin directory, or by uploading the files to your server.<\/li>\n<li>After activating Fotorama your galleries turn into fotoramas.<\/li>\n<li>Say Hi to Fotorama!<\/li>\n<\/ol>\n\n<p><a href=\"http:\/\/youtu.be\/gsObwOvtt_o\"><strong>Installation screencast<\/strong><\/a><\/p>\n\n<h4>Customize<\/h4>\n\n<p>Control a single fotorama using <a href=\"http:\/\/codex.wordpress.org\/Gallery_Shortcode\">standard gallery shortcode<\/a>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\"]\n<\/code><\/pre>\n\n<p>Shortcode will take the following core attributes: <code>ids<\/code>, <code>orderby<\/code>, <code>order<\/code>, <code>id<\/code>, <code>include<\/code>, and <code>exclude<\/code>.<\/p>\n\n<p>Disable fotorama and use standard gallery with <code>fotorama=\"false\"<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" fotorama=\"false\"]\n<\/code><\/pre>\n\n<p>Fotorama\u2019s default settings are good, so there\u2019s no need to mess with them. Still, you can fine-tune. Add any attributes that are listed <a href=\"http:\/\/fotorama.io\/customize\/\">in the original documentation<\/a>, but without <code>data-<\/code> prefix.<\/p>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/thumbnails\/\"><strong>Thumbnails<\/strong><\/a>\n<br \/>Change navigation style from iPhone-style dots to thumbnails by adding <code>nav=\"thumbs\"<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" nav=\"thumbs\"]\n<\/code><\/pre>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/fullscreen\/\"><strong>Fullscreen<\/strong><\/a>\n<br \/>Allow fotorama to enter fullscreen using <code>allowfullscreen<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" allowfullscreen=\"true\"]\n<\/code><\/pre>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/fit\/\"><strong>Fit<\/strong><\/a>\n<br \/>There are 4 ways to fit an image into a fotorama: <code>contain<\/code>, <code>cover<\/code>, <code>scaledown<\/code>, and <code>none<\/code>. Choose one:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" fit=\"cover\"]\n<\/code><\/pre>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/transition\/\"><strong>Transition<\/strong><\/a>\n<br \/>Define which transition to use \u2014 <code>slide<\/code> or <code>crossfade<\/code> \u2014 using <code>transition<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" transition=\"crossfade\"]\n<\/code><\/pre>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/hash\/\"><strong>Hash<\/strong><\/a>\n<br \/>Attribute <code>hash=\"true\"<\/code> lets the page change its URL upon switching images. To send a link to a specific photo to a friend :-)<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" hash=\"true\"]\n<\/code><\/pre>\n\n<p>Better be used with only one fotorama per page.<\/p>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/loop\/\"><strong>Loop<\/strong><\/a>\n<br \/>Loop the last and the first frame for seamless transition using <code>loop=\"true\"<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" loop=\"true\"]\n<\/code><\/pre>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/autoplay\/\"><strong>Autoplay<\/strong><\/a>\n<br \/>Let Fotorama play photos automatically using <code>autoplay=\"true\"<\/code>. By default, a pause between images is 5 seconds. Set any interval in milliseconds, for example, 3 seconds:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" autoplay=\"3000\"]\n<\/code><\/pre>\n\n<p>The show stops on touch. Change this with <code>stopautoplayontouch=\"false\"<\/code>.<\/p>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/shuffle\/\"><strong>Shuffle<\/strong><\/a>\n<br \/>Shuffle frames by adding <code>shuffle=\"true\"<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" shuffle=\"true\"]\n<\/code><\/pre>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/keyboard\/\"><strong>Keyboard<\/strong><\/a>\n<br \/>Turn on keyboard navigation with the arrows by adding <code>keyboard=\"true\"<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" keyboard=\"true\"]\n<\/code><\/pre>\n\n<p>Works only for the first fotorama on page.<\/p>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/arrows-click-swipe\/\"><strong>Arrows, click, swipe<\/strong><\/a>\n<br \/>Control the way your users interact with the fotorama with three attributes <code>arrows<\/code>, <code>click<\/code>, and <code>swipe<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" arrows=\"true\" click=\"true\" swipe=\"false\"]\n<\/code><\/pre>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/navigation-position\/\"><strong>Navigation position<\/strong><\/a>\n<br \/>To move dots or thumbs on top, use <code>navposition=\"top\"<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" navposition=\"top\"]\n<\/code><\/pre>\n\n<p>Hide navigation with <code>nav=\"false\"<\/code>.<\/p>\n\n<!--section=faq-->\n<dl>\n<dt>Installation Instructions<\/dt>\n<dd><ol>\n<li>Install Fotorama either via the WordPress.org plugin directory, or by uploading the files to your server.<\/li>\n<li>After activating Fotorama your galleries turn into fotoramas.<\/li>\n<li>Say Hi to Fotorama!<\/li>\n<\/ol>\n\n<p><a href=\"http:\/\/youtu.be\/gsObwOvtt_o\"><strong>Installation screencast<\/strong><\/a><\/p>\n\n<h4>Customize<\/h4>\n\n<p>Control a single fotorama using <a href=\"http:\/\/codex.wordpress.org\/Gallery_Shortcode\">standard gallery shortcode<\/a>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\"]\n<\/code><\/pre>\n\n<p>Shortcode will take the following core attributes: <code>ids<\/code>, <code>orderby<\/code>, <code>order<\/code>, <code>id<\/code>, <code>include<\/code>, and <code>exclude<\/code>.<\/p>\n\n<p>Disable fotorama and use standard gallery with <code>fotorama=\"false\"<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" fotorama=\"false\"]\n<\/code><\/pre>\n\n<p>Fotorama\u2019s default settings are good, so there\u2019s no need to mess with them. Still, you can fine-tune. Add any attributes that are listed <a href=\"http:\/\/fotorama.io\/customize\/\">in the original documentation<\/a>, but without <code>data-<\/code> prefix.<\/p>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/thumbnails\/\"><strong>Thumbnails<\/strong><\/a>\n<br \/>Change navigation style from iPhone-style dots to thumbnails by adding <code>nav=\"thumbs\"<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" nav=\"thumbs\"]\n<\/code><\/pre>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/fullscreen\/\"><strong>Fullscreen<\/strong><\/a>\n<br \/>Allow fotorama to enter fullscreen using <code>allowfullscreen<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" allowfullscreen=\"true\"]\n<\/code><\/pre>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/fit\/\"><strong>Fit<\/strong><\/a>\n<br \/>There are 4 ways to fit an image into a fotorama: <code>contain<\/code>, <code>cover<\/code>, <code>scaledown<\/code>, and <code>none<\/code>. Choose one:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" fit=\"cover\"]\n<\/code><\/pre>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/transition\/\"><strong>Transition<\/strong><\/a>\n<br \/>Define which transition to use \u2014 <code>slide<\/code> or <code>crossfade<\/code> \u2014 using <code>transition<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" transition=\"crossfade\"]\n<\/code><\/pre>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/hash\/\"><strong>Hash<\/strong><\/a>\n<br \/>Attribute <code>hash=\"true\"<\/code> lets the page change its URL upon switching images. To send a link to a specific photo to a friend :-)<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" hash=\"true\"]\n<\/code><\/pre>\n\n<p>Better be used with only one fotorama per page.<\/p>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/loop\/\"><strong>Loop<\/strong><\/a>\n<br \/>Loop the last and the first frame for seamless transition using <code>loop=\"true\"<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" loop=\"true\"]\n<\/code><\/pre>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/autoplay\/\"><strong>Autoplay<\/strong><\/a>\n<br \/>Let Fotorama play photos automatically using <code>autoplay=\"true\"<\/code>. By default, a pause between images is 5 seconds. Set any interval in milliseconds, for example, 3 seconds:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" autoplay=\"3000\"]\n<\/code><\/pre>\n\n<p>The show stops on touch. Change this with <code>stopautoplayontouch=\"false\"<\/code>.<\/p>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/shuffle\/\"><strong>Shuffle<\/strong><\/a>\n<br \/>Shuffle frames by adding <code>shuffle=\"true\"<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" shuffle=\"true\"]\n<\/code><\/pre>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/keyboard\/\"><strong>Keyboard<\/strong><\/a>\n<br \/>Turn on keyboard navigation with the arrows by adding <code>keyboard=\"true\"<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" keyboard=\"true\"]\n<\/code><\/pre>\n\n<p>Works only for the first fotorama on page.<\/p>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/arrows-click-swipe\/\"><strong>Arrows, click, swipe<\/strong><\/a>\n<br \/>Control the way your users interact with the fotorama with three attributes <code>arrows<\/code>, <code>click<\/code>, and <code>swipe<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" arrows=\"true\" click=\"true\" swipe=\"false\"]\n<\/code><\/pre>\n\n<p><a href=\"http:\/\/fotorama.io\/customize\/navigation-position\/\"><strong>Navigation position<\/strong><\/a>\n<br \/>To move dots or thumbs on top, use <code>navposition=\"top\"<\/code>:<\/p>\n\n<pre><code>[gallery ids=\"1,2,3\" navposition=\"top\"]\n<\/code><\/pre>\n\n<p>Hide navigation with <code>nav=\"false\"<\/code>.<\/p><\/dd>\n<dt>How not to repeat the same attributes in each [gallery]? Is it possible to override the defaults?<\/dt>\n<dd><p>Yes, there is a hack for that. Create file <code>fotoramaDefaults.js<\/code> in the <code>\/wp-content\/plugins\/<\/code> directory and list your options like so:<\/p>\n\n<pre><code>fotoramaDefaults = {\n  nav: 'thumbs',\n  allowfullscreen: 'native',\n  transition: 'crossfade',\n  loop: true,\n  keyboard: true\n}\n<\/code><\/pre>\n\n<p>Fotorama will try to fetch the options from the <code>\/wp-content\/plugins\/fotoramaDefaults.js<\/code>.<\/p><\/dd>\n\n<\/dl>","raw_excerpt":"Transforms standard galleries into fotoramas.","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/24740","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=24740"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/artpolikarpov"}],"wp:attachment":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=24740"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=24740"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=24740"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=24740"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=24740"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=24740"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}