Fun While It Lasted!

When I first discovered Blocs I was so excited, to me this looked like the future for my web development efforts, so much potential!

But after more than 2 weeks of just trying to get my Navbar styled the way I wanted it, I have given up. This task literally took me 30 seconds from start to finish in Rapidweaver using Foundry (also Bootstrap 4).

I tried all of the examples people shared with me (thank you), bent the class manager to my will, sub-classed everything I could find, but to no avail, I could not get the behavior I wanted.

So with great sadness I have finally decided to throw in the towel, bummer!

I guess I’ll keep an eye on Blocs, but until it makes fundamental tasks like this simple to perform it really is not for mere mortals like myself.

I have a programming background and I could not win the battle, not sure how the average non-technical user is meant to be successful. Maybe my background was a hinderance.

My high hopes have been dashed, which is a huge disappointment.

I was on the verge of signing up for Eldar’s great looking course, but decided that after spending the money on Blocs itself I could not justify the additional money.

I’ll be watching from the wings and cheering Blocs on hoping that it will fulfill my dreams for it at some point in the not too distant future!

Hi Robin,

I didn’t hear from you the last time I have shared a tutorial with you on how to make navigation you wanted, so I hope this time you will provide more info on what you want to archive. Could you please share a link of a website with the navigation close to what you want? I am just curious about what kind of design you wanted to create.

I hope you weren’t trying to use Blocs the same way as you did use RapidWeaver. These are different apps, which should be handled differently. I saw a lot of people getting frustrated with Blocs because they were trying to use it as they wanted it to use, instead of understanding how they are supposed to use this particular application.

I agree that not everything is perfect in Blocs (I am the biggest critic of Blocs when it comes to feature requests, @norm knows). I also wish there were more options with navigation, but in my experience, Blocs is not more difficult to use than RapidWeaver, and I am trying to remember how I felt when was starting to use both apps a long time ago.

In any case, to really enjoy Blocs, one should adapt to its ways, and I understand that ‘its ways’ might not be for everyone.

I wish you all the best.

Cheers,
Eldar

5 Likes

Hey Robin,

Im sorry to hear that. But Im glad you found an app that works for you.

I think @mackyangeles would contest that notion, if he were still around and participating. :stuck_out_tongue_winking_eye:

2 Likes

@handshaper It didn’t take me much more than 30s in Blocs either but the Blocs NavBar gives you so much control than the simplified Foundry one. Like everything, it is easy when you know how and we all forget the many hours we spent gaining that knowledge. I also use RW+Foundry and I can tell you that the Blocs Nav bar has far more capability and options and is based on the latest release of Bootstrap4 so it is quite a different beast.

Heres a screen shot below that will explain (I hope) the concept. The basic idea is that you define a border of say 3px below each nav item and set the Normal colour to transparent, and choose a hover and an active colour. Create a class which I called underline in my example and attach it for each of the List Items in the tree on the left side. Then make a version for Normal, Active and Hover. It took me longer to write all this than it did to get it working. I am sure there are other ways to do this too.

To add the nav to each page just add it to top Global area. Job done.

1 Like

@norm [quote=“Eldar, post:2, topic:6615”]
I also wish there were more options with navigation,
[/quote]

I second that too. Even though it is possible to do this stuff with the ClassEditor, it does demand a knowledge of nav bar effects to do it. In my experience, nav bars are something that many struggle with and it’s an area that some more basic options would be great to have in Blocs.

Aloha Eldar:

I certainly was not trying to use Blocs the same way as I would have used RW, in fact, I purposely approached it with an open mind. Telling myself this is something new so treat it that way and try to understand the approach it takes and leave all the RW baggage at the door.

I also agree that the Blocs approach is very powerful, but something this simple why should it be so cumbersome. Just expose the data I need to set and be done with it. Why jump through hoops to make it happen.

Here is a link to the site I have been trying to replicate in Blocs, it has the nav style I have been trying unsuccessfully to achieve. NOTE: I have been able to get some of the elements working but not everything.

