- This topic has 15 replies, 5 voices, and was last updated 3 years, 1 month ago by
Leo.
-
AuthorPosts
-
June 8, 2017 at 1:09 am #330332
Mireille
Hi there,
I would like to have a different background image on each page. I understand I can choose a featured image and make it full width, but then I have to have images with the text on it because the text cannot be placed in front of the image? And when I have images with the text on it, it is nog possible to place different links in the text.
And when I choose an image as background in the content area, it will be the same on all pages.
Can you please help me with this?
Thank you in advance!!
Mireille
GeneratePress 1.3.46June 8, 2017 at 7:58 am #330494Tom
Lead DeveloperLead DeveloperHi there,
Are you wanting to change the body background image on each page? So the image that is shown behind all of your content/header/footer etc..?
Let me know 🙂
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentJune 8, 2017 at 8:03 am #330498Leo
StaffCustomer SupportHi there,
You can use the page header add-on if you want to add text/links in front of featured image:
https://docs.generatepress.com/article/page-header-overview/As for different background images for the content area, try this CSS in the Simple CSS meta box on each page:
.inside-article { background-image: url('http://URL-HERE') }
Simple CSS: https://docs.generatepress.com/article/adding-css/#simple-css
Let me know.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/June 13, 2017 at 1:51 am #332808Mireille
Hello Tom,
Yes, I would like a full width background image behind the content between the primary menu and the footer. And on each page a different image.
Is that possible?
Thank you for your help!
Kind regards,
mireilleJune 13, 2017 at 2:14 am #332818Mireille
And is it also possible to add several links on one image? Or just one per image?
June 13, 2017 at 8:01 am #332950Leo
StaffCustomer SupportHi there,
For different background image on each page, try this CSS in the Simple CSS meta box on each page:
body { background-image: url('http://URL-HERE') }
Simple CSS: https://docs.generatepress.com/article/adding-css/#simple-css
Not sure what you meant by adding links? Don’t think there is away to add links to background images.
Maybe you are able to provide an example from other sites? Thanks!
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/June 15, 2017 at 4:33 am #333918Mireille
Hi Leo,
Thank you for your support!
With the possibility to make sections I managed to have a different image on each page. In that way, I can place links everywhere I would like in the text and media.
But I would like a background image with a semi-transparant (opacity) block behind the text (content). Is that possible too? In the section I can choose a background color, but how do I choose semi-transparant?!
If that is possible, I guess my problems are solved.Thank you again!
Mireille
June 15, 2017 at 8:20 am #333977Leo
StaffCustomer SupportSo basically an color overlay on background image?
The easiest way would be to add the color directly on the image using a image editing software like Photoshop.
You could do it using rgba, but you would have to add an empty div inside each section and set some CSS to it:
https://generatepress.com/forums/topic/semi-transparent-image-overlay-for-sections-and-page-header/#post-158850Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/March 1, 2018 at 3:54 am #508707Staffan
Hi. I also want different background on different pages. In my example I want a page with black background.
First I installed the plugin Simple CSS to be able to add code for a page.
Then I have added these both suggested codes – in different order and alone.
.inside-article {
background-image: url(‘http://…/black-line.jpg’)
}
body {
background-image: url(‘http://…/black-line.jpg’)
}The background will be black, the content area is black except a white frame around it.
That frame seems to be the “padding” around content as can be set to zero in appearance/customize/layoyt/container but that is for the site overall.
Can I get rid of that “padding” frame ONLY for a specific page?
/StaffanMarch 1, 2018 at 6:13 am #508809Leo
StaffCustomer SupportI believe this is what you are looking for: https://docs.generatepress.com/article/page-builder-container/
If not can you open a new topic for your question?
Thanks!
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/March 1, 2018 at 6:31 am #508829Staffan
Hi.
Great – It works! In the page layout section you go to tab “Page builder contaniner” and choose full width option. Then background become black all over my page – as I want.
Thank you very much!
/StaffanMarch 1, 2018 at 6:42 am #508837Leo
StaffCustomer SupportNo problem!
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/March 1, 2018 at 7:10 am #508944Staffan
Hi again. I dont find where to put a new qustion?
I’m running generate express premium. But now I can’t find where to change the header or header image? There is no menu option anymore to change header content? What is wrong?
/StaffanMarch 1, 2018 at 2:35 pm #509218Leo
StaffCustomer SupportOnce you logged in to your account, scroll to the bottom of this page to start a new topic: https://generatepress.com/support/
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/March 9, 2018 at 1:52 am #515408Christoph
Hello again,
I am trying on this page: http://www.uepconsult.com/acerca-de-nosotros/
(1) I have put a background image with
body { background-image: url('http://www.uepconsult.com/wp-content/uploads/2018/03/uepnosotros.jpg') }
BUT what is the optimal size for the image, so thats shown well on all screens? Or how can I make this background responsive?
and
(2) How can I make the container width smaller (just on this page) ? -
AuthorPosts
- You must be logged in to reply to this topic.