Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

  • Saied 349 posts 674 karma points
    Aug 26, 2015 @ 23:52

    Changing images based on a user search?

    Does umbraco have the capability handle the following scenario:

    I have a scenario where a user will search for a vehicles make, model and year and whatever they choose, images of those vehicles will show up on the page. I was wondering what the best approach to this would be. I have thought of several ideas:

    1. Store them in a db and when the user searches, get the images from the db.
    2. Store them in a folder structure such as Ford/Mustang/2010 and get them from the folder when the user searches.

    Not sure if there is any other way and if there are advantages/disadvantages to either way?

  • Robert Foster 416 posts 1572 karma points MVP admin c-trib
    Aug 27, 2015 @ 03:33
    Robert Foster

    Hi Saied, Do you mean in the backend with Umbraco Users, or on the website?

    Normally I'd create each vehicle as a Content node and associate the various images with them as standard Media. That way you have the advantage of the standard Umbraco media handling etc. and don't need to worry about creating your own framework for that.

  • Saied 349 posts 674 karma points
    Aug 27, 2015 @ 03:37


    It would be the front end. This could get very large, for example (Ford Mustang 2000 - 2010 or Ford Focus 2010 - 2015) and that is just one vehicle, one model with many years, so that seems like a lot of content nodes?

  • Robert Foster 416 posts 1572 karma points MVP admin c-trib
    Aug 27, 2015 @ 04:23
    Robert Foster

    Perhaps, but Umbraco can handle large content node sets, and searching with Examine is lightning fast on the published content.

    There are a number of ways you could structure this - have DocumentTypes for Manufacture, Make, then a DocumentType for Vehicle (which includes Model perhaps) and associate a list of images for the Vehicle.


    1. How many images per vehicle do you have?
    2. Where is your datasource for this?

    You can upload images in batches to the Media Section and organise them in folders; so you could just associate a Vehicle with a particular Media Folder and then iterate through the images in that folder based on your search.

    You could also write some import functionality to create the content nodes based on database records or a CSV upload for example.

    Just some thoughts about how I would approach this - not sure whether it's helpful or not...


  • Saied 349 posts 674 karma points
    Aug 27, 2015 @ 04:26

    It makes some sense, but I am new to Umbraco, so still learning. One thing I forgot to mention is that this customization is only applied to one page, so I am not sure if that makes a difference?

  • Robert Foster 416 posts 1572 karma points MVP admin c-trib
    Aug 27, 2015 @ 04:35
    Robert Foster

    well, not really - your question is more about the storage of data rather than the presentation (which I would use a custom SurfaceController or UmbracoApiController for in conjunction with Examine (Lucene) search - see references below).

    You really just need to decide on a structure for storing your data - I would recommend though storing the Images in the Media section, how you structure them and the associated meta-data (Vehicle info, Make, Model, etc.) is up to you.

    For presentation on the custom page, you can do custom MVC or Ajax etc. with whatever framework you like - Knockout, AngularJS, straight jQuery, or even just static HTML once you have the search results. The following documentation may help:

  • Robert Foster 416 posts 1572 karma points MVP admin c-trib
    Aug 27, 2015 @ 04:40
    Robert Foster

    One other thing that sometimes gets new users - Content nodes do not necessarily equate to pages. A Content node can be anything - part of a lookup, a data record for a table, whatever you want it to be.

    My site structure quite often has two top level nodes:

    1. Home

      • Site pages
    2. Site Data

      • Lookup values (Venues to be associated with events for example)
      • Email Templates
      • Lists of content that don't have a page in their own right

    Only the Home node and it's children actually have templates and are navigable through the front end; everything under Site Data is purely data for other areas/functionality in the site.

  • Saied 349 posts 674 karma points
    Aug 27, 2015 @ 12:07

    Hi Robert,

    This is actually not for a site search. It is a custom control that will have 3 dropdowns (make, model, year) and when the user enters values and clicks search, it will put images on a page that correspond to those values, so it doesn't have anything to do with a site wide search? Does this make sense?

    Thanks for the help, Saied

  • Robert Foster 416 posts 1572 karma points MVP admin c-trib
    Aug 27, 2015 @ 13:01
    Robert Foster

    Ok, but there's nothing stopping you from using Examine to retrieve the list of Images based on the selected input.

    You can actually upload images directly to a Document Type instead of a Media item if you wanted to; just add an Upload (or Image Cropper) property to the Document Type.

    One other question: I assume the drop downs affect each other's contents - i.e. Make -> Ford would limit the list of the Model drop down etc.

    If that's the case, then a Content Tree structure like this might make sense:

    • Make
      • Model 1
      • Model 2
        • 1999
        • 2000
        • ..
      • Model 3


    And Year might contain a list of the images (or have a Multiple Media picker on it)

    You could actually turn on the ListView property for the DocumentTypes (under Structure) as well which would keep your tree tidy.

Please Sign in or register to post replies

Write your reply to: