How to lower the position headermedia, and remove searchbar

Tagged: header media, page slider

This topic has 21 replies, 3 voices, and was last updated 3 years ago by Patricia32.

Viewing 20 posts - 1 through 20 (of 22 total)

1 2 →

Author

Posts
February 2, 2021 at 1:36 pm #272981

jonaskngbabo
Participant

Hi
I’m posting this because I think my last version wasn’t uploaded
This is my website :

So I’m using the Catchtheme Photofocus free and i have a few issues.

1. How can I remove the search bar entirely because there’s no need for one

2. Is it possible to lower the position of the headermedia because I want to have my site title and menu on the white background instead of on the headermedia because it’s unreadable as of this moment. I tried with enabling a white background behind my menu but I’ve noticed that it was too huge and too much white space, is there a way to make it smaller. It also overlaps my headermedia which makes the headermedia not entirely visible.

3. When I check the site on my phone, the menu changes to a dropdown menu. The problem is that when it’s closed, it’s white but that makes it invisible on my white background and when I open it, it’s entirely black (background and text). Is there a way to change the colors so that it’s always visible and easy to read?

4. I’ve noticed that the site isn’t responsive on an Imac, can I fix this?

Thanks in advance!

February 2, 2021 at 11:10 pm #272998
Skandha
Participant
@jonaskngbabo: Hello there,
Go to => Appearance => Customize => Additional CSS and add the following CSS Code.
```
/* To hide the search bar */
#primary-search-wrapper, .mobile-social-search .search-container {
    display: none !important;
}
```
Please post in your site URL so that I can look into your other issues.

Kind Regards,
Skandha
February 3, 2021 at 9:54 am #273044

jonaskngbabo
Participant

https://www.huysmade.com/

February 3, 2021 at 10:02 am #273046

jonaskngbabo
Participant

Thanks, that worked! Is it also possible for the share option?

Here is the site: https://www.huysmade.com/

February 4, 2021 at 4:50 am #273121
Skandha
Participant
@jonaskngbabo: Hello there,
Go to => Appearance => Customize => Additional CSS and add the following CSS Code.
```
/* To move the Header Image below menu and site title */
#masthead {
    position: unset;
}

/* To change color of menu items on mobile view */
.menu-toggle-wrapper * {
    color: #000 !important;
}
@media screen and (max-width: 1200px) {
	#site-navigation a {
	    color: #fff;
	}
}
```
Can you please attach a screenshot of how the site is showing up on you iMac so that I can look into the issue?

Let me know if this works out!
Kind Regards,
Skandha
February 4, 2021 at 9:01 am #273141

jonaskngbabo
Participant

Hi thanks, the searchbar is gone and the colors have been changed on mobile view so therefore, thanks!
My menu is still on the headermedia and I seem to have a lot of white space below the headermedia. I just like to have my menu with a background, below the menu the headermedia and nothing below the headermedia.

Btw for a screenshot of the iMac view, I’m not sure how to add this in my reply but basically you see white spaces on the left side and right side.

February 8, 2021 at 5:42 am #273487

Skandha
Participant

@jonaskngbabo: Hello there,
There was little error in the Code I provided which I have fixed now. Can you try using the code above again?

Let me know if this works out!
Kind Regards,
Skandha

February 8, 2021 at 10:44 am #273515

jonaskngbabo
Participant

Yes now it is perfectly removed, is it also possible to remove that ‘share thing’ below the navigation? Is it also possible to remove all that empty space under the headermedia? Is it possible to implement my own fonts to apply on all the text? Because everything changed with a font I liked through Google Fonts except the tagline beneath the site title. And the last question (I swear haha), is it possible to split the navigation menu so I could place the site title and tagline in the middle of the menu so in the center of the menu? I love the theme btw! Thanks a lot, in advance!

February 9, 2021 at 12:49 am #273589
Skandha
Participant
@jonaskngbabo: Hello there,
To remove the Share icon below the navigation
Go to => Appearance => Customize => Menus => View All Location => Header Social Menu => Deselect any menu and Publish.

