Logo in nav bar on home page

Hi I have a few questions about my home page.

  1. First, my nav bar when I move it, doesn’t resize but the logo resizes too small and then the font doesn’t resize with it. How can I get the logo to stay the same size? I am using the logo left nav bar.
    Do I have to create a collapsed menu to stop the words from crashing into each other?

  2. How do I get a white line to appear in the dropdown menu to separate Experts, Entrepreneurs, and Trends?

  3. How do I get rid of the “Nothing to Show” message on the Home page? I got rid of the container and made it Blank Container - Header/Footer but this is still showing up.

  4. How do I change the option on a different page from full width to content/sidebar?

  5. How can I see a compilation of all the questions I have asked so that I can refer back to them?

My website is http://bitblockrevolution.com.

Thank you.

Hey @designerwriter,

Thanks for writing in. However, we could not check your site because the given credentials are incorrect (see Secure Note).

Hey @designerwriter,

####1. How can I get the logo to stay the same size? Do I have to create a collapsed menu to stop the words from crashing into each other?

There are two areas which you can alter to increase the size of your image. First is your container margin. Currently, all of the margins are set to 50px. Try reducing it preferably to 0.

The next one is hide the Navigation Inline in small screen widths and show a Navigation Collapsed element in its place. This will provide more space the your logo to expand.

####2. How do I get a white line to appear in the dropdown menu to separate Experts, Entrepreneurs, and Trends?

Under the Sub Links partial of the Navigation Inline element, enable and setup a bottom border.

####3. Your homepage currently displays your latest post which you currently don’t have yet. Please see Creating a Static Front Page to fix this.

####4. How do I change the option on a different page from full width to content/sidebar?

Under Page Attributes, choose Layout - Content Left, Sidebar Right page template.

####5. In this forum, go to Account > Profile > Activity

Please note that though I’ve answered all your questions here, this is not always the case. Posting multiple questions with different mix of topics is not recommended because it often leads to confusion down the road. With that said, we kindly ask you post separate threads for different topics next time.

Hope that helps and thank you for understanding.

Thank you so much. I changed the credentials. I see you got in. I will do what you recommended next time about posting. I am getting the gist of X Pro and it’s difficult to go back to any other theme when this one has so much flexibility for designing which is what I want. :slight_smile:

I am using pages…does this matter if it is a page or a post? In other words, it just needs content whether it’s a page or a post correct?

Grace

Hi again,

When you have not created any post "Nothing to Show” message will appear when your homepage is set to display the latest posts (see screenshot) as there are no posts to display, to make sure it doesn’t appear create a new page and set it as your Home Page please see https://codex.wordpress.org/Creating_a_Static_Front_Page Add some content in that page too.

Hope this helps!

Thanks. Does it matter if it’s a ‘Custom’ Home page? There was already a Home page that said ‘Custom Link’ in the menu section or should I create a separate one?

Hey there,

It’s better to create a new separate page and make it your Homepage so you can add content in there.

Hope this helps!

Ok re the Home page.

But…
I am not seeing the icon box below the page attributes box that says

Blank Template Sidebar
“Because of Icon’s unique layout, there may be times where you wish to show a sidebar on your blank templates. If that is the case, select “Yes” to activate your sidebar.” (Button for No or Yes)…I am not seeing this. if I go to select the Layout option for Layout - Content Left, Sidebar Right, then the container appears again with the title of the page. I don’t want this. I want to put my own title in and have no container.

Not seeing this icon box…

If all of the above requirements are met, the Icon meta options can be found beneath the page editor in WordPress and will be labeled Icon Page Settings. Below is an image of what this meta box looks like in the WordPress admin area:
Page Meta Options – Icon

Hi,

That is no longer available in the recent version of the theme.

To remove the tile, you can disable it under Page Settings.

Then to remove the container, you can add this in Cornerstone > CSS

.entry-wrap {
        box-shadow: none;
}

.x-site {
    background-color:#fff;
}

Hope that helps.

I got everything sorted out except the 1) logo reducing too small and the bar staying the same (not resizing with it) and that was after I changed the 50 to 0 as per your request and 2) the layout for the content/sidebar issue.

