[Pro] Backdraft

Hi,

I’m about to undertake quite a large project. I’ve had my retail website up and running using Freeway for several years. Up until now I have been adding and editing using Freeway 5.5.
I’m about to take the plunge into the world of responsive web pages.
I’ve been experimenting / playing with Freeway 7 for the last couple of weeks. Even though I’m a reasonably experienced Freeway user and my present web site uses the in-flow model construction method, I’m still finding it quite a learning curve.

I’ve found the Backdraft system, which seems to be fantastic. But before I spend the next few weeks re-working 140 pages into a new responsive web site using the Backdraft system, does anyone know of any constraints or problems I should be aware of with this method? (hopefully not, as I really like it !)

Also, is it possible to have a column menu down the left hand side of the page using this system? I can’t see a default module for it. At present I have quite a big menu that I like on display on the left. I think it suits my customers needs so I’d like to be able to keep this if possible.

Lastly, I tried using the ‘Fixed header wrapper’ and started entering some of the more common page links into the CSS menu. I have 6 main headers with 55 subs off these. As soon as I enter the 9th page name in the list the wrapper seems to jump down the page and the header and logo show below the content wrapper. Removing a few of the link pages from the list seems to allow it to jump back up? Any ideas?

Any advice and help would be appreciated.

Many thanks,
Neil


freewaytalk mailing list
email@hidden
Update your subscriptions at:

Lastly, I tried using the ‘Fixed header wrapper’ and started entering some of the more common page links into the CSS menu. I have 6 main headers with 55 subs off these. As soon as I enter the 9th page name in the list the wrapper seems to jump down the page and the header and logo show below the content wrapper. Removing a few of the link pages from the list seems to allow it to jump back up? Any ideas?

I think I have sorted the problem with the CSS menu. I made the height of the wrapper very high, added all the menu options, then reduced the height back to normal. Seemed to do the trick.√


freewaytalk mailing list
email@hidden
Update your subscriptions at:

I am to order for any help I’ve used a lot and is excellent and the best of it is the support of its developer


freewaytalk mailing list
email@hidden
Update your subscriptions at:

Hello,

A few of observations for you:-

Based on what you have indicated you may want to review the comments in the following thread, where Caleb pointed out a slight issue with the Fixed Header, which maybe impacting what you are trying to do:-

I have worked with Backdraft responsive template for a while and i found Caleb to extremely “Responsive” when i comes to support, of course you may consider making a suitable donation to him for that now that Backdraft comes free of charge, but you always get first class support.

Also there are the people on this Forum who are always willing to help , but my advice would be that you provide a link to your development web sites so that the responses to any issues you raise can be more specific to your real issues, otherwise contributors are never really sure what your problem may be.

Good luck with the Project.

John


freewaytalk mailing list
email@hidden
Update your subscriptions at:

Thanks for the responses.

Here is a (very rough) sample of the required layout. Please view on a larger screen only, I haven’t set it up for any responsiveness, its purpose it purely to show the desired layout for the online shop.
http://mcdonaldwebsolutions.com/test

I need the category menu down the left, it’s quick easy links are great for my customers.
I would like to be able to utilise this layout using backdraft.

So,
row 1 = a header,
row 2 = on left a menu column, to the right of which are some product info boxes (2 column module)
row 3 = a 2 column module
row 4 = a 2 column module
row 5 = footer containing 3 or 4 column module.

The bit I’m stuck on, is how to create row 2 when using the Backdraft system. The column on the left containing the category menu would need to collapse when hitting the tablet breakpoint to the responsive hamburger menu.

Many thanks for any help / pointers.

Neil


freewaytalk mailing list
email@hidden
Update your subscriptions at:

Neil,

I like the shades of blue and gray that you are using!

One of the cool things you can do with Backdraft is put a module inside of a module. So, for row #2, I would start with a two column module. Resize the left column to make it narrower and put an inflow CSS Menu in it. Then, paste another two column module into the right column for the product info.

Keep in mind that you may need to tweak breakpoints for the inner two column module. It will work as-is, but the columns may get very narrow before they stack vertically. You’ll have to see how it works for your use-case.

Alternately, you could just use a three column module. It’s simpler and creates cleaner code, but isn’t quite as flexible. For example, if you decided on one page to just have one column for the product info, you can easily delete that inner two column module and achieve that layout, but you can’t just delete one of the columns of the three column module, if that makes sense!


freewaytalk mailing list
email@hidden
Update your subscriptions at:

Hi Caleb,

Thanks for the advice, much appreciated.

Before throwing myself into the big web site I need to update, I thought I’d create something new for a friend.

This is my first proper attempt at creating a responsive site. Used Backdraft for the modules, they really make things so much easier.

http://jahnational.co.uk

Let me know if you can see any obvious improvements I should action.

Again, many thanks,

Neil


freewaytalk mailing list
email@hidden
Update your subscriptions at:

Neil,

It looks nice!

I noticed one thing that slipped through the cracks; the Google Maps embed isn’t responsive. If you are using the action, it’s super-easy to fix. Simply make the width of the map item 100% (or whichever other %-based value that floats your boat).

If you are going to build a big website with Backdraft, definitely learn how to use master pages: Master pages - Backdraft Docs


freewaytalk mailing list
email@hidden
Update your subscriptions at: