WebsiteBaker Community Forum

WebsiteBaker Support (2.8.x) => Templates, Menus & Design => Topic started by: seanie_morris on December 11, 2015, 01:09:34 PM

Title: bs_naturak responsiveness: header (banner) images do not show
Post by: seanie_morris on December 11, 2015, 01:09:34 PM
Hi all,

I have my own website at www.greenbeaniebook s.ie using the bs_naturak template:

http://WebsiteBaker.at/wb-templates/template-bs_naturak.html

and the problem I am having is that, when the view is on a phone, or even the browser shrunk down to phone screen size (to simulate the @media(max-width:640px)), the banner (header) images are lost but the descriptive lines of text remain and change as expected every 3 seconds.

I don't know where to start to paste example code, this template has many files to make it work!

I created a test directory at www.greenbeaniebook s.ie/testing/wb to try and recreate the problem, but I changed so much to make it work (jQuery problems were a first) that I have to swap lots of code to get the desired effect that you would see on the full version of my own site (and similar the bs_naturak link above).

Seanie.
Title: Re: bs_naturak responsiveness: header (banner) images do not show
Post by: dbs on December 11, 2015, 02:54:42 PM
Hi, are pictures like this in your template?:
http://www.greenbeaniebooks.ie/templates/bs_naturak/img/slide5-small.jpg

This will used at small screens instead the big pictures (without the "-small").
Title: Re: bs_naturak responsiveness: header (banner) images do not show
Post by: seanie_morris on December 11, 2015, 04:40:40 PM
Hi, are pictures like this in your template?:
http://www.greenbeaniebooks.ie/templates/bs_naturak/img/slide5-small.jpg

This will used at small screens instead the big pictures (without the "-small").

Hi,
There are a series of images used in the slideshow at the top: www.greenbeaniebook s.ie/templates/bs_naturak/img/slide5.jpg > slides 1 to 6 in total. There are no smaller ones, and the original extracted contents of bs_naturak do not use smaller versions either (I can't find reference to making the large ones smaller either).

Seanie.
Title: Re: bs_naturak responsiveness: header (banner) images do not show
Post by: dbs on December 11, 2015, 05:09:12 PM
You should provide smaller images for the mobile devices.
Make a test and create this one image slide1-small.jpg (or 1 to 6) and place it in the same folder.
Should be displayed only on small screens.

Not tested, but the sourcecode shows the path to the missing images like slide5-small.jpg.
Title: Re: bs_naturak responsiveness: header (banner) images do not show
Post by: seanie_morris on December 11, 2015, 06:51:06 PM
You should provide smaller images for the mobile devices.
Make a test and create this one image slide1-small.jpg (or 1 to 6) and place it in the same folder.

Done, and that worked. (Y) Happy days! Thanks for that, I don't know why I didn't think about that, I didn't even realise the 'broken link' to e.g. www.greenbeaniebook s.ie/templates/bs_naturak/img/slide5-small.jpg

I can feel my headache leaving me now...  :-)


Seanie.