Navbar Example

I think the thing that was the most annoying was the fact that to achieve one aspect fo the behavior I had to have an instance of the navbar on each page, that just did not seem right to me.

One other thing I could not achieve was the correct “sticky” behavior of the navbar. When it was at the bottom of the main banner the minute the page was scrolled the navbar would jump to the top of the screen. The correct behavior should be that when scrolling the page and the navbar gets tot he top of the screen it stays sticks there. This behavior can be seen on the site.

I should have been more explicit in my original post that when it comes to generating the content for this site I found Blocs to be awesome and it allowed me create great looking content. I think the whole navbar experience just blindsided me because it seemed so unnecessarily cumbersome to a new user! I’m sure to the old hands it is a simple and intuitive approach. It certainly was not intuitive to me.

I’m willing to keep at if I can find a solution to my problems as I certainly want Blocs to work for me as I see more potential for it down the road, especially if some things get cleaned up and streamlined, which I’m sure they will.

I’ll change my position and keep an open mind!

Aloha @webdeersign:

Yes, that is the exact approach I was using and I got it to work for hovering but I could never get it to work for the .active page, such that the page you were on displayed an indicator that it was in fact the current page. I was also trying to color the title and place a background behind it. Which I was able to do through classes, except for the active page part of the process.

I was also disconcerted by the fact that people were recommending disconnecting the navbar from the primary menu in order to make this work, which involved duplicating the navbar on every page and then styling the title, which again I could not get to work.

Usually when something doesn’t work in these type of situations, it is because something is overriding it, so in this case you may be changing the title but then it is being set back to a colour elsewhere.

Why not save your file and allow others here to download it and get it to where you want it to be.

I can certainly do that even though I might be embarrassed by the fact the mess I have made. At this point in time I had scaled it back to just 2 pages in an attempt to get it to work.

Here is the project in it’s current state.

HCC-WEBSITE-2019-r2.bloc.zip (181.3 KB)

The active state doesn’t refer to the active page, it refers to the state of the element ie when it is clicked.

What you actually need is the active page link to have an extra class applied to it but only when the page is active. I’ve never got around to adding this but I’ll take a look.

Then you would just set this class ( let’s call it .active-state) to the styling you want and when the current url matched this link it has this styling.

1 Like

Agree, however the navigation is without a doubt the most complex part of the site. Making it easy to edit and flexible enough for pros is one of my biggest challenges.

Aloha Norm:

That all makes sense, where does one find the active page link?

I was aware that the active state was the pressed state as I did want my styling added there, but I was not aware of the active page link, thanks for that.

I have confidence based on what I have observed to date with Blocs that you will come up with an elegant solution. I think it will make a big difference and certainly make it more approachable.

You would need to manually do it on every page. But the Blocs way to handle this would be to automate it.

We are in beta with 3.2 so if I get a chance between bug fixing and testing I’ll see if I can get this bundled in.

2 Likes

Having the abilty for a active state (active page link) would be a nice feature for the Nav. It can be done by adding a new nav for each page and then stying the link but it’s a lot of work. Not bad if you only have couple of pages but still it seems like we could have this out of the box.

Thanks for looking.
casey

3 Likes

Norm: I think it would be a huge win if this could be automated by Blocs, I know it would certainly make my day!

3 Likes

This was about 30 mins work and seemed essential so I’ve added this in 3.2 build 5, I should get that build out today.

Heres how it works.

• In project settings set the class you would like assigned to active page links (page links that match URL). Bootstrap has a built in one active or you can create your own.

• Create your active state class (if custom) via the Class Manager and give it some styling ( make the text red or something).

Thats it.

When you export Blocs will do the rest and your active navigation page links will work like this:

Screen%20Recording%20(Blocs)

9 Likes

Very Cool @Norm ! :smile:

1 Like

@Norm, that is awesome, what a rock star! I’ll be waiting with bated breath for the BETA 5 build!

1 Like

@Norm, do you still have to decouple from the primary menu or can you stay with it as the data source?

1 Like