DIY Flickr Style Guide
It's easier and less error prone to use the sub-module Flickr Style but if you are inclined to do it yourself, here are some instruction to
This documentation describes the latest stable D7 version of the Flickr Style sub-module. |
Extra configuration options: Rounded corners, shadow, border, emphasize on hover.
At admin/config/media/flickr in the section STYLING (CSS RELATED):
Checkbox.
Uncheck to take care of the styling yourself in custom CSS.
If you use Flickr Filter, you might find the AutoFloat module useful.
Checkboxes.
- Rounded corners
- Shadow
- Border
Radio buttons.
- No
- Yes, separate from the image
- Yes, wrapped around the image and caption ("Polaroid" effect if applied with a border)
Checkbox.
Radio buttons.
- No
- Enlarge slightly (includes the caption)
- Enlarge (image only) (*)
- Zoom (*)
- Magnifier icon
(*): The 'Zoom' and 'Enlarge' styles use bigger images to maintain the resolution. This has a slight performance impact and the size 'big square' (q) is not square but 150px on the longest side to avoid distortion on older browsers.
You can suppress the block titles with CSS. For example for the block 'Flickr: User photos with specific tags' ($delta=11), it would look like:
#block-flickr-11 .flickr-album-heading {
display: none;
}
See https://www.drupal.org/node/2289797.
If you prefer to define all CSS yourself, read the instructions that explain how to make it look fancy in custom CSS. The results are similar to those of the Flickr Style sub-module that obviously is less error prone. Furthermore the sub-module makes it easier to switch between one style and another to make the end client choose their preference.
It's easier and less error prone to use the sub-module Flickr Style but if you are inclined to do it yourself, here are some instruction to