Title and Menu on top of Header Image

Travelify
1

Hello - I am hoping to have my Title, and ideally Menu, display on top of the Header Image on the travel blog (mikemcewan.ca) I am creating which currently looks like this:

While I know that I could easily achieve the aesthetic by including the Title in the header image, I would like to not lose the home/hyperlink functionality.

Ideally, it would look something like this:

If at all possible I would also like to move the Menu up on top of the Header Image as well. Something like this:

Would anyone be able to help me make these changes? Thank you in advance!

2

Hi @mikemcewan,

I hope you are well today and thank you for your questions.

Ideally, it would look something like this:

You can try achieving this by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Travelify Other Options


header#branding {
    position: relative;
}
#branding > .container {
    position: absolute;
    top: 0;
    left: 20px;
    width: 100%;
}
If at all possible I would also like to move the Menu up on top of the Header Image as well. Something like this:

To achieve this you have to develop custom code in the child theme of Travelify theme.

Developing custom code for custom functionality is beyond the scope of support that we provide here.

If you are not a developer then you can consider hiring a developer to develop it for you. You can hire a developer from any freelance site. Colorlib recommends the developer https://www.upwork.com/freelancers/~011652ffec8865c6d5

Best Regards,
Movin

3

Thank you!

4

You are most welcome here :slight_smile:

5

Two small things I noticed which I was hoping to get your help on:

  1. The title displays fine on a web browser but does not resize with the image when in tablet or mobile phone view. Is there a way to correct this?

  2. I noticed two faint vertical lines on either side of the header image. As I have set the background color to match, I was hoping to remove these.

Again, your help would be greatly appreciated!

6

To help us keep support thread separates could you please create new thread for each of your other questions here https://colorlibsupport.com/c/travelify-support/ instead of asking them in your single thread as it makes the thread messy and hard to read.

If you want to you can also add reference of this thread in your newly created thread.

We would be more than happy to help you on your new thread.