Flexslider: How can I display image captions in my node? - drupal

I have a site where my nodes (articles) can have multiple featured images. By default, my articles have this gallery at the top of the page rotating through the images. I like it. I'd like to know where I can go to modify it, though, since I'd like to display caption information as well.
This is what my article node looks like (though I haven't added all the styling yet):
https://www.dropbox.com/s/c62wg8w0b52o48z/t1.PNG?dl=0
This is the information for the images in my article node:
https://www.dropbox.com/s/jglmo1ogm6jg2xs/t2.PNG?dl=0
As you can see, I have a Title, Alt, and Caption for each image. The title appears below the image by default. I'd like to display that caption, especially, somewhere near the image.
In my display settings under "Manage Display", I was able to select a bunch of different ways of displaying this gallery. I chose FlexSlider, and there's an option for displaying the image title (which exists no matter what I pick), but none for caption:
https://www.dropbox.com/s/a4cz4audj9o6p6w/t3.PNG?dl=0
Here's a live version of the page:
http://ccdrupal.dor.org/articles/multi-image-test#
Is that something that's easily done? I don't think this is the theme's functionality, but maybe it is. I'm using the Blogger theme for D7. Is there an extension that can do this? Is there something I should look for or change in the code?

Check out that flex slider plugin and what template files it provides. Try finding and overriding template file that displays the image. Idea is to find how image is printed and image source is collected and use the same way to collect image caption field. Then you can add some extra HTML to print image caption.

Related

Custom classes for imags in drupal

My basic requirement is to display one picture on a page which on clicking, displays a colorbox slideshow of all the pictures in that content type.
https://www.drupal.org/node/1026112
This is the solution I got for it. To apply display:none css for the rest of the images. For that, I need different classes for the images. I'm unable to figure out how to do so.I got a few solutions such as adding a preprocess_image function but it doesn't seem to work. Can I get some help here?
We did this in past using the "Image sets" option provided with the Lightbox2 Drupal module. We had a client request to show one image and then open a slideshow on the same page of the images associated with that content in the CMS. This module say:
If you have a set of images that you would like to group together in a
lightbox, but only wish for one of these images to be visible on your page, you
can assign the "lightbox_hide_image" class to hide the additional images. For
example:
image #1
image #2
image #3
You can create a custom node template to render the images in the required format.
Hope this will help you!

Wordpress - Image lightbox with different image when clicked

For my wordpress site, I need some images arranged in a grid and when one is clicked a specific (different) image is displayed bigger. I thought that there maybe is a lightbox/gallery plugin, where one enters the link for the small and big picture, and I can just use the link to a different image instead of to the same one, but bigger. Does anyone know a plugin that works like that? Or any other way to make that work?
You can use "WP Gallery Custom Links" plugin to set different image link by using "custom URL" option.
Simply go to a post or page and create a new gallery. You will see the custom link meta fields for individual images in a gallery.

Custom content in fancybox in drupal

I have a page, which should contain kind of gallery, and some data when its clicked. So far i found how to display images in it, but how do i display some content there instead of images?
I have content type news, which i should display in light box
Found easier way to do this. I have used colorbox module with colorbox node module. Easy setup, easy use.

Is it possible to have a large image above the content node in Drupal?

I'm trying to replicate pages like the following using Drupal:
http://www.ams-neve.com/Products/Outboard/1073LB/1073LB.aspx
My problem is that I'd like the image at the top (which changes depending on which page you're on) to be part of the main content node, while the menu on the left is a sidebar region.
I'd like to have a 'product' content type where I can write the main copy, include linked files, etc. plus have a 'header image' which would be what appears at the top of the page.
I have the feeling that it can't be done like this because I'd essentially need bits of the node to be rendered into different blocks. If I theme the node template to wrap a div around the header image I can't figure out a way to have that moved to the top of the page and displace the left sidebar down.
Can anyone tell me if it's possible, or suggest an alternative route.
There are a lot of products so I need it to be a simple method.
The method I used was to create a Views Slideshow Block in Views. It pulled the header_image field from my node by looking at the page it was on. I put this block into the header of my page.
Anyone else looking at this should also check out Display Suite. You can do a lot of cool stuff with that.
if i'm not getting it wrong you are having problems with the default way in which drupal blocks work. Have you tried panels? It's an awesome plugin to work with drupal which let you create pages in a really flexible way.
You could have a custom field for your 'Product' content type that is an image or a text field to a URL for the header image. Just use CSS to place them where you'd like.
Alternatively, check out these links, I think they are what you are looking for.
http://drupal.org/project/headerimage
http://drupal.org/project/sections

Same node, different templates in Drupal, how to do?

I have a content type which displays an image.
When this image is displayed as regular node page (node/xxx), I would like it to use the regular template file.
When this image is displayed in a modal (Lightbox2 popup modal), I would like it to use another template file (to remove the header and footer, change background, etc).
How can I set two different templates for the same node?
Thanks,
You probably want to use page-node-lightbox2.tpl.php which can be found in the lightbox2 module folder. Copy that file to your theme folder and make all the changes you want, then clear your cache (www.example.com/admin/settings/performance) and you should see the changes to the modal view of your images.

Resources