[Resolved] peepso breaks the headers

[Vadim]

Guys, help out! I already broke my whole brain 🙂
I have using GP as main theme and peepso as socialnet plugin.

The problem is the horizontal alignment of the peepso header. He flew to the left when I added my additional links. I
can not solve the problem. Tking me into the manual, where it is described how to do it or hint yourself …

Also some kind of trouble with vertical alignment. language bar is higher than the rest of the header elements. what’s wrong?

And when the user is logged in, the header also leaves.

usually pipso headline looks like this. Social icons are in right corner.

but when I added my links (highlighted in yellow), the icons flew to the left.
I turned to peepso, they looked and said that the problem was on the side of the theme developer. Can you help me?

If you need admin access I am ready to get it.

[Leo]

Hi there,

Sorry I’m not quite sure what I’m supposed to be looking at here.

Your screenshots didn’t come through.

Can you upload them to a site like this and provide the direct links here?
https://postimages.org/

Let me know 🙂

[Vadim]

Proper layout page header

After composing the page header using the theme

[Tom]

Hi there,

I’m not quite sure what I’m looking for here – I don’t see either of those headers on your website?

Is there a specific page I should be looking at?

[Vadim]

Well, this is because you are not logged in. I can show you how pages look like without authorization.

Proper layout page header (peepso plugin site)

After composing the page header using the theme

So, in the previous post, how the pages with authorization look like, and in this post – they are without authorization

[Tom]

The one you’re comparing to seems to be the header they’ve designed for their own website. Your header won’t look like that unless you design it that way.

Is it possible to add their login link as a regular menu item? If so, it looks like you could set your navigation as your header: https://docs.generatepress.com/article/navigation-as-a-header/

[Michel]

Hello,

I use new rc version 1.8 rc2 and I can not put peepso user bar widget in menu bar at the top.
I have “Use Navigation as Header” set as ok and

I have tried to understand this https://docs.generatepress.com/article/navigation-as-a-header/
but in 1.8 rc2 it’s not same way I suppose :/

Wat I have do at this point :
1- Go to Widget setting and put a new one “userbarpeepso” in header section
2- Go to Layout setting, Header and set on “Use Navigation as Header”

Everything looks OK but the peepso widget is not showing, did I forget something?

Thanks for help, this make me crazy 🙂

[Tom]

Using the new Navigation as Header option removes the header area, including the header widget.

Perhaps we can add the widget inside a Hook Element, instead? Where do you want it to display?

[Michel]

“removes the header area, including the header widget.”

arf, I have buy full version just because of this option, as I do not know how to modify code without a guide I thought it would be easier with this new option 🙂

I just want to di this:
[url=https://postimg.cc/3yDgkNm9][img]https://i.postimg.cc/3yDgkNm9/header2.jpg[/img][/url]

While waiting for your answer I will try with the old version to see if I get there

[Tom]

Should be quite easy.

First, install this plugin and add your widget to it: https://wordpress.org/plugins/widget-shortcode/

Copy that shortcode for later.

Now:

1. Create a Hook Element: https://docs.generatepress.com/article/hooks-element-overview/
2. Set the hook to inside_navigation
3. Check the Execute Shortcodes checkbox
4. Add this as your hook content:

<div class="navigation-widget">
    [your-shortcode-here]
</div>

Then add this CSS to your site:

.navigation-widget {
    float: right;
    order: 20;
}

That should get us close, we’ll likely need to style it a bit more, though.

Let me know 🙂

[Michel]

Great, it works 🙂
I just have little worries,

1) When I scroll down the widget changes position and goes to the left

2) Size of logo .. my logo is 144×20, but it is all time resize in this theme, I read in another topic that actually it depended on the size of the bar.
How do we make it all the time at 144×20?

3) For the css I’m bad, I try to display links of widget in white I can not: /
Is it possible that css uses same parameters as menu bar?
Like that if I change font and colors of theme at the expected place in setting, this affect the links of the widget?

Thank you very much for the clarity of your explanations 🙂

https://postimg.cc/dh8F4qw0

[Tom]

Is there a URL where I can see that?

[Michel]

Yes, *** is my test site

Connection link is not very visible at moment, but it is just to the right of the search icon in navbar, as it’s a test site there is no problem 🙂

[Tom]

I just adjusted the CSS above – can you give it another shot?

[Michel]

Thank you, this work now ^^
Logo size problem is settle via menu height in setting, this is ok, I just have to find where to change color of links in peepos widget, perhaps it’s a question for their support.

Thanks again and happy Easter 🙂

[Author]

Posts