Webpage Mobile design improvements

What's different:

  • Post cover picture has multiple display options based on screen size and looks much better on mobile screens
  • Added extra rules for more meaningful UX i.e. "Do not display cover pic above the post title IF mobile size AND there is already some HERO content like Hero Slider as there is too much pictures to scrool to get to main content"
  • Browser Address bar is now colorized with current theme BASE color
  • Replaced multiple "Scroll to top" buttons above page segments with a single "Scroll to top" button (it becomes visible only on long pages after a user scrolls down more than N-px. Positioned bootom & right)
  • Changed the display of "Copy direct Url" button to be more subtle in right-top corner of every segment

 

Before & After

Link to page: https://restavracija-mirje.si/web/galerija/kulinarika/353

 
 

Set Gallery slideshow background color

Video demo

We showcased a webpage for one of our clients and how we used it:

  • Black background (as most common slideshow color)
  • meat dishes got a matching Brown color
  • salads got a Green bg
  • deserts had none
  • Admin demo: quickly pick a color with a color wheel, from an image or manually insert your desired HEX code and refresh page for new look.

See results on:
https://restavracija-mirje.si/web/galerija/kulinarika/353

 

USE CASES:

  • different webpage content segments like New items, Blog, Trips... can have different themes, now also different Gallery backgrounds,
  • diferentiate webshop items
  • differentiate webshop categories like Men - Women - Kids
  • brand color matching,
  • ...

 

For easy Website management

the system will define a BG color for each gallery by checking these settings in order:

  1. Platform Default (white)
  2. If > Your Profile Preferences > Default Gallery BG Color  (set a default color here for your whole website) 
  3. If > Selected gallery > Has a defined BG Color 

 

Video: Set Gallery slideshow background color
 
 

New Website template for posts

We developed one more template for website posts. It uses a documents' cover picture and puts a document title and document category over it. 

See couple of screenshots to see multiple different options (in some cases for for the same post):

  • Default (right sidebar pic)
  • Inner content fullwidth cover picture
  • Hero Picture
  • NEW Title Cover Picture 
 


 
Toast message
Toast-Top message