How to create an navigation menu...

User 131545 Photo


Registered User
687 posts

Dear support,

I started with given code by example and I build this in the visual way with the site designer. What are the roadmap how I can do that. Witch containers do I use (kind of containers such the link container, list container).
Can somebody help my how I can this visual into Site Designer.

here is the code from start:


<!-- Navbar -->
<nav class="navbar-expand-md navbar-dark bg-dark navbar fixed-top">
<div class="container">
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbar3SupportedContent" aria-controls="navbar3SupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button>
<div class="collapse navbar-collapse text-center justify-content-center" id="navbar3SupportedContent">
<ul class="navbar-nav">
<li class="nav-item mx-3">
<a class="nav-link text-light" href="#"><b>PINGENDO</b></a>
</li>
<li class="nav-item mx-2">
<a class="nav-link" href="#menu"><b>MENU</b></a>
</li>
<li class="nav-item mx-2">
<a class="nav-link" href="#venue"><b>VENUE</b></a>
</li>
</ul>
<a class="btn navbar-btn btn-secondary mx-2" href="#book"><b>BOOK</b></a>
</div>
</div>
</nav>


Toekomstgerichte door ICT gebeten IT'er
Stephane Fonteyne
Ba. Elektronica - ICT
Application Software PowerBasic Developer
e-mail : stephane.fonteyne@telenet.be
gmail : stephane760126@gmail.com
linkin : in : <http://www.linkedin.com/pub/stephane-fonteyn/53/402/204>
twitter : @Stefke36
User 122279 Photo


Senior Advisor
14,454 posts

That looks like part of the code for a standard Bootstrap navbar. Building it in SD is not complicated. Use a normal container where you see a div in the code. Only, the div for the ul (class navbar-nav) should be a list-container.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 187934 Photo


Senior Advisor
20,190 posts

Make sure you check out the components in your library. I think there are 12 examples in there.;)
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 2954033 Photo


Registered User
3 posts

How do you get the menu and footer to be on all my pages?
User 187934 Photo


Senior Advisor
20,190 posts

Hi David,
Use the symbols feature.
https://www.coffeecup.com/help/articles … h-symbols/
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 2905946 Photo


Registered User
17 posts

Is there a way that you can convert some of the components and layouts you see here on the bootstrap examples page into Site Designer components?

https://getbootstrap.com/docs/4.1/examples/#content

I'm particularly interested in using this carousel layout. https://getbootstrap.com/docs/4.1/examples/carousel/

I know I could save the code, and then rebuild it in Site Designer, but I thought there might be an easier way that I'm missing.
User 2699991 Photo


Registered User
4,805 posts
Online Now

Judi Phelps wrote:
Is there a way that you can convert some of the components and layouts you see here on the bootstrap examples page into Site Designer components?

https://getbootstrap.com/docs/4.1/examples/#content

I'm particularly interested in using this carousel layout. https://getbootstrap.com/docs/4.1/examples/carousel/

I know I could save the code, and then rebuild it in Site Designer, but I thought there might be an easier way that I'm missing.

I believe there is a bootstrap carousel similar to the example already in your components library, as to the other examples I wouldn't know as I don't use bootstrap, but it would be possible to make something similar I would imagine, as I would be able to do that in "foundation" by making the componet from scratch
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 2905946 Photo


Registered User
17 posts

Thanks, Yes I saw that Carousel and was going to use it as a component. I just saw this layout, among others and wondered if there were a way to make it work.

I'll give it a try from scratch. it shouldn't be difficult.
User 122279 Photo


Senior Advisor
14,454 posts

I made this carousel just recently. If you find it useful, feel free to use it.
Attachments:
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com



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.