Header image issue

Hi out there,

I use different header images for every single page. The images are scaled dependend on the platform (mobile, pad, Desktop). With this it is nearly impossible to find images which have a decent height and appropriate look on all platforms.

Is it possible either

  1. have three different images for each single page, one for each platform? or
  2. set somehow scaling / cropping rules to deal with the images dependend on the platform? or
  3. is there a way to fix the Overall width of the template for Desktop presentation (the rest of the screen is covered by Background Image)?

I use Moesia Pro together with pagebuilder and appreciate any help.

Thanks so much for your help in advance,
Knut

Hi K,

Could you please to share your site URL here?

Regards,
Awan

Dear Awan,

sure. Here it is www.knutmenzel.com.
To simplify my request just have a look at the Header Image (not the slider) of the Start Screen.

If possible, please have also a look at the Logo. I inserted the graphic you see there. Actually I had plain text in title and subtitle of the web site Information within the customizer. The Effekt was, that Navigation and sub title text collided at some screenwidth and somehow the header image has been shiftet downwords on the screen. Question: Is it possible to have html tags within the subheader somewhere to enforce a linebreak in the subheadline as it is currently presented in the logo. This would increase the Quality of the font visualization since it would be scalable font an no longer graphics text.

Thx so much.
Knut

Hi,

I am sorry for the delay.

I’ve checked your site on device screen and mobile screen but I didn’t see the issue with your header image. All displayed properly, did you already resolve the issue?

Then about your question for the text below the logo image, this theme only able to have 2 options for the logo:

  1. upload logo image
  2. Add site title and sub-site-title

There is no option to have logo image and sub-site-title. But you can customize those part by modifying existing code and I suggest you to contact upwork.com or codeable.io to help you further.

Regards,
Awan

In case that anyone is able to help the Problem get solved, the site has been Password locked with “aThemes”.

The above issue concerning the logo image is already solved.
Still open is the platform dependend Header Image per page.

Regards,
Knut

Hi out there,

did so far the following. In case anyone has a smarter idea, please let me know.
Regards,
Knut

/* Stop laying header-Image behind top-bar (so start header-Image after top-bar) and stop scaling image vertically (so only allow scaling at both sides) until separate picture for pad or mobile is loaded. This is defined in the section of the page Editor, where the Header Image is defined */
@media screen and (max-width: 2200px) {
.has-banner:after,
section {
background-attachment: scroll !important;
}
}

@media only screen and (max-width: 2200px){

/* for every page take a separate JPG */
.page-id-1153
.site-header:after{
background-image: url(‘http://www.knutmenzel.com/wp-content/uploads/2017/03/HPP 1920x500-2.jpg’);
}

/* … other pages … */
}

Dear Awan,

yes, already solved. Please see above.
Regards,
Knut