This custom widget does not apply to all themes. Check your theme's description first, to make sure it's included.
To add this tab script to your website, you just need to add some HTML code to the desired page.
The Code
Paste this code in the content area where you want the gallery to be displayed:
<div id="flickr_div" class="widget widget-flickr"></div>
Simple Flickr Gallery
To return a simple list of images from Flickr, add this script below previous div :
<script type="text/javascript">
$(document).ready(function() {
$('#flickr_div').flickrGallery('FLICKR_SET_ID', 'YOUR_FLICKR_API_KEY', 'NUMBER_OF_PHOTOS');
}); </script>
Flickr Gallery with PrettyPhoto
To return a list of images from Flickr, and provide immediate click and preview functionality, add this script below previous div :
<script type="text/javascript">
$(document).ready(function() { // if you want to show gallery thumbs in prettyPhoto you need to set a name for your gallery in 'GALLERY_NAME' // set gallery_name to false to hide gallery thumbs in PrettyPhoto $('#flickr_div').prettyFlickrGallery('FLICKR_SET_ID', 'YOUR_FLICKR_API_KEY',false)
$('#flickr_div').prettyFlickrGallery('FLICKR_SET_ID', 'YOUR_FLICKR_API_KEY', 'NUMBER_OF_PHOTOS', 'GALLERY_NAME'); }); </script>
Images size
If you need to change the aspect ratio of the images in the list, you can edit the .css file in your theme (file name depends on the CMS platform) and add to the bottom:
.widget-flickr a,
.widget-flickr a img {height: 100px; width: 100px;}
Adjust values as necessary.
This doesnt work in DNN 6. The HTML module strips out the <script>
Hi, for DNN6 you can edit the module's settings, and add the code to Advanced Settings > Header.
Cheers!
The images all come through HUGE (full size), how do you make them display in thumbnails?
The theme includes in file widgets.css the following CSS code:
.widget-flickr a img {... height: 50px; width: 50px;}
This sets a size for the thumbnail images.
Right, the images are showing but not with the correct aspect, the hover icon is not there and it is displaying all images in the set. Can it be limited to say 12 images?
Also the skin falls apart in IE7
Can you share a link to your page? Thanks.
http://flasharilla.dailysite.co/
I open a support ticket where we can help you.
So what is the answer for this, the aspect ratio is way off and there is no way to limit the number of images displayed (we only want 12)
You can set the banner image size to whatever you want. Which is the desired image size?
About a maximum number of items, the Nivo Slider ( http://nivo.dev7studios.com/) does not have that feature.
How can you get the pictures to open in a new window or in a slideshow type format? If you click the thumbnail it opens the window but if a user closes it, it closes the session.
You have the option of using the gallery with PrettyPhoto, which opens the images as a slideshow on a popup. (see above)