[Support request] www.e-szpital.eu – icones structure in the top

[Robert]

Hi

how are You?

I made:
https://www.e-szpital.eu/ and have 2 questione:

1.
on the mob. version the 3 elements in the top: (logo + facebook + bip)
are one above the other whats takes much place.

Its passible to chage it to:
– first: facebook + bip in one line
– the logo below

2.
Do You have any ideas how to put into the MENU a icone buton without any TXT
– like on the MENU on http://www.usk.opole.pl/ the house icone on the left?

Kr
Robert

[David]

Hi there,

1. you can your Facebook and BIP icons to the Top Bar widget area:

https://docs.generatepress.com/article/top-bar-widget-area/

2. As you’re using Font Awesome you can add one of them as the menu items Navigation Label eg.

<i class="fa fa-home"></i>

More info here:

https://docs.generatepress.com/article/adding-icons-to-menu-items/

[Robert]

hi

ad. 2
– it works: the house icone on the begin of the MENU is online 🙂

ad. 1
the Facebook and BIP icons are in the Top Bar widget area
but on the mobile version they are one above the other whats takes much place.

Its passible to chage it on the mob. version too:
– first line: “facebook” + “bip” in one line
– the logo below

[David]

Can you remove the logo from the Top Bar and display the logo using the Site Identity?
https://docs.generatepress.com/article/site-identity-overview/

The add this CSS to your site:

.inside-top-bar {
    display: flex;
    justify-content: flex-end;
}

@media (max-width: 768px) {
    .inside-top-bar {
        justify-content: center;
    }
}

[Robert]

Hi

unfortunely I cant remove the LOGO from the TOP BAR but I used Your CSS code and its looks now OK for me in the mob. version

on the desktop version it looks:
https://www.e-szpital.eu/

Its passible to add into the code (maybe ALIGN) for the logo in the top bar to the left
and for the FB and BIP icones to the right ?

Kr
Robert

[David]

If you want the Logo and the Social Icons to be inline for the Desktop then it would be best to put the icons back in the Header Widget. Then i can provide the CSS to align etc.

[Robert]

hi

1.
there isn’t any posibility to have in the top bar on the left the LOGO
and on the right the few icones on the Desktops

and on the mobile version have the icones in one line?

I found someting like I wannt on:
http://www.usk.opole.pl/

2.
other option
and maybe is this passible:

– in the top bar on the left the LOGO and on the right the few icones on the Desktops
– but on the mobiles there would be only the 2 icones without the logo

?

Thx
Robert

[Robert]

Hi

I add for a fast test the logo and the two icones to the haeder.
– I had to remove it now but it looked like on the print screen:

https://www.webprofi.pl/haeder_test.jpg

Its passibe to change all the header setings to look like it looks now the TOP BAR on:
https://www.e-szpital.eu/ – inclusive the white background color ?

Kr
Robert

[David]

The best method to do this is:

1. Remove the Top Bar widgets – they are not needed.
2. Display your Logo using the Customizer > Site Identity:

https://docs.generatepress.com/article/site-identity-overview/

3. Then add your Social Icon Widgets to the Header Widget.

This will place the Logo on the Left and your 2 x Icons on the right.

[Robert]

Hi David,

I made again a fast try and change the background color in my haeder to WHITE
and it looks so:

https://www.webprofi.pl/haeder_icones_test2.jpg

How can i stretch the width of my MENU over the whole page ?

Kr
Robert

[Tom]

Hi there,

I just took a look at your site and it looks like you figure this out.

Let us know 🙂

[Robert]

hi Tom

unfortunately not…

This what You can see on https://www.e-szpital.eu/ is still all in the TOP BAR
what take too much place on the mob. version

Thats why David wrote to me it would be better to move the LOGO + the two icones into the header.
– but I need to have the header background white.

I made a test for few minutes and if I change the headr background color into white it looks:

https://www.webprofi.pl/haeder_icones_test2.jpg

– on https://www.e-szpital.eu/ looks good becouse there is now the header background color dark blue (like in the MENU): on the https://www.webprofi.pl/haeder_icones_test2.jpg it was only a test run.

How can i stretch the width of my MENU over the whole page:
– the MENU should looks like it looks now: https://www.e-szpital.eu/ – inclusive the haeder with white haeder

thx
Robert

[Robert]

Hi again.

maybe from the other side:

I made for test: https://www.pan-www.pl/, where I:
– 100% remove the top bar
– add the 3 logos into the header with white background

It should looks like: https://www.e-szpital.eu/ – what and how I need to change ?

Kr
Robert

[Robert]

…

sorry – I addes into to the header only 2 icones
and tle LOGO is: Customizer > Site Identity:

[David]

Now add this CSS to your site:

.header-widget {
    display: flex;
}

[Author]

Posts