Early Bird Registration for DrupalCon Portland 2024 is open! Register by 23:59 PST on 31 March 2024, to get $100 off your ticket.
The current image flexslider_fields support for images is awesome!
We'd like to be able to switch from using the Field Slideshow module to instead use Flex Slider as Field Slideshow is lacking responsive-goodness.
Field Slideshow has on their project page: "This module plays well with: ... Field Collection (to provide the images to the slideshow, and use additional fields for captions and/or links)"
This is what it looks like in use when I am looking at the display options for my content type which has a field collection:
And when those options are expanded:
Comments
Comment #1
sokrplare CreditAttribution: sokrplare commentedTaking a look at what settings would be needed in a similar Flex Slider version, and what is already handled inside the Flex Slider config system.
Comment #2
sokrplare CreditAttribution: sokrplare commentedUpdating title to match actual code additions. Assigning to myself.
Comment #3
sokrplare CreditAttribution: sokrplare commentedFirst pass with linking, caption, and field collection support!
Notes
flexslider_fields.module
)Comment #4
sokrplare CreditAttribution: sokrplare commentedLooking through the issue queue and these are tangentially related:
#1568248: using flexslider field, how do i create a text area that rotates with the images?
#1538662: Add ability to add links to image fields
Comment #5
minorOffense CreditAttribution: minorOffense commentedI'll review tonight and see about pushing it into dev.
I have a new release scheduled for next week (the ever illusive 1.0 release)
Comment #6
minorOffense CreditAttribution: minorOffense commentedThe patch fails against the latest dev.
Can you re-roll it and post a new one? Just set the status to "Needs review" when you're ready.
Thanks.
Comment #7
sokrplare CreditAttribution: sokrplare commentedThanks for taking a look - poked around and looks like the Views caption and link patch (which looks awsome!) conflicts.
I've merged the changes in theme/flexslider-container.tpl.php so it should work for both. Git has gone crazy (or rather, this Git user) and I'm way too tired to figure it out right now. Posting the merged file itself. Might get to look more into this tomorrow, but not looking likely as the project that needed this has hit phase II and there is a ton of other stuff on my plate.
Can't wait for the 1.0 release!
Comment #8
sokrplare CreditAttribution: sokrplare commentedAlright, couldn't leave it alone. Here is the patch!
Comment #9
minorOffense CreditAttribution: minorOffense commentedI'm moving this to the 2.x branch. I'll create the feature there and backport to 1.x since this was created before I decided to feature lock the first version.
Comment #10
floydm CreditAttribution: floydm commentedThank you much for adding this! I'd been pulling my hair out trying to figure out whether it was better to try to add adaptiveness to field_slideshow or caption and linkiness to Flex Slider. I just applied the patch to the latest 1.x devel build and it appears to be exactly what I need.
BTW if anyone else is having a tough time how to configure things so this works for them, follow these instructions on setting up a slideshow using a field collection but sub in Flex Slider for field_slideshow.
-Floyd
Comment #11
muranod CreditAttribution: muranod commentedI really need this ability to add a caption field / field collections, but just can't make the patch work (using vista). I've patched only one module before and that took days, and now, following my own directions and trying both Netbeans and Tortoise SVN, I cannot get this to work. Can I do this manually?
Comment #12
Jackinloadup CreditAttribution: Jackinloadup commentedmuranod: check out Applying patches page.
Comment #13
muranod CreditAttribution: muranod commentedThanks, jackinloadup. I hadn't seen that page - I'll give it a go tomorrow. Appreciate the help - my sites all ready to go except for the photo galleries, which will be one of the main parts of it, so I want to to look simple and elegant, with captions.
Dan
Comment #14
sokrplare CreditAttribution: sokrplare commented@muranod - if you don't actually need Field Collection support - which it sounds like you might not - the Image Title and Alt fields will actually display as a caption out-of-the-box so you don't need to add all this overhead.
Comment #15
muranod CreditAttribution: muranod commentedI guess I could just stay with the alt tag, but I thought having a caption feld might give me a few more presentation options and make organizing, formatting and writing detailed captions a bit easier. Would field collection add that much overhead? Galleries will be from 10 to 40 images, depending on the story / subject.
In either case, 'd like to keep the caption text to the width of the image, which normally alternates between horizontal and vertical orientations. I'm guessing that I would have to add another div in the template file for that?
Comment #16
muranod CreditAttribution: muranod commentedUPDATE: For anyone who is having difficulty applying a patch. Nothing was working for me. I was trying to apply the patch a) from the command line, b) from TortoiseSVN right-click context menu (windows), and then c) opening things in TortoiseSVN, d) trying various menu options in Netbeans.
FINALLY, I simply opened the module itself in NETBEANS and from the menu, TOOLS --> APPLY DIFF PATCH, then select the patch file and it was DONE! I hope this helps someone else who is struggling to simply apply a patch to a module.
Dan
Comment #17
minorOffense CreditAttribution: minorOffense commentedJust a note. The patch is for flexslider v1. V2 will most likely have this built in.
Comment #18
muranod CreditAttribution: muranod commentedThanks, MinorOffence,
Is there any documentation on how to actually set it up?
Comment #19
minorOffense CreditAttribution: minorOffense commentedThe docs for v2 don't exist (since the feature doesn't exist yet ;-)
For v1, it's whatever's in this issue queue.
Comment #20
muranod CreditAttribution: muranod commentedThanks for all the advice. I got it all working perfectly and it's just what I need, but -- can't get the images in the field collection to be adaptive. I've tried all the different settings and they only show at one size.
Comment #21
muranod CreditAttribution: muranod commentedGot it all working now.
In the content type:
Images & captions set to Field Collection, using the embedded widget AND set the display of the field to Flexslider.
In Field Collections, manage fields:
set caption to Text
set Image to Image with the Image widget
Here is a blog url with directions that I followed, except that it didn't work when I set the Field collection display to Slideshow, as recommended there:
http://drupalquests.blogspot.com/2012/01/drupal-7-create-slideshow-insid...
One last thing: any suggestions for getting the caption to be the same width of the photo when the photo changes from horizontal to vertical and back to horizontal again? It's not a deal breaker, but would look nice.
Also, thanks for the help and suggestions,
Dan
Comment #22
ownage CreditAttribution: ownage commentedI installed the v1.x dev, patched with the 2nd above patch, saw the new options, followed the tutorial exactly whilst substituting for Flexslider instead of Field Slideshow, and was unable to construct the View accordingly. I had my Flexslider using Views in a block. The tutorial didn't cover anything about Views, but I tried adding every possible field I could try relating to the collection. Each time Views would tell me, "Style Flex Slider requires an image field to be added."
Maybe I effed up somewhere, but after 4 hours of troubleshooting on something so stupid, it's quite hard to not look for alternative options. I reinstalled the recommended release again for several reasons, one of which was due to there being random notices about undefined alt/title tags somewhere in the theme folder.
Installing 3-4 modules just to get links & captions seems a bit overbearing if I have to be honest. I do respect the development of this module, but hope it can be maintained to become flawless for future use.
Comment #23
muranod CreditAttribution: muranod commentedownage, my views block for this is set to:
FORMAT: Flex Slider, SETTINGS: Grouping field: none, option set: whichever you wish, Caption field: none, Description field: none.
FIELDS: Title
FIELDS: Body
FIELDS: Gallery Images (this is in Field Collections) - Formatter: Flexslider, Option set: whichever you wish, Link image to: Nothing, Caption: Title and Alt text, Link caption to: Nothing.
This plus my other settings above works for me. Hope this helps.
I agree - I am very disappointed that Drupal doesn't have an elegant photo gallery solution that doesn't require putting each gallery image into an individual node. I also don't like requiring a title/alt tag for the caption. This module, with the patch, is closest to what I need.
I am also disappointed that it is such an ordeal to simply add a caption and credit under an image. Hopefully, all of these things will evolve.
Comment #24
ownage CreditAttribution: ownage commentedmuranod:
Thank you for the info. Your settings look exactly how mine were set up, so perhaps something else was wrong in the process.
Whatever it was, I cannot troubleshoot it because I have deleted that info.
I hope this helps someone out-- there's a simple work around to creating a link & rendering HTML inside your flex-captions using jQuery. There is no need to install several modules to get this functionality. I'm assuming I could get the image to link as well, but I haven't tried.
Here's my slideshow:
Here's the code:
Comment #25
gfed CreditAttribution: gfed commentedThanks for the patch! It worked just fine, but I think you're missing a closing div tag in flexslider-container.tpl.php. It broke my layouts until I added it at the end.
Comment #26
naleenyadav CreditAttribution: naleenyadav commentedDear All,
I am trying to achieve #24 i.e. having caption(and read more button) beside images rather than at the bottom. But not able to get it.Settings for my views slider are:
FORMAT: Slideshow SLIDESHOW TYPE: Flex Slider, SETTINGS: Option set: default Link image to: Nothing, Caption: Title, Link caption to: Nothing.
FIELDS: Title
FIELDS: Body
FIELDS: Gallery Images (this is in Field Collections)
my slider looks like this
Any pointer, link or tutorial for the same would be of great help.
Thanks,
Naleen
Comment #27
minorOffense CreditAttribution: minorOffense commentedI'm working on an example view to add to the flexslider_example module to show how to use captions correctly in the new version. I'll notify once it's ready.
Comment #28
pvhee CreditAttribution: pvhee commentedAny update on this? Would love to see the support of captions out-of-the-box with flexslider.
Comment #29
portulaca+1
Comment #30
minorOffense CreditAttribution: minorOffense commentedNothing yet for captions with flexslider_fields at the moment. A little swamped with work. If someone feels like writing a patch I'd be up for reviewing it.
I'm going to focus this issue on only adding caption support to flexslider_fields.
I'll open separate issues for field collections and linking captions.
Comment #31
dianacastillo CreditAttribution: dianacastillo commentedBut how do you add Titles and Alts to the image ? I cant find where to do that!
Comment #32
dianacastillo CreditAttribution: dianacastillo commentedSomeone has answered this for me here http://drupal.org/node/1067620#comment-6994238
Comment #33
minorOffense CreditAttribution: minorOffense commentedWe're adding basic title field support in the captions for FlexSlider. #1861524: Add options for displaying title text on images as caption in FlexSlider Fields
Field collection support will be a separate project (which I haven't started yet). But if someone wants to create the sandbox they're more than welcome. I'd look into the FlexSlider Entityreference module as an example.
Comment #34
davemybes CreditAttribution: davemybes commentedI have created a patch that allows you to use the image title field as the caption. There is a new checkbox in the field Display settings to enable the option. It will link you to the field settings if Title is not enabled for the imagefield.
Comment #35
minorOffense CreditAttribution: minorOffense commentedComment #36
ressa CreditAttribution: ressa commentedI haven't tried any of the above patches, but here is some CSS I used to insert the title of the node on top of the image as a caption.
First, rewrite the view, you need an image and some text, most likely the title of the node:
The CSS:
Comment #37
angoo CreditAttribution: angoo commentedI believe that widgets other than Image Widget have to be taken into consideration.
If Media Browser widget from Media module is in use, title field is defined in file/%/edit
I propose not to check if the Title field is enabled or not, but to simply pull information depending on current widget if it's set.
Comment #39
couloir007 CreditAttribution: couloir007 commentedAny word on v2 and using Field Collection? Thanks!
Comment #40
jenlamptonI love love love the simple handling for title fields, thank you! I'd like to add one additional option here for ALT since I have a site that used the alt tag for captions with field_slideshow module. Attached is a simple patch that just adds ALT support, the other things mentioned earlier in this issue are not included.
Comment #41
pacome CreditAttribution: pacome commentedHi jenlampton,
thanks for your patch, based on it i could find a solution to support Image Field caption module as well for html captions.
For those interested, a -dirty- starting point is here.
-p-
Comment #43
minorOffense CreditAttribution: minorOffense at Coldfront Labs Inc. commentedAdded alt as caption source.
Comment #45
jenlamptonReopening because what has been committed is not working for me. On my site I have ALT fields enabled but Title fields are not. The state of 2.x-dev currently requires that the Title field be enabled in order to use ALT fields for captions.
Comment #46
jenlamptonHere's a follow-up patch that only disables the captions if both title & alt fields are disabled.
Comment #47
minorOffense CreditAttribution: minorOffense at Coldfront Labs Inc. commentedAny chance of conditionally disabling the caption options based on what's enabled? E.g. Only list alt if alt is on, only title if title
Comment #48
slippast CreditAttribution: slippast commentedHi everyone. I found this issue while looking for a solution to get captions working with the Media module. I took angoo's code from #37, cleaned it up and made it compatible with both title and alt fields. I happen to agree that enabling the Title/Alt fields in the field settings is a bit of a barrier. So I removed that warning from the display settings and made this caption check:
I don't love this kind of hackery but the Media module shouldn't be overlooked as a file source. Now Media module Title and Alt fields are working as captions and the switch is in the display settings where I think it belongs.
Comment #49
jenlampton@slippast can you post a patch file for us to test?
Comment #50
jenlamptonHere's a rerolled patch based on #46 and addressing feedback from #47. I don't use media so I'm not sure how to address the feedback left in #48 but if anyone else wants to take a stab at a patch I'd be interested in seeing one.
To address the comment in #47... I agree this is a bit cleaner from a field UI pov. Unfortunately, it won't work for anyone wanting to put an image-with-flexslider field into a panel. The panels settings are unable to take a particular field-instance into account (since that pane may need to work for multiple content types).
I'm not really sure how to rectify this, but have asked for guidance over in ctools land... #2798007: Field instance settings not properly passed into field content pane settings form.
Comment #51
jenlamptonOkay, I think I've got it. Let's give this a go: