A useful 5 breakpoint template
A useful 5 breakpoint template
I've created a template with 5 breakpoints, a master page, a page for cloning and some default pages etc. I use this when I'm creating sites.
Feel free to grab it here https://www.dropbox.com/s/f8rm5f6bsfniq ... e.zip?dl=1 and let me know how you get on. Inside the zip file is another zip file which contains the same thing but built with version 14-4.
There is a page of documentation on the structure of it in the zip file.
Have fun
Alan
Feel free to grab it here https://www.dropbox.com/s/f8rm5f6bsfniq ... e.zip?dl=1 and let me know how you get on. Inside the zip file is another zip file which contains the same thing but built with version 14-4.
There is a page of documentation on the structure of it in the zip file.
Have fun
Alan
Last edited by alan_sh on Thu Apr 02, 2020 8:04 am, edited 1 time in total.
Re: A useful 5 breakpoint template
Documentation says this:
This template can be used as a starting point for any new project. It is very simple but produces quite nice-looking web sites.
This has been built using WYSIWYG version 15.4. It should also work with 15.3 but is unlikely to work with any earlier version. There is a version for 14-4 inside the zip file.
Some notes on the structure:
1. There are 5 breakpoints:
a. 1280 (Default)
b. 1024
c. 768
d. 512
e. 320
2. All the pages have their breakpoints all set up so they look good and work.
3. There is a master header page (named Master). This contains the following:
a. A CSS menu (named ‘mainmenu1’ which has links to the other pages. This is used in the top 3 breakpoints.
b. A Panel menu which is used in the bottom two breakpoints.
c. Some centred text which you can use as a main header for all pages.
d. A Themeable Button (labelled PrivacyButton) which points to the privacy page (GDPR regulations means we need one somewhere).
e. A site search button and text – which will point to the search-results page.
f. The background colour is set to a light green for the header, footer and main page. This can be changed to whatever you wish and will override any backgrounds on individual pages.
4. There is a master footer which has 3 items:
a. Some text on the left – not in the 320 BP
b. Some text in the centre – not in the 320 BP
c. A themeable button on the right which points to the contact page.
5. There is a page called “forcloning”. When you want to create a new page, right click the name (in site manager) and select ‘clone page’. The will create a new page. Rename it and then go into its page properties to set the title and menu name and untick the boxes below.
6. There are 6 generic pages which you can use as a starter. All are very similar. They all have the Master page as their starting point (header, footer and background colour).
7. All pages will be centred in whatever browser you use for whatever breakpoint is chosen. It will not expand to the full screen width.
Any questions, just ask
This template can be used as a starting point for any new project. It is very simple but produces quite nice-looking web sites.
This has been built using WYSIWYG version 15.4. It should also work with 15.3 but is unlikely to work with any earlier version. There is a version for 14-4 inside the zip file.
Some notes on the structure:
1. There are 5 breakpoints:
a. 1280 (Default)
b. 1024
c. 768
d. 512
e. 320
2. All the pages have their breakpoints all set up so they look good and work.
3. There is a master header page (named Master). This contains the following:
a. A CSS menu (named ‘mainmenu1’ which has links to the other pages. This is used in the top 3 breakpoints.
b. A Panel menu which is used in the bottom two breakpoints.
c. Some centred text which you can use as a main header for all pages.
d. A Themeable Button (labelled PrivacyButton) which points to the privacy page (GDPR regulations means we need one somewhere).
e. A site search button and text – which will point to the search-results page.
f. The background colour is set to a light green for the header, footer and main page. This can be changed to whatever you wish and will override any backgrounds on individual pages.
4. There is a master footer which has 3 items:
a. Some text on the left – not in the 320 BP
b. Some text in the centre – not in the 320 BP
c. A themeable button on the right which points to the contact page.
5. There is a page called “forcloning”. When you want to create a new page, right click the name (in site manager) and select ‘clone page’. The will create a new page. Rename it and then go into its page properties to set the title and menu name and untick the boxes below.
6. There are 6 generic pages which you can use as a starter. All are very similar. They all have the Master page as their starting point (header, footer and background colour).
7. All pages will be centred in whatever browser you use for whatever breakpoint is chosen. It will not expand to the full screen width.
Any questions, just ask
Last edited by alan_sh on Thu Apr 02, 2020 8:05 am, edited 1 time in total.
Re: A useful 5 breakpoint template
I haven't used any layout or grid stuff because I wanted complete control on where everything goes - in all breakpoints. It's a little bit more work (but I hope the template has taken much of that away from you), but you know exactly where things are going.
In my projects, I use a multi-level panel menu (an extension) but as I am giving this away and I don't know what extensions you have, I've changed it for the built in panel menu.
Alan
In my projects, I use a multi-level panel menu (an extension) but as I am giving this away and I don't know what extensions you have, I've changed it for the built in panel menu.
Alan
Re: A useful 5 breakpoint template
Hi - as you rightly say it will not open in previous version (14 in my case). Is there something in here which uses features only availble in v15 or is it simply a case that it was created in v15 so is looking for that version ?
Thanks
Thanks
Re: A useful 5 breakpoint template
It was created in 15.4 and the structure of 15.4 can't be read by anything earlier. Sorry, but that's how Pablo designed it.
I don't have any earlier versions around at the moment. When I get home later this month, I will see if I can find a V14 and recreate it.
Thanks for looking.
Alan
I don't have any earlier versions around at the moment. When I get home later this month, I will see if I can find a V14 and recreate it.
Thanks for looking.
Alan
Re: A useful 5 breakpoint template
Many thanks Alan.
It is frustrating that things like this would more than likely work but are restricted by the product to require the latest version.
After starting with v6 and buying every upgrade through to v14 to support the product (even though my needs are quite basic and have not used most of the newer features) - it does leave you feeling discarded and let down a bit.
Sorry, not your problem I know and thanks again.
It is frustrating that things like this would more than likely work but are restricted by the product to require the latest version.
After starting with v6 and buying every upgrade through to v14 to support the product (even though my needs are quite basic and have not used most of the newer features) - it does leave you feeling discarded and let down a bit.
Sorry, not your problem I know and thanks again.
Re: A useful 5 breakpoint template
Leave it with me. I'll see what I can do while I am being isolated.
Cheers
Alan
Cheers
Alan
Re: A useful 5 breakpoint template
OK - if you download the zip file from the top post again, it now has another zip file inside it which contains the same thing, but built with version 14.4.
Let me know how you get on.
Alan
Let me know how you get on.
Alan
Re: A useful 5 breakpoint template
That's brilliant - thank Alan
Re: A useful 5 breakpoint template
I've realised that the master page for the default view has a hidden panel menu that means the page header is deeper than it needs to be. I'll update the zip file, but if you already have this, just go to the master page, default view, unhide the panel menu, move it up to the top and hide it again.
cheers
Alan
cheers
Alan
Re: A useful 5 breakpoint template
I don't know anything about building responsive websites. But I want to compliment your commitment to make things easy, and I hope you can perhaps work with Pablo to make the process easier. Can it be easier than what you have proposed with your template here? Do you think the application could benefit from certain changes?
// Love is the acceptance of nothing / Account age is no guarantee of efficiency ;-) ->
Above, Beyond, and @wwonderfull! <- Genuinely helps you with a powered up site that counts! Four Times Excellence!
Above, Beyond, and @wwonderfull! <- Genuinely helps you with a powered up site that counts! Four Times Excellence!
Re: A useful 5 breakpoint template
Jerry,
WWB is a complex program and I think the use of templates is one way to 'make it easy' for new starters. I came from Web Plus 8 and had a steep learning curve, which is why I produced the template I did - it was for me originally, but as I saw others having the same issues I had, I thought it would be useful to let others use it.
Can it be easier? I doubt it - that's what templates are for. I don't see a 'magic button' which you can press to produce a web site. If you did have one, you'd be missing out on such a lot.
Of course there are other tools which will do what you want, but then you quickly come to their limitations. I've looked at a few and WWB is, to me, the best around.
Alan
WWB is a complex program and I think the use of templates is one way to 'make it easy' for new starters. I came from Web Plus 8 and had a steep learning curve, which is why I produced the template I did - it was for me originally, but as I saw others having the same issues I had, I thought it would be useful to let others use it.
Can it be easier? I doubt it - that's what templates are for. I don't see a 'magic button' which you can press to produce a web site. If you did have one, you'd be missing out on such a lot.
Of course there are other tools which will do what you want, but then you quickly come to their limitations. I've looked at a few and WWB is, to me, the best around.
Alan
Re: A useful 5 breakpoint template
Okay, great feedback. So curious what Pablo has in store for next versions!
// Love is the acceptance of nothing / Account age is no guarantee of efficiency ;-) ->
Above, Beyond, and @wwonderfull! <- Genuinely helps you with a powered up site that counts! Four Times Excellence!
Above, Beyond, and @wwonderfull! <- Genuinely helps you with a powered up site that counts! Four Times Excellence!
Re: A useful 5 breakpoint template
Thanks Alan, you did a great job!