Hi
is there an easy way of putting an image in the header bar of the default theme? WHilst plain red is perfectly pleasant I would like to size an image to place in there.
thanks
mike
Putting an image in the header bar of the default theme
Re: Putting an image in the header bar of the default theme
Hello miksmith,
You mean this?:
The answer is yes, you can. To do this, you will have to open the file: "fp-interface\themes\leggero\leggero\res\common.css"
Find the #id "Head" (#Head) (Line 157 to 163):
Delete the line: "background: #c37676 url('../imgs/shade.png') repeat-x;" and add:
background: url('YOURSITE.COM/PATH/IMAGE.PNG");
You can also add more options to the background (To do this visit this link: https://www.w3schools.com/css/css_background.asp)
For example:
And it would look like this:
Note: I saved the image in the directory "fp-interface\themes\leggero\leggero\imgs"
You mean this?:
The answer is yes, you can. To do this, you will have to open the file: "fp-interface\themes\leggero\leggero\res\common.css"
Find the #id "Head" (#Head) (Line 157 to 163):
Code: Select all
#head {
font-family: 'book antiqua', georgia, garamond, times, 'times new roman', serif;
padding: 95px 10px 5px 5px;
margin: 10px;
background: #c37676 url('../imgs/shade.png') repeat-x;
border: #bbb 1px solid
}
background: url('YOURSITE.COM/PATH/IMAGE.PNG");
You can also add more options to the background (To do this visit this link: https://www.w3schools.com/css/css_background.asp)
For example:
Code: Select all
#head {
font-family: 'book antiqua', georgia, garamond, times, 'times new roman', serif;
padding: 95px 10px 5px 5px;
margin: 10px;
background: url('../imgs/fruits-863072_960_720.jpg');
background-position: center;
border: #bbb 1px solid
}
Re: Putting an image in the header bar of the default theme
what is the size of the image to fill that area ?
does it matter if .jpg, png or gif ?
I can guesstimate 966 x 168.ish
does it matter if .jpg, png or gif ?
I can guesstimate 966 x 168.ish
Re: Putting an image in the header bar of the default theme
Hi,
no, the image type does not matter, as long as you set the image file name in the CSS correctly:
Code: Select all
background: url('../imgs/fruits-863072_960_720.jpg');
The image size may not be exact, as long as it completely fills the space. (If it doesn't, the image will be displayed tiled - which might be a desirable effect when it comes to small pattern images that then will be repeated horizontally and vertically.)
The image is aligned top-left and will simply be cut off at right and bottom if too large. Easiest way to get the pixel-exact size of your individual header box: Screenshot your page, cut the header box in your favourite graphics tool (might simply be MS Paint), see the size
All the best,
Arvid
Project blogโโ Docsโโ Twitterโโ Mastodonโโ Forum RSS feedโโ Project blog RSS feedโโ Donate
FlatPress 1.3 "Andante" is released!
How to rework your themes and plugins for FlatPress 1.3 / Smarty 4
FlatPress 1.3 "Andante" is released!
How to rework your themes and plugins for FlatPress 1.3 / Smarty 4
Re: Putting an image in the header bar of the default theme
yes, that worked !
I prefer using png
thanks Arvid
I prefer using png
thanks Arvid
Who is online
Users browsing this forum: No registered users and 39 guests