2

I've got a content-type called design_portfolio, and created an amount of fields

enter image description here

I've created a view (using the Views module) of only the the field 'thumbnail-design'-image, which is sorted on taxonomy terms in the header

enter image description here

which gives me the next result on the front-end

enter image description here

Each 'thumbnail' links to its' own content, which is a node from the content-type 'design_portfolio' and gives me this result (I wrote a file 'node--design_portfolio.tpl.php' to style the pages for this content-type). Each thumbnail directs to another content within the content-type 'design_portfolio'

enter image description here enter image description here

Everything what I have right now is working properly and has to stay, but what I want to achieve right now is, the posibillity to slide through all the pages/nodes of just this content-type 'design_portfolio'. Like this:

enter image description here

I've allready tried to achieve it with creating a view with 'views slideshow'. Which gives me a good result, but when I click on my thumbnail, it still goes to the corresponding content (page/node), but not the the slideshow that I've created. I want every link to direct to the corresponding slide, because every thumbnails has it's own content.

settings of field thumbnail-design in my first view

enter image description here

inspecter to target a specific link of one slide in the slideshow (created of all content from content-type design_portfolio, used 'views-bootstrap-carousel') enter image description here

Any solutions for my problem?

8
  • OK, this extra edit helps a bit ore, but still nt for 100% (sorry). About some things in your parg to the end ("I've alrady ... own content"): (a) 'creating a view with views slideshow': can you also add a screenprint of that view (it is not the first view screenprint, right?) (b) 'click on thumbnail': which thumbnail, from this 'views slideshow' view I guess, NOT from the thumbnail in your 3rd image, correct? (c) 'not to the slideshow I created': what would be the exact PATH (url) to use (to go to where you want it to link to), and does that use something like a node id ('nid')? Jul 30, 2015 at 16:10
  • (b) yes, I meant the thumbnails on my 3rd image. They each direct to it's own content (page/node). For example; the first thumbnail links to base-url/node/5, the second one links to base-url/node/6. When I create a slideshow by views slideshow (or views bootstrap carrousel) it provides a link for the whole slideshow, like base-url/design-slideshow. I could change the link on the thumbnails to that one, but than I'm not getting the exact content (which is a slide of the slideshow by then) from that exact thumbnail. And thát is what I want.
    – Natascha
    Jul 30, 2015 at 18:29
  • Hm, we're coming closer .. are you aware of "rewrite results"? I.e. for the 1 field that I can see within "Velden". If you can/want, try to also include a screenshot of the details (settings) of that specific field (we might be getting close then). Jul 30, 2015 at 18:34
  • I've just added a screenshot of the settings from the field in my thumbnail-view
    – Natascha
    Jul 30, 2015 at 18:43
  • Hello Pierre, I've added an extra screenshot of the inspector. Every slide, gets a 'data-slide-to=' , but all data-targets are the same. I've added an 'nid' in to the fields in my view and excluded it, then the token becomes visible, but gives me no further result. What is it exactly that I have to do with this token 'nid'?
    – Natascha
    Jul 31, 2015 at 10:49

1 Answer 1

2

Views Slideshow

About this module

You could use the Views Slideshow module for this. Here is a quote from its project page:

... can be used to create a slideshow of any content (not just images) that can appear in a View. Powered by jQuery, it is heavily customizable: you may choose slideshow settings for each View you create.

Potential uses:

  • News item slideshow (such as the title, image and teaser of the last 5 news articles submitted).
  • The Last X number of X submitted (images, videos, blog entries, forum posts, comments, testimonials, etc.).
  • Rotate any image, based on any filters you can apply in views.
  • Hottest new products for any ecommerce drupal site.
  • Rotate contact links, share links, etc.
  • You could rotate entire nodes, categories, image galleries, etc. I wouldn't suggest it, but you have that power.
  • It's also a great space saver. Places where you had multiple images or multiple items such as RSS feeds or category listings can now be presented in a slideshow.

The possibilities are really endless, as the more ways you can think of to categorize and add to views, the more you can rotate.

How to install and use this module

Option a: Use the available (Community) Documentation

To actually enable and use this module, make sure you follow the instructions detailed in the module's Community Documentation within "3.x - Views Slideshow Tutorial". Especially this part of it:

...

  1. Enable the Views slideshow and Views Slideshow: Cycle modules.

  2. You should now see the new views style option called "Slideshow".

So make sure that you also enabled the Views Slideshow: Cycle sub-module.

Additional refinements:

Since in this case you want to do something special (tricky?), you need to do some extra things, within "settings of field thumbnail-design in my first view" (as in your last screenprint):

  • Where there is your "red arrow" (higlighter), it should say "link to" = "nothing" (you now have, in Dutch, "inhoud", which is "content"). FYI: That is what explains what is happening "now": you're asking a click on that image to be translated to something link "type an URL path = the path of the node where that image field is related to ...

  • Where there is your "red cross" (rewrite result), within the 'text' box ('Tekst' in Dutch), you need to further refine what you already have (with that div and token). More specifically, you need to REWORK that to something that corresponds to an hyperlink ('href', etc) (in which you can still use that div, with its class, and image token you already have). The PATH in that href needs to match the exact path that will bring you to what further on in your question you described as "I want every link to direct to the corresponding slide, because every thumbnails has it's own content.". What exactly that path is I cannot tell (I hope YOU know that path, if not we're done). However read on in the next bullet for 1 more hint to CREATE that path for the hyperlink to be added in this tekst box here ...

  • To create the correct path in the previous bullet, I "expect" that you might need something like the "nid", or something similar, of the actual node. It is possible that it is not available (yet) in the list of tokens within "replacement patterns". In my environment, at first I did not have the [nid] token available at first, only things like [title], %1, !1, %2 and !2 . However, also making the [nid] token available is possible like so: add an extra field (node Id) BEFORE (important) the field you already have, and mark it with "exclude from display". That's tricky, but that's how this works in Drupal ...

Option b: Restart from scratch

From the details provided in the question, it appears that it might be an option to consider starting from scratch (which is what I sometimes also do ...). Use HOW TO INSTALL & SETUP VIEWS SLIDESHOW MODULE ON DRUPAL7? as a possible step-by-step tutorial to do so.

As a variation, carefully review that tutorial to get ideas about what in your current approach seems to be wrong, and go back to option 'a'.

Option c: Try another module

If you rather want to change to using "Views Bootstrap" (cfr. one of the prior "versions" of this question, which contained "Views slideshow didn´t pop-up while creating a view, so I used Views Bootstrap."), then please create a NEW question about using Views Bootstrap (which I'd be happy to answer "also" if I can. Because that is a completely different question (and compliant to recent guidance / instructions from @Clive also).

Further enhancements

Possibly you may want to further extended this with related modules (there are dozens of modules to further enhance views) such as Views Slideshow: Galleria. Here is a quote from that module's project page:

Integrating Galleria with Views Slideshow.

Galleria is a JavaScript image gallery framework built on top of the jQuery library. The aim is to simplify the process of creating professional image galleries for the web and mobile devices.

jCarousel

Another option is to consider the jCarousel module. Here is a quote from its project page:

... This module allows developers and themers to make use of the jCarousel jQuery plugin. It includes a developer API that other modules can use, as well as Views integration in the 2.0 version so that you can turn any list of content or images into a carousel.

Features:

  • Built-in Views support.
  • AJAX-loading of additional items as needed.
  • Carousel pager/navigation to jump between multiple pages.
  • Circular wrapping of items.
  • API for direct usage of jCarousel without Views.
12
  • I figured out how to make a slideshow view of my content type, but I don't know how to get it to the right slide, by clicking on the thumbnail in my first view. Now it directs to the content, which is a node, not the view of my slideshow.
    – Natascha
    Jul 29, 2015 at 11:54
  • Hello Pierre, I just did
    – Natascha
    Jul 29, 2015 at 14:18
  • I installed everything which is needed for the module views slideshow, but when creating a view, 'slideshow' doesn't become an option. That's why I choose views bootstraps 'carrousel' which provides me slides as well. The actual problem is: how do I link the thumbnail of my first view to the related slide in the second view?
    – Natascha
    Jul 30, 2015 at 8:01
  • Please EDIT your question to somehow include an improved version of the last phrase in your last comment in it. But make sure to only use the word "view" if you mean "something related to the 'views' module" (if not use something like "page or node or field". From that last phrase I start to think that you are actually not using the correct Drupal terminology, which is why "we" do stil not understand your question. Let me think (while you enhance the question) about how to further enhance "my" answer with something like "maybe you mean this, in that case the solution is like so", ok? Jul 30, 2015 at 8:14
  • 1
    @Pierre.Vriens I'm not talking about your answer, you are doing very well. My comment is about "Natascha" ,
    – WaQaR Ali
    Jul 31, 2015 at 11:38

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.