- This topic has 15 replies, 5 voices, and was last updated 6 years, 1 month ago by Leo.
-
AuthorPosts
-
June 8, 2017 at 1:09 am #330332Mireille
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
June 8, 2017 at 7:58 am #330494TomLead 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 🙂
June 8, 2017 at 8:03 am #330498LeoStaffCustomer 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.
June 13, 2017 at 1:51 am #332808MireilleHello 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 #332818MireilleAnd is it also possible to add several links on one image? Or just one per image?
June 13, 2017 at 8:01 am #332950LeoStaffCustomer 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!
June 15, 2017 at 4:33 am #333918MireilleHi 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 #333977LeoStaffCustomer 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-158850March 1, 2018 at 3:54 am #508707StaffanHi. 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 #508809LeoStaffCustomer 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!
March 1, 2018 at 6:31 am #508829StaffanHi.
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 #508837LeoStaffCustomer SupportNo problem!
March 1, 2018 at 7:10 am #508944StaffanHi 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 #509218LeoStaffCustomer SupportOnce you logged in to your account, scroll to the bottom of this page to start a new topic: https://generatepress.com/support/
March 9, 2018 at 1:52 am #515408ChristophHello 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.