Logo header

Hey guys, just a quick help. I cannot find anywhere where I can position my header logo aligned left.
Can you please help?

If I select inline in the theme options, all the post titles H1 will align left and I don’t want that, only the logo in the header.
See screenshots

Screen Shot 2020-08-13 at 20.53.55

Thanks a lot for your help

Hello Isabelle,

Thanks for writing in!

Please be advised that the X > Theme Options > Header > Logo and Navigation > Layout will only affect the logo and navigation. This does not affect the post titles. If nothing is helping, kindly provide us access to your site so we can check your settings. Kindly provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WordPress Admin username / password

To know how to create a secure note, please check this out: How The Forum Works

Best Regards.

Hi thanks for your prompt reply.
That’s so weird. Because when I switch to the inline style, I saw all the posts with the titles squeezed on the left. when I went back to stacked, it returned normal.

I will give you access. thanks

Hello Isabella,

Your logo image is way too wide. To be able to resolve your issue, you will have to reduce it to at least half of it’s current width.
6YaDjktyR6yUHFi7M2XWiA

And then you will have something like this:
PV1fw_31S6WI5oF5VuvavQ

Hope this helps you.

I am not sure I understand, I want the logo of that size, and in any case even reducing the size it’s still in the centre. How did you move it left?

Hello Isabelle,

You will have to reduce the logo image width and also do not forget to set the X > Theme Options > Header > Logo and Navigation > Layout to “Inline”.

Best Regards.

Why do I have to reduce the image?

Also as I was mentioning before if I select inline all my posts titles will squeeze on the left not to mention the pages

see screenshot

I have now increased the size of the logo canvas and reduce the logo itself but in doing so it’s not aligned.
any thoughts?

Hi Isabelle,

It seems the issue with Global Blocks that has been injected through code in the single post page from your child theme.
Please check your Global Block whether any broken HTML is there, which may be breaking the structure. Please find a screenshot that shows a closing tag, without the opening tag.

If it does not help in any way, please copy your live site to a staging server so we could troubleshoot freely without breaking your site.

Give us access as you did for your live site.

Thanks

hello there
I didn’t find any broken code but I am not really an expert. That code in the global block was given by your support, I didn’t change anything.

this is what I found Screen Shot 2020-08-14 at 8.28.44

I still have the same issue…
I don’t know how to create a staging server and the instruction you provided doesn’t include my server, which is cloudways. I would appreciate if you could access my site with the credential provided and help me with this issue.

Also is it possible to align the navigation bar with the logo as well?

I understood why you wanted me to reduce the logo. That was a misunderstanding on my end. I don’t want to have the logo on the navigation bar, I want it above the navigation bar but on the left, and aligned with the menu (which also needs to be aligned on the left instead of central)
I hope this clarify.
Thank you so much for your help
cheers
Isabella

Hello Isabelle,

I went ahead and changed your theme option settings using the following values:

The layout should look like this now:

Can you please check if this is what you wanted? Kindly let us know.

Thanks.

Hello @ruenel

that’s exactly what I did before and I told you it gives me problems in the pages

see screenshots

second thing I wanted to menu to be aligned left not central, if possible.

thanks for your help

it is supposed to look like this


so, no it’s not how I wanted. I am sorry I wasn’t clear in my previous message

Here is a page I have created in photoshop to show you how it’s supposed to look like

Also I noticed that in the header picture before the date, my name doesn’t show… it says "by I " did you change anything in the global block?
thanks a lot

Hi Isabelle,

I have taken a closer look and it appears that you have modified the _navbar.php:

<?php

// =============================================================================
// VIEWS/GLOBAL/_NAVBAR.PHP
// -----------------------------------------------------------------------------
// Outputs the navbar.
// =============================================================================

$navbar_position = x_get_navbar_positioning();
$logo_nav_layout = x_get_logo_navigation_layout();
$is_one_page_nav = x_is_one_page_navigation();

?>

<?php if ( ( $navbar_position == 'static-top' || $navbar_position == 'fixed-top' || $is_one_page_nav ) && $logo_nav_layout == 'stacked' ) : ?>

  <div class="x-logobar">
    <div class="x-logobar-inner">
      <div class="x-container">
        <?php x_get_view( 'global', '_brand' ); ?>
      </div>
    </div>
  </div>
  <!-- slider above masthead -->
<?php x_get_view( 'global', '_slider-above' ); ?>

  <div class="x-navbar-wrap">
    <div class="<?php x_navbar_class(); ?>">
      <div class="x-navbar-inner">
        <div class="x-container max width">
          <?php x_get_view( 'global', '_nav', 'primary' ); ?>
        </div>
      </div>
    </div>
  </div>

<?php else : ?>

  <div class="x-navbar-wrap">
    <div class="<?php x_navbar_class(); ?>">
      <div class="x-navbar-inner">
        <div class="x-container max width">
          <?php x_get_view( 'global', '_brand' ); ?>
          <?php x_get_view( 'global', '_nav', 'primary' ); ?>
        </div>
      </div>
    </div>
  </div>

<?php endif; ?>

I want you to update it particularly the logo bar area. You need to set the maximum width of the container by adding max width which was originally and should be present in the default code and attach an inline css style text-align: left; to the logo bar container so that the logo will be position to the left side.

  <div class="x-logobar" style="text-align: left;">
    <div class="x-logobar-inner">
      <div class="x-container max width">
        <?php x_get_view( 'global', '_brand' ); ?>
      </div>
    </div>
  </div>

Note: Please be advised that you will be responsible for maintaining any modifications that has been made in the child theme. Always double check your modifications after every theme updates.

By the way, I am seeing your name in the global block. I did not change anything in your block.
QpjbzV3ES1arhb9xUSL2Yw

Kindly check your page now.

Hello @ruenel,

Thanks for this. I have checked in the CSS but I haven’t found that code. Can you please tell me where you have found it?

thanks
cheers
Isabella

Hi Isabella,

It is not in the custom CSS. You can find the code in Appearance > Theme Editor and find the _navbar.php in the right side panel. Anyways, I went ahead and modified the file for you to save us time.

Have you check your single post yet? See the secure note.

Hello @ruenel
thanks a lot for your kind help.

I have checked but it’s still not aligned.

the menu bar is all on the right, it’s supposed to be on the left, aligned under the logo…
can you help?
thanks a lot
isabella

Hi Isabella,

Only the logo is aligned to the left side. Your navigation menu is still align to the center. The navigation menu is using this CSS built into the stack style.css:

.masthead-stacked .desktop .x-nav {
    display: table;
    margin-left: auto;
    margin-right: auto;
}

Setting the left margin to 0 should make the navigation align to the left. Therefore, you can copy the code above and insert it in Theme Options > Custom CSS.

.masthead-stacked .desktop .x-nav {
    margin-left: 0;
}

Please do understand that you will be the one to maintain this code. Regularly check the custom codes especially after any theme and plugin updates.

Best Regards.

Awesome thanks a lot

Hi Isabella,

Glad that we are able to help you.

Thanks

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.