1. Hello Guest!

    Thank you for visiting the ClubRunner Community website, you can login using your ClubRunner account information by clicking the login link on the top of every page.
    Dismiss Notice

Replace static header with dynamic photo strip (sort of)

Discussion in 'Website Customization' started by Anita Graham on Nov 28, 2018.

  1. Anita Graham

    By:Anita GrahamNov 28, 2018
    Community Member

    Joined:
    Sep 6, 2017
    Messages:
    42
    Likes Received:
    11
    Location:
    Computer Networking
    Our website (rotarysubiaco.org.au) has a static header consisting of small photos illustrating aspects of the club.

    It looks good, but the photos are becoming out of date, and while I could photoshop another set, I had another idea.

    Part 1. Members can submit photos and a para of text to tell people what we're up to. Image/caption/story must go to (a page, a photo album, a widget?, a story set)

    Part 2. The 5 most recent items become the banner. css can do a lot of formatting and a little animation and any viewer can hover over a photo to see a caption, or click on the photo to go to a story page.

    In the meantime our front page stories focus on our main projects and remain fairly static.

    So, is there a widget or a tool which takes a set of images and produces some simply marked up html?
    My css is waiting.

    I'll have a look again at what I can find.
     
  2. Zach

    By:ZachNov 30, 2018
    Moderator
    ClubRunner Team

    Joined:
    Jun 5, 2017
    Messages:
    311
    Likes Received:
    54
    Gender:
    Male
    Occupation:
    Product Specialist
    Location:
    ClubRunner
    Hi Anita,

    The carousel widget might get close for your needs since you can create a photo album, and the carousel widget will display each photo in that album with its title for any entered.

    Let us know how it goes!
     
  3. Anita Graham

    By:Anita GrahamDec 13, 2018
    Community Member

    Joined:
    Sep 6, 2017
    Messages:
    42
    Likes Received:
    11
    Location:
    Computer Networking
    You were right - the carousel widget does get close for my needs.
    I can stop it changing slides by entering 999 for the slide transition time.

    I still have some work to do on getting the images to all appear at the same time, side by side.

    Questions to explore
    Where does the description get to? I can see the caption, but the description didn't seem to be on the page.
    And can I put a link in the caption or description? We will find out in the next episode...
     
  4. Zach

    By:ZachDec 13, 2018
    Moderator
    ClubRunner Team

    Joined:
    Jun 5, 2017
    Messages:
    311
    Likes Received:
    54
    Gender:
    Male
    Occupation:
    Product Specialist
    Location:
    ClubRunner
    The description does not show up in the carousel, only in the photo's album page itself.
     
  5. Anita Graham

    By:Anita GrahamDec 13, 2018
    Community Member

    Joined:
    Sep 6, 2017
    Messages:
    42
    Likes Received:
    11
    Location:
    Computer Networking
    Now working! Thank you for the carousel suggestion.
    I am going to rewrite the current captions then move the carousel to the top of the page.
    Even without links it is a good place to show recent activity.
     
  6. Anita Graham

    By:Anita GrahamDec 17, 2018
    Community Member

    Joined:
    Sep 6, 2017
    Messages:
    42
    Likes Received:
    11
    Location:
    Computer Networking
    Still working on the concept before I get club members to use it.

    • I will try to restrict the display to the top n photos (I think 5 is a good mix). I added a sixth photo today and everything is a little smaller.

    • Question: Can a photo be moved from one album to another easily? Keeping its title and description with it? I'm not entirely comfortable with chopping old photos out of the gallery entirely.

    • I will see if adding a link to a photo gallery page where all the photos and descriptions can also be seen works
    p.s. Interval and transition times are now set to 0. Thanks to whoever did that - it previously insisted on at least 1sec.
     
  7. John Borst

    By:John BorstDec 17, 2018
    Active Community Member
    Beta Tester

    Joined:
    Jun 25, 2018
    Messages:
    103
    Likes Received:
    30
    Gender:
    Male
    Occupation:
    Retired Education Administration and Teacher
    Location:
    Education - retired
    Anita, very clever programming. Is there any way you can make a video of what you did because I have no clue?
     
  8. Anita Graham

    By:Anita GrahamDec 24, 2018
    Community Member

    Joined:
    Sep 6, 2017
    Messages:
    42
    Likes Received:
    11
    Location:
    Computer Networking
    Thanks John,
    it really is all css, I think. I'm not sure it is in a state to be published yet. I'll have a look over the "holidays".
     
  9. Anita Graham

    By:Anita GrahamDec 24, 2018
    Community Member

    Joined:
    Sep 6, 2017
    Messages:
    42
    Likes Received:
    11
    Location:
    Computer Networking
    Hi Zach, I have one problem with the carousel.

    First of all, I'll acknowledge that I'm not using it in the way it is intended, and that all problems are mine not yours.

    However, the carousel doesn't seem to honour the order the photos are placed in using the drag'n'drop.

    Several hours ago I added a new photo (recording as I went so I can get club members to do it themselves). Without doing anything the new photo goes to the bottom of the list of photos.

    I moved the new photo to the top, and moved another photo to the bottom. However the front page carousel is showing the photos in the old order. I've cleared my cache - perhaps I need to restart my browser. I look at the photoalbum and its slide-show to see if they are in the order I want.
     
Top