Hi again,

  1. I see you’re using desktop navigation even in smaller screens which is taking up much space, it’s shrinking the logo when viewed in small screens. Please use Navigation Collapsed element for small screens, this should make things better.

  2. The layout you’re referring is specific to Icon stack and I see you’re using Integrity stack and you can choose any template under Page Attributes > Template. In order to use a sidebar template, make sure your content layout is set to content left, sidebar right or sidebar left, content right under Pro > Theme Options > Layout and Design

Hope this helps!

  1. I added the collapsed menu element to the menu but why is the circle with the 3 lines icon showing up on the desktop version when I only chose the last 3 smaller device sizes for the collapsed menu icon to show up on? Also, the downward arrow is crashing into the words and the circle turns into an oval when I move the window.

  2. I changed the layout to content left, sidebar right under Pro > Theme Options > Layout and Design but nothing happened. It’s still full width. Mind you, it is slated as fullwidth for the site but I also changed it to Icon under the Stack menu and nothing happened as well. It remained full width so I am not sure how to resolve this.

Hi there,

  1. The navigation collapsed isn’t hidden from desktop,

Please inspect the navigation collapse and go to its Customize section

  1. That page is using a page template, and it’s the Blank template. Please edit your page and go to Page Attribute section and change its template to default. Or if you’re within the builder, click the gear icon on the left side (settings) and change the Page Template under General section.

Thanks!

This is what I get when I clicked on the last 3 devices in the Collapsed Menu:

1 Chrome

2 Chrome when I resize the window the whole nav bar with the logo and menu icon circle at the end completely disappears!

Here’s what it looks like on Safari…what is that shape at the end? lol Then when I resize the window, the nav bar disappears too.

I did another job where I had all of the Inline devices clicked on (color was showing) then on the collapsed menu, the last 3 small devices were chosen and it worked out ok but it is not working here. I didn’t click on the devices in the Inline menu on this website. As well on Safari, the logo is reducing to a ridiculous small size again. This is so frustrating!

  1. Ok I see the sidebar now. I just have to remove the header title which I don’t want there. Is this an additional 250px for the sidebar added to the 1320 or is it part of the width? What is the best size to use for the full width of the website? In the Header video he uses 1320 but the standard is 1200 isn’t it?

Hello There,

Thanks for the updates.

1.) Nothings displays in smaller screens because your bar it self is hidden in smaller screens. It should be visible in all screens. Only the navigation menu and the mobile menu will have to use the “Hide During Break Point” options. I went ahead and edited your header correcting the settings. The navigation inline element should be hidden in smaller screens and the navigation collapse or mobile menu should be hidden in large screens.

2.) Icon stack has a unique sidebar layout. It is being set as fixed in the left or right side of the page. You can set the width of the sidebar in the theme options and it is part of the browser width. The remaining width is for the page content. You mentioned that you removed the page title or header title. Did you use the option to hide the Page Title in the Page Settings or modify the template in your child theme? I would recommend that you do not just into that modification yet. You should make use of the different page templates present in the theme. Please check out this knowledge base for more details: https://theme.co/apex/forum/t/features-page-templates/50/1

Hope this helps.

  1. Thanks so much for that RueNel! But I am still getting an error on Safari with the circle icon for the mobile collapsed nav bar version. I am not sure why the icon looks like this. I checked it on my phone and the circle turned into an oval but when I resize the window on my desktop screen, the circle icon looks like this:

How can I fix it? It looks ridiculous…kinda like a designer bee. lol

  1. I used the Page Title in the Page Settings to modify the template. I used the default template under Page Attributes then went into Theme Options, chose Icon from the Stack menu, then chose Content Left, Sidebar Right.

What is the best width to use for my website…1320 or 1200?

Thank you RueNel for your help. You’re very good!

Hi,

  1. To fix this, you can add the code below in Header > CSS

@media(max-width:767px) {
    .e93-3.x-image img  {
        width:300px;
    }
    .e93-5.x-anchor-toggle {
        min-width: 44px;
    }
}

  1. It really depends on your preference and audience.

Kindly refer to the links below.


https://www.hobo-web.co.uk/best-screen-size/

Thanks

That code did not work Paul. This is what it looks like in Safari after I dropped the CSS code in:

Grace

Hello Grace,

I have tested your site in Safari on my iMac and it is working correctly.
This is what I am seeing:

Please clear all your browser cache or use Private Browsing mode in Safari.

Please let us know how it goes.