Customizing ONLY the Mobile Header

Can you please give me exact step by steps how to do the below? (As if showing a beginner.)

How can the background header on the Desktop version of website, display as a full width header background
on the mobile version of website?

Currently, the website is not using a logo. The logo is in the background header. When opening on a mobile device, the background header does not show, and I have to use a logo, but this is NOT Full-Width.

I need to be able to have a Full-Width background header image display on mobile device.

How can I do this?

I see templates in cloud, but I only want to change mobile device header not desktop.

Can you please give me step by step instructions?

Can I please get more instruction?

I do not want to redesign my desktop header. Only the mobile header.

I created this header https://dev.yall.com/tdb_templates/mobile-header/
It is showing a desktop version that I DO NOT want to use. If you reduce
screen size you will see what I created.

Now, how do I get this header to show up on mobile device?

I DO NOT want to have to rebuild the entire page. My goal is just to have the background image display in mobile header fullwidth.

Is it possible to get directions a 5 year old could follow? Sorry, I just find this very confusing.

So, is the “Slick Header” template used by building the entire pages with the template?

I do not want to make any changes to the website, nor do I want to build any more pages, or rebuild old pages. All I want to do is get a background header to show up full width on mobile device.

Is this possible?

Please see my earlier reply.

Thank you so much for your help 🙂