Essential theme full length Header background image

Essential theme full length Header background image

Animal the muppet -
回帖数：12

Essential 3.5.0.1

Moodle 3.5


Simple one; how would I stretch the header image across the screen? Whatever size I have selected, I the header image appears as a square.

Site administration > Appearance > Themes > Essential >Header


I have the navbar below the header. (2nd option)

I have set the Header background style as fixe (not tiled)


Thanks!

平均分： -
回复Animal the muppet

Re: Essential theme full length Header background image

Animal the muppet -

My image is 1581 × 787

平均分： -
回复Animal the muppet

Re: Essential theme full length Header background image

Animal the muppet -

image

附件 essential_theme_additional-html.jpg
平均分： -
回复Animal the muppet

Re: Essential theme full length Header background image

Animal the muppet -

I'm sure everybody should be on summer break (like me! 大眼睛) But this one is still bugging me if anyone has any suggestions?

Does this require a little code to get a full-screen background image? Thanks

平均分： -
回复Animal the muppet

Re: Essential theme full length Header background image

Gareth J Barnard -
Core developers的头像 Particularly helpful Moodlers的头像 Plugin developers的头像

I think so as there is no current setting for this (would take me a while to engineer it into the theme).  Or make the image the size to fit the space.

平均分： -
回复Gareth J Barnard

Re: Essential theme full length Header background image

Animal the muppet -

Thanks Gareth. I have tried a variety of different image sizes in Site administration > Appearance > Themes > Essential >Header

but the image appears as a square :s

平均分： -
回复Animal the muppet

Re: Essential theme full length Header background image

Gareth J Barnard -
Core developers的头像 Particularly helpful Moodlers的头像 Plugin developers的头像

Make the image 1200px by 64px and then have the 'headerbackgroundstyle' as fixed.

平均分： -
回复Gareth J Barnard

Re: Essential theme full length Header background image

Animal the muppet -

annnnnd Bingo was his name! 


Thanks Gareth! This is a good tip for anyone wanting a full-length header. I guess my height was too much! Happy summer.

平均分： -
回复Animal the muppet

Re: Essential theme full length Header background image

Mary Evans -

You could have added some CSS ... 

#page-header { background-size:  cover; }

Which probably wold have done the job if #page-header is correct as I am just guessing.

M


平均分： -
回复Mary Evans

Re: Essential theme full length Header background image

Animal the muppet -

Thanks - I'll give the code a go.

... Wait a minute, kids new more moodle than you? It's usually the kids that say that about their teachers but look who showed them! Good on you Mary! 装酷

平均分： -
回复Animal the muppet

Re: Essential theme full length Header background image

Mary Evans -

Hi Muppet...ummm

Where did u get my Avatar image from that is displayed on the  image you posted above?

cheers

Mary

平均分： -
回复Mary Evans

Re: Essential theme full length Header background image

Animal the muppet -

Gosh, that must be a freaky find! 大眼睛 It wasn't something I personally took a screenshot of. I googled the essential theme and it came up! Apologies if it infringes on anything Mary. Would you like me to remove the screenshot? On a positive note; you are famous 微笑 

Site: https://www.elearningworld.org/moodle-podcast-july-2017-themes/


平均分： -
回复Animal the muppet

Re: Essential theme full length Header background image

Mary Evans -

Ok..

The fact you found it doing a search means that it was taken from a screenshot I took some time ago, and used in this forum.  If the podcast was about the Essential theme then why did they not ask Gareth for a screenshot?

Perhaps Stuart liked the classic  look of the page I had at that time, I never did take to the double blocks on the right as that always caused problems with layout pre and post locations. 

Interesting Podcast, I am from Lancashire like Stuart, and I remember helping out at our local primary school who used Moodle 1.8 I think it was?

I did not stay long as the kids knew more about Moodle than me! Lol 

Cheers...

M



平均分： -