Solved

Can't control the width of my Menu Bar


Userlevel 2
Badge

Hi, I’m new to Elementor, migrating over from DreamWeaver, so the learning curve is quite high.

I’m trying to create a blog site. So far I have a landing page (home page) and a Posts page that has several posts already on there. My site is www.gailsstory.com.

My main issue is the menu bar on my home page, which, once I get it displaying properly, I will copy this template over to every page. Right now, if you look at it, it is wider than the header, footer, and main text content on the page, and I can’t figure out why. For the header and footer, I have both of these set to “Boxed” on the Content Width area. Well, I also have the Menu Bar set to “Boxed” but it’s not behaving the same way, as you can see. How do I confine the width of the Menu Bar so that it lines up with the  Header and Footer, identically?

Second question: isn’t there a way in Elementor to tell it to “wrap” graphics around text, like there is in WordPress? There seems to be only limited options for alignment of graphics--either all the way across, top or bottom; the “in-line” option shrinks my logo down to nothing. I’d like it to be the same size as it is, just right-justified and wrapped in the final paragraph on the home page. This is easy to do in WordPress. I tried to do it there, but then I lost my Menu Bar.

Thank you for your help. I’ll probably need more as time goes on!

Gail

icon

Best answer by srivatsan 24 July 2021, 15:38

View original

15 replies

Userlevel 1

Maybe this can help you, on the menu bar you need to change the color is in the column not in the section.

Userlevel 2
Badge

 I’m sorry, not sure I understand that.

Userlevel 1

What theme do you use? Themes usually also have content width settings.

Userlevel 2
Badge

I’m using the Hello theme. Hmmm, I wonder if that’s it. Two conflicting width settings. Right now I’m following this guide that says to use Elementor Full Width in order to get rid of the H1 heading on the page (which is Index, the title). Is that causing the problem? If so, how else do I get rid of the Index title but still retain that for the name of the page?

Sorry for such a basic question but as I said, I’m new to this.

Userlevel 2
Badge +1

I see what you mean there- I share your frustration! I had issues with my width today, but it was a text box, not the color on my header. My issue was resolved when I learned about padding and margin settings, but I doubt that will help in this case. Sorry my response is unhelpful, but I empathize with your frustrations. I get stuck all the time, this has been one of the most challenging things I’ve ever attempted. 

Hi,

Try this,

  1. Dashboard>Pages>select page you want to modify>click on edit  (not in Elementor)>Right side there are settings. Go to Content Layout settings and change it to boxed or content boxed.
  2. This wide menu is coming from theme and not Elementor. Control that.

 

 

Userlevel 2
Badge

Srivatsan,

That’s not what I see when I follow the path you suggest. Going to Dashboard > Pages > Index and I select the Index page, click on Edit (not in Elementor) and I look on the right-hand panel, now I see a panel that just shows that all page attributes are controlled by Elementor:

Parent (dropdown menu)

Template (dropdown menu, w/ 4 choices, currently selected is Elementor Full Width)

Order (0)

Featured Image

By the way, the 4 choices under Template are the same that I see within Elementor: Default, Elementor Canvas, Full Width, or Theme. If I choose anything other than Full Width, it gives the proper margins on the menu but pulls the page title of “Index” back into the page, which I don’t want. If you can tell me how to get rid of that, I’ll be happy!

Thank you for hanging in there with me,

Gail

 

Userlevel 2
Badge

Srivatsan,

Can I add, I’m having the same issue on my Posts page? If you go to www.gailsstory.com/posts, you can see that the page title Posts is far-flung off to the left, while everything else is indented to match the left margin of the header and footer. It’s the same issue with that Elementor Full Width. Some items honor it and others don’t, and it’s messing up my pages.

Thank you,

Gail

Userlevel 2
Badge +2

Srivatsan,

Can I add, I’m having the same issue on my Posts page? If you go to www.gailsstory.com/posts, you can see that the page title Posts is far-flung off to the left, while everything else is indented to match the left margin of the header and footer. It’s the same issue with that Elementor Full Width. Some items honor it and others don’t, and it’s messing up my pages.

Thank you,

Gail

Disable the page title via page settings, and add it via Elementor instead. Your theme is set to full width, and the page title element is outside the scope of Elementor’s reach, so it can’t control it. Disabling it, then putting it into the Elementor structure will limit it to the set width

Userlevel 2
Badge

Pete - this would be a perfect solution, if I could find it. I read in another post that it should be in Pages > All Pages and then at the bottom of the page I should find Page Settings and I can turn it off there. However when I do this, there are no such Page Settings there! At the bottom of the table that lists all my pages, there is nothing but a dropdown menu listing Bulk Actions. There is no Page Settings that I can play with. Has this been moved? They just updated the software.

Gail

Userlevel 2
Badge +2

On any given page, there’s a cog in the bottom left hand corner - click on that then check “Hide Title”

 

 

Userlevel 2
Badge

OK, I’m beginning to realize part of what is going on. I tried to make the change you suggested above. It made the change when I View Page, but then when I returned to Elementor, it had reverted back as if I hadn’t done anything (yes I had Updated). I had turned the Title off and also changed Width setting to something else. I see a note that all settings are being controlled by the template. So I think any changes are being overridden by the template. I did this several times with the same result.

So can you tell me how to open the template and make the change there?

Hi Gail,

Sorry for delayed response,

From what you have written,

 

  1. Template (dropdown menu, w/ 4 choices, currently selected is Elementor Full Width) - Change it to Theme template.
  1. Hide Title is the answer for hiding the title.
  2. I think you are controlling each page and post, go with the theme settings, it gives you a base for every page

Hope this helps.

 

Regards

Srivatsan

 

 

Also try different theme and see if it helps.

Userlevel 2
Badge

Yes that did the trick, thank you and all the others who suggested this. Hide Title is the answer for that issue.

I  never did find a solution for controlling the width of my menu, and ended up trashing it and creating a new one with a white background. That way it doesn’t matter how wide it is. But this is an ugly solution;  it should honor the Boxed Width settings just like the other elements do.

Thanks everyone,

Gail

Reply