Preview on... - Post ID 279218

User 2659348 Photo


Registered User
113 posts

I feel like I'm understanding Grid Builder better, and more able to make things work in it, than RSD. But I still love RSD. And I'm still super new to all of this.

But I've got a site coming along in Grid Builder and I've added a page for every menu link (I've got 4 pages total so far). I got real interested in what I saw in the RSD Bahia Theme where the nav-link for the page you are currently on has a bottom border. Switch pages and the menu link for that page is now the one with a bottom border. A hover state that stays there. This is separate from any other hover state you may have that is only there as long as the mouse is hovered over it. This one stays until you switch pages and then it apply to that page's menu link.

Watching some random videos online (not CC videos) helped me understand what I was really trying to do and then I just attempted a few things in G.B. until I made it work.
At least...... I think I made it work.

When I preview or test the site on Chrome using the "Preview on...." selection in the top tool bar, it only tests the actual page I was working on when I hit preview. The normal hover states (background color change) of the menu buttons function properly when I mouse over them, and the menu button for the page I am on (the one I'm previewing) has a bottom border the whole time like I want.
But when I click another menu button to go to another page to see if the bottom border does what it's supposed to (switch be seen ONLY under the page I'm on), the preview doesn't go to any other pages of my site. I have to separately preview each page - which is normally fine unless I'm testing the functions of my page links like I am now.

Also, I don't know how to show y'all my site so if you ask me to attach something I'll be lost.
Basically, my question is: Can you not switch pages during a preview test when using the apps preview tool?
I know I could go ahead and publish or export to test these page links, but I'm not ready to be forced to do that yet.

Any suggestions?
Knowing is half the battle
User 187934 Photo


Senior Advisor
20,181 posts

Your links won't work in preview mode but should work in browser preview.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2659348 Photo


Registered User
113 posts

Isn't that what "Preview on..." is?
It has an arrow next to it and gives me the selection of 2 browsers. And when I click one of the options it opens a new browser window with my site in it.

And the end of the url is ..../preview/index.html when I'm on my home page in the app.
Or .../preview/gallery.html if I'm on my Gallery page when trying to preview.

But IN that browser window that has the prview of my site, I can click on my menu links and they do what they are supposed to on hover but they don't go anywhere. The page doesn't change in the browser test window.
If I'm on gallery, for instance, and click to go to Contact Us it simply adds that to the end of the url. Like this:
.../preview/gallery.html#contact.html

Like you, I also thought they should work.

Also.... Grid Builder keeps freezing up. I have to End Task it every time. It's happened 4 times in the last 5 hours.
It and one browser window are all that is running each time so I don't think it's my system. (not sure if this is where to give that feedback or not)
Knowing is half the battle
User 187934 Photo


Senior Advisor
20,181 posts

Do you have some scripts added to the page?
The links should work in browser preview. Sounds like you have some kind of issue going on. Maybe open a support topic. Post back when you get an answer.
https://www.coffeecup.com/help/myroom/opentopic/
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 244626 Photo


Registered User
811 posts

Just use the page name on the link like contact.html on each menu item for the page.....not #contact. #contact looks for a id on the page itself but dont quote me on that.....

I assume you have made a symbol for your menu on your index page to be used on all pages so any changes will update on all pages.
Bootstrap 5 CSS Grid.
User 2659348 Photo


Registered User
113 posts

Eric, no scripts added to the page. But I will open a support topic if it keeps crashing.

Twinstream, THANKS! You helped me fix it!
The program had the # already populated where each link went and that was causing the issue. I'm new so it didn't even occur to me that wasn't supposed to be there.

And no, no symbol for my menu. I only had 4 pages so it was quick to go fix them all. But I did look that up and I'm so glad you mentioned it because I will be researching that (symbol) some more! I guess I thought the class was taking care of that and then I realized it isn't. I'm learning SO much and this is all so cool!
Thanks again!
Knowing is half the battle
User 187934 Photo


Senior Advisor
20,181 posts

Did that stop the freezing up?
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2659348 Photo


Registered User
113 posts

Eric, no. His tips made my links work when I preview them in the browser.

But I would like for Twinstream to tell me more about how to make a symbol for my menu on the index page since I'm Googling it and finding nothing. :D
Knowing is half the battle
User 187934 Photo


Senior Advisor
20,181 posts

That's custom to the new CC apps.
Select your element. Then select Symbols on the Content tab. Select New symbol
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 244626 Photo


Registered User
811 posts

What framework are you using in CSS Grid Builder, Bootstrap or Foundation ?

I suggested creating a symbol of the menu on page one (index) because it will then allow you to insert the saved symbol on any of the additional pages you create. However when looking at the theme you are designing with, it appears the designer chose not to use a symbol for the menu because each page menu has its own active_navlink.

My suggestion is to learn how to create a symbol for the menu and then use jquery to change the active state of each link by adding a class. I need to know which framework you are using though for that info.

https://www.coffeecup.com/help/articles … h-symbols/



Bootstrap 5 CSS Grid.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.