A useful 5 breakpoint template

In this section you can share templates you've created with other users of WYSIWYG Web Builder.
Post Reply
alan_sh
 
 
Posts: 688
Joined: Tue Jan 01, 2019 5:50 pm

A useful 5 breakpoint template

Post by alan_sh » Tue Mar 31, 2020 12:33 am

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
Last edited by alan_sh on Thu Apr 02, 2020 8:04 am, edited 1 time in total.

alan_sh
 
 
Posts: 688
Joined: Tue Jan 01, 2019 5:50 pm

Re: A useful 5 breakpoint template

Post by alan_sh » Tue Mar 31, 2020 2:40 am

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
Last edited by alan_sh on Thu Apr 02, 2020 8:05 am, edited 1 time in total.

alan_sh
 
 
Posts: 688
Joined: Tue Jan 01, 2019 5:50 pm

Re: A useful 5 breakpoint template

Post by alan_sh » Tue Mar 31, 2020 2:42 am

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

brynj
 
 
Posts: 91
Joined: Fri May 31, 2013 3:56 pm

Re: A useful 5 breakpoint template

Post by brynj » Tue Mar 31, 2020 12:17 pm

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

alan_sh
 
 
Posts: 688
Joined: Tue Jan 01, 2019 5:50 pm

Re: A useful 5 breakpoint template

Post by alan_sh » Wed Apr 01, 2020 12:38 am

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

brynj
 
 
Posts: 91
Joined: Fri May 31, 2013 3:56 pm

Re: A useful 5 breakpoint template

Post by brynj » Wed Apr 01, 2020 8:30 am

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.

alan_sh
 
 
Posts: 688
Joined: Tue Jan 01, 2019 5:50 pm

Re: A useful 5 breakpoint template

Post by alan_sh » Thu Apr 02, 2020 1:34 am

Leave it with me. I'll see what I can do while I am being isolated.

Cheers

Alan

alan_sh
 
 
Posts: 688
Joined: Tue Jan 01, 2019 5:50 pm

Re: A useful 5 breakpoint template

Post by alan_sh » Thu Apr 02, 2020 8:04 am

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

brynj
 
 
Posts: 91
Joined: Fri May 31, 2013 3:56 pm

Re: A useful 5 breakpoint template

Post by brynj » Fri Apr 03, 2020 7:27 am

That's brilliant - thank Alan

alan_sh
 
 
Posts: 688
Joined: Tue Jan 01, 2019 5:50 pm

Re: A useful 5 breakpoint template

Post by alan_sh » Mon Apr 27, 2020 10:12 pm

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

User avatar
jerryco
 
 
Posts: 291
Joined: Fri Mar 27, 2009 2:42 pm
Location: Purmerend, Holland

Re: A useful 5 breakpoint template

Post by jerryco » Tue Apr 28, 2020 7:32 pm

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 / So, you're here. Now dance.

/ You want RWD? Rotate your damn phone! //

alan_sh
 
 
Posts: 688
Joined: Tue Jan 01, 2019 5:50 pm

Re: A useful 5 breakpoint template

Post by alan_sh » Tue Apr 28, 2020 8:25 pm

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

User avatar
jerryco
 
 
Posts: 291
Joined: Fri Mar 27, 2009 2:42 pm
Location: Purmerend, Holland

Re: A useful 5 breakpoint template

Post by jerryco » Tue Apr 28, 2020 8:32 pm

Okay, great feedback. So curious what Pablo has in store for next versions!
// Love is the acceptance of nothing / So, you're here. Now dance.

/ You want RWD? Rotate your damn phone! //

User avatar
webwoody
 
 
Posts: 16
Joined: Fri Mar 23, 2007 9:22 pm

Re: A useful 5 breakpoint template

Post by webwoody » Thu Apr 30, 2020 12:00 pm

Thanks Alan, you did a great job!

alan_sh
 
 
Posts: 688
Joined: Tue Jan 01, 2019 5:50 pm

Re: A useful 5 breakpoint template

Post by alan_sh » Thu Apr 30, 2020 12:37 pm

webwoody wrote:
Thu Apr 30, 2020 12:00 pm
Thanks Alan, you did a great job!
Thank you - I've learned a lot from this forum and thought it was time to give something back.

Alan

Post Reply