I have quite a few pages with additional information in the side columns. For the one on the right there is a separate menu so that is clear but the information in the left column is shown beneath the menu of the site.
Is that info in the left column switchable in order to appear above the menu? The menu is not collapsable which is quite annoying with my extensive menu structure.
Try this for moving pallet content:
And this for shortening your mobile menu:
Ah yes… my albums are very well organized. But more or less albums… folding the higher menu options would be definitely better.
The shown algorithms in the first part of your reply will undoubtedly work. But I’m no wizard with that nor am I willing to become one and once deployed there will come a moment that it needs maintenance of some kind and I’ll be staring at it like… eeeehhhhhhh yeah…
So not for me. I can find my way around HTML reasonably well but coding became more like a thing than building my site so that’s where TTG became my go to…
Another option that only requires html is to use the TTG Responsive Grid to create two columns of text in a one-column page layout (leaving your mobile menu all alone in the pallet).
The advantage of using the Responsive Grid is that your column content is always on the page whether on the desktop or on a phone.
On the desktop, the columns are side by side. When on a mobile device, the “responsive” part takes over and the columns are stacked. By default, they are stacked in the same order as written in the code but you can apply classes to change that.
Very nice feature indeed but of no use to me in this particular case. I need the space of the two side columns. Unless there is a way to define the whole page with the width including the space that is now taken by the side columns… so I end up with the same space.
That’s exactly what it does. You would need to create a page template that uses one column at whatever width you designate. The Responsive Grid would take up that entire width.
This means that Pallets 1 and 2 would no longer appear on the page but your mobile menu would still be accessible via the hamburger menu.
The downside is that you’d have to write your pages in html rather than just adding text to main copy and pallet copy.
What I’ve done is create a text file with all the necessary html to create the Responsive Grid and then I add the content html in the divs where its needed. That saves some time and reduces my inevitable syntax errors 
yes I got it working on a test page. Interesting. Possibly have to adapt a lot of pages.
This makes the layout a bit of a thingy… I have in many pages in that left column info about revision date and time and inquiry email. They will be the header then on mobiles…
You mean above the main copy, right?
That’s not necessarily true. You can use the “push” and “pull” classes to change the order of the columns when they stack on mobile devices. See the post I linked to.
Ok that I have still to dive into. In the mean time have a look at this page to see what my layout problem is:
https://www.donaldburghardt.photography/2019/BlogAur2-2025/
or this to see it in effect last march:
https://www.donaldburghardt.photography/2019/BAM25/
Pallet content is always going to be below the menu unless you use some custom coding to either move the content above the menu or the menu below the content.
I didn’t realize how extensive your pages are. The Responsive Grid is an option, but it would probably be a lot more work than its worth.
What you have seems more fitting for a WordPress blog where links to new posts could automatically be added to a menu placed in a sidebar widget.
Yes my website is probably even bigger than meets the eye. Hover over my home button and it reveals 4 main sections. The button itself functions as an original home like the first option.
So let me rephrase the whole matter into this new approach: how to display the site like in a normal browser but on a smartphone. There are sites that have that option. It al becomes very small but it can work. Is that possible with BL5 or 6? My iPhone for instance has 2778 x 1284 pixels at 458 pixels per inch (ppi).
Well, you could try setting the breakpoint to its smallest setting. But the site will probably still collapse to mobile layout on phones.
You could override that with custom css but you’ll need to locate the proper selectors.
And if you could keep the columns on the phone, that may make the site difficult to read.
Ok I have an idea…
My design is to put the blog menu like the update info in the left column. So it drowns… When I use 3 columns my right column just appears in its own hamburger button. I just have to figure out what to do with the info that is right now in the right column.
Yes that seems to work for me, that brings me to another thing… Now I have the menu on the left of my phone and the content of both side columns moved to pallet 02 ending up on the right side of my phone. Can I switch both hamburger menus so i get the main menu on the right and the info on left? Then by moving all in pallet 02 to pallet 01 I got my layout back…
In the page template under Navigation > Vertical Navigation you can choose which pallet the nav menu goes in.
The problem is that if you have a three column set up, that third column will take up space on the page, even if it has no content.
To get around that you can add some custom css in a media query targeted at device widths above a certain width.
Maybe something like this:
@media only screen and (min-width: 1024px) {
.page__pallet[data-position="T2"] {
display: none;
}
}
this should hide the right-hand column on displays 1024px or wider.