Header - please help

Bootstrap Studio Help
1

Hello, I'm completely new in web development and trying to make a website with Bootstrap Studio. At first, I want to place website link (www.somethinginrussian) below telephone numbers with right alignment - like this I can't figure out what code should I use for it?

And secondly, telephone numbers and URL are collapsed in an icon from 768px on, but 768 is wide enough to have contact info visible I guess. How can I make layout like in this image? The idea is to keep visible phones and link to 440px, and from 439 px make it collapsed to an icon.

Thank you!

2

I would highly suggest you do some online tutorials and/or classes in HTML and CSS before you even attempt this. The reason you can't do what you want to do is because you have everything in a menu. Since I can't read whatever language it is you're using, it's hard to tell whether it should be a menu or if it's the name of the site or what it is.

If you don't know what code to change for things, then you really need to learn some because this app will require you to know at least basic HTML and CSS. It's not a drag and drop make a website app, it's a semi drag and drop, then edit the settings how you want them app. You need knowledge of web design code for that.

Other than that, there's no way for those of us that don't speak your language to know what it is you're attempting to do in that corner.

Collapsing is always at the very least at 767px, you wouldn't want to edit that, because that is phone size. What you need to edit for that part is the text size to make the text just a little bit smaller so it fits, or edit the margins/paddings of either the container/column that the text is in, or the margins/paddings of the text itself, etc.

3

First of all, thank you for your answer, Jo.

Then I hope my level is quite enough to build this website, isn't it?

And I hope my website can not be nominated to The World Worst Website Award. So I'm so sorry I look for you like an idiot who tries to do thing he can never achieve without classes. The best classes is practice, as for me. And I bought this software for practice and learn. In my classes I've found a solution for many problems by myself, and now remains only 1 (or 1 and a half to be precise) to address to the community.

Then I have to say sorry if my English is so bad and my figures are so hard to understand. There is no need to know language I'm using for, because as I said above, there are telephone numbers and url. And I want to move url down, below the telephone numbers and then align it by the right side of telephone numbers row. Telephone numbers composed from numbers (quite surprisingly!) that are universal enough on the planet and URL begins with "www" that is universal for URLs all over the world too. There is no need to know language I use I hope.

In the language of code it looks like this at the moment:

<nav class="navbar navbar-default navbar-fixed-bottom">
    <div class="container">
        <div class="navbar-header">
            <a href="#"> <img src="assets/img/logonewwhite-3.svg" width="150" /></a>
            <button class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navcol-1"></button>
        </div>
        <div class="collapse navbar-collapse" id="navcol-1">
            <p> <i class="fa fa-phone-square"></i> +7 XXX XXX XXXX (Вера)</p>
            <p><strong> </strong><i class="fa fa-phone-square"></i><strong> </strong>+7 XXX XXX XXXX (Роман)</p>
            <p><a href="http://www.деласемейные.рф">www.деласемейные.рф </a></p>
        </div>
    </div>
</nav>

there’s no way for those of us that don’t speak your language to know what it is you’re attempting to do in that corner.

I want to hope that problem description is quite simple, obvious and clear without need to know language I use. May be I must to wait if someone from the community may help.

Anyway thank you again for your answer, and your last paragraph was so helpful for me.

4

the reason your contact details are hidden in mobile view is because you have include the files in the bavrbar collapse which is normally meant for navigation links etc.

So my question is, do you need to navigate users anywhere or is this simply a landing page?

PS - jo wasn't being mean she was simply stating a fact that in order to use this app to its full potential you need to know a bit more about how bootstrap is scaffolded etc.

5

Thank you, Chris, yes, it's simply a landing page with logo and contact data (text and link to the main website) in the header.

6

Ok cool, so for this to work the way you want you cant use the navbar component as the collapse menu is built into it.

You will need to create your own header section.

7

It's ok, I think I get it, will replace navbar with custom header. Thank you for your help!

P.S. And thanks for suggesting to use Formspree in another topic.

8

Hiya user563,

I don't think you are an idiot. My post was directed by exactly what you said, and your first sentence said you were new to web design. This usually means you have no skills in web design and are planning to try to use this app to build a website. This is why I said what I said and that knowledge is needed in Coding to accomplish what you are trying to do. If you already have the skills, then by all means keep going and trial and error like we do, that's how I learn the best too in many cases.

I am sorry if I came across sounding harsh, but too often we see people come in that have absolutely no clue at all and expect the rest of us to tell them how to build their website, for free. Since web design is what I do, I tend to tell people to learn things since this is a forum for the app not for getting people to do the work for you.<br /> I don't believe you are that type of person at all, just didn't know you had any skills in coding by what you said. I am sorry if I came across as saying you were stupid or an idiot though, that wasn't my intention at all, I do not think that.

As for the rest, the navigation part is what I was talking about as to whether it was supposed to be a menu or just links. Without knowing what the words said, I couldn't determine that, so yeah, language is a barrier many times on things like this.

Good luck with the site and learning the new app, it really is a great app once you get the hang of it.

9

User563, If you are still having issues or questions Please let me know.