Go to => Appearance => Customize => Additional CSS and add the following CSS Code.
```
/* To remove the space under the Header Image */
.home #content {
    display: none;
}
```
Can you let me know which font you would like to use?

I am afraid it is not possible to split the menu in order to place the site title and description in the middle. If you really need it I suggest you to hire a customizer to get it done.

Let me know if this helps you out!
Kind Regards,
Skandha
February 9, 2021 at 8:51 am #273633

jonaskngbabo
Participant

Okay, thanks a lot! That last one worked! Thank you for your patience and time

February 10, 2021 at 3:05 am #273712

Skandha
Participant

@jonaskngbabo: Hello there, I hope I was able to resolve your issue. If it’s not too much trouble, I have a quick request: could you please leave an honest review?
https://wordpress.org/support/theme/photofocus/reviews/#new-post
Your review will help others know what to expect when they’re looking for the support I offer. Even a sentence or two would be hugely
appreciated. Thanks, and if there’s anything else at all that I can do to help, don’t hesitate to let me know. Have a good day! 🙂

Kind Regards,
Skandha

March 30, 2021 at 2:25 pm #278324

Patricia32
Participant

I put your code in Additional CSS, in customizer the header video is lower (but dark) but not on the website after publishing. Can you suggest anything else?

My second question is about the page slider. The photos look great on mobile but on desktop they are to big, how do I adjust this?

My website is patriciaportraitphotography.com

March 31, 2021 at 7:52 am #278401

Skandha
Participant

@patricia32: Hello there,
Can you please try using the recommended image size of 1920*1080px for the Slider Images and see if the images look better on desktop?

Also can you please elaborate what issue you are having with the Header Video?

Kind Regards,
Skandha

March 31, 2021 at 1:01 pm #278435

Patricia32
Participant

Thank you for your reply.
I changed on one page the photo to the image size you advised, in customizer is shows OK but it is darker. But I can’t see it live yet.

The header video is now lower but still dark. But in customizer it is clear now so maybe tomorrow the darkening is also fixed.

I will let you know tomorrow. Maybe it is fixed.

April 1, 2021 at 2:41 am #278505

Skandha
Participant

@patricia32: Hello there,
To remove the dark overlay
Go to => Appearance => Customize => Header Media => Header Media Overlay => Set it to 0 and Publish.

Let me know if this works out!
Kind Regards,
Skandha

April 1, 2021 at 3:53 am #278509

Patricia32
Participant

Thank you Skandha for your reply.

I did it and cleared the cache and the head media is working great thank you!

Only at the page slider it isn’t working yet. When I go to the page the photo looks great but in the page slider it changed its colour. (I only tried it yet at the page Personal Branding)
Any suggestions?

April 1, 2021 at 4:47 am #278511

Skandha
Participant

@patricia32: Hello there,
I checked your site and the slider seems to be working fine. Can you please explain what change in color issue you are having?

Kind Regards,
Skandha

April 3, 2021 at 2:35 am #278636

Patricia32
Participant

Hi Skandha,

I figured it out about the colours. I had to export it with a sRGB profile and now the colours are OK.
In the desktop version there is a small cap between the header media and page slider. Should I change the size of the back ground photo? Or any other suggestion?
In the tablet version the video is playing only half way in the preview. I don’t have a tablet to check it.
In the mobiel version it is great! Only here I am missing the three white stripes for the menu. Can I get that back?

Thank you for all your advise!

April 3, 2021 at 10:52 am #278712

Skandha
Participant

@patricia32: Hello there,
To have the header video play on mobile devices as well you will need to use our Header Enhancement Plugin.

Let me know if this works out!
Kind Regards,
Skandha

April 6, 2021 at 2:57 pm #278960

Patricia32
Participant

Thank you, it looks great and it added also the music!
Author

Posts