Digital experiences for all disciplines
New Landing › How can we help? › Atelier › Page Background via ROW Background Image
New Landing › How can we help? › Atelier › Page Background via ROW Background Image
- This topic has 10 replies, 2 voices, and was last updated 9 years by David Martin – Support.
-
Posted in: Atelier
-
July 10, 2015 at 8:40 pm #193751
Hi there,
I have a page created with using the ROW Background (BG) image.
Page Header/Slider set to Naked Light, that the header is transparent.When I add a image to the Page BG – BG Image > Cover or Auto set > the image does not show on the page. Is this only for Boxed website layout?
I would like to use the Proper Title size I have set Throughout the WebsiteAlso same page, when I set the last ROW to a grey BG colour, it shows me the last 50-100px white before the footer starts. I have added a spacer and played with the pixel space underneath the row of images. No matter what I added, there was always this white gap!
How can I get rid this?Is it possible to set on a Page the Row with content a way, when scrolling on a PC screen ROW 1 with content moves automatic to Row 2 with content..etc. I mean like I scroll the mouse wheel down to read further and the page jumps, at say 25% I moved down with mouse wheel from itself to the next “ROW page”. Also vice versa from bottom up! Hope you understand what I mean. Here an example:
www dot dji dot com/product/phantom-3 I took the dots out, not sure if I am allowed to post links!Thanks so much for your help.
Cheers Anette
PS Happy Weekend 🙂
Attachments:
You must be logged in to view attached files.July 13, 2015 at 4:18 pm #194191Hi,
q1) I can see your row background images, did you resolve this?
q2) To remove the spacing check the page option ‘Page Meta => Remove bottom spacing’
q3) Sure, in the page options check ‘Page Meta => Enable One Page Navigation’. Then for each of your pages ‘Row’ assets edit each and add a unique name under the row option ‘Row Section Name’.
Thanks,
David.July 13, 2015 at 4:49 pm #194208Hi David,
thanks so much for your help. All set as said in 2. & 3.. Will do now the pagination.
1. I want to set a hero title on this page. The Hero title BG goes on top of the first ROW BG image and covers it quite a bit. the top of the window has then the empty space with header. The title you see in that page, I have added with a text block in the first row and the breadcrumb with the widget. I’d like to have that page as you see it in the attachment with use of the hero title. If this is possible!
Also how can I make the ROW BG image that the image sizes down properly for the iPad? It doesn’t resize properly!
Cheers Anette
Attachments:
You must be logged in to view attached files.July 14, 2015 at 10:34 am #194385Hey – Great stuff!
q1) So if I undertand this properly, you want the header on this page http://www.anettewildphotos.com/limited-edition-prints/ to look just like: http://www.anettewildphotos.com/ ?
– If so, you can create and assign a Swift Slider slide to that page header. Edit Page => Page Header / Slider => Swift Slider.
Thanks,
David.July 14, 2015 at 11:16 am #194409Hi David,
actually not. I actually did not want to add a Swift slider. You are a genius, you gave me some hints and now I got it. I figured out how to get a text box into the Swift slider text box that the text shows on the left hand side as well. Yeah! Thanks so much David, highly appreciate it 🙂
That problem solved. To resize background images in a row for iPad the code I got works on the browser resize, but not on my iPad!
That’s the code I got. I added it to the http://www.anettewildphotos.com/limited-edition-prints/, I will add now the Swift slider page and underneath is a second row with background image that does not resize properly for iPad.
How can I add breadcrumbs into a Swift Slider?@media (min-width: 768px) {
.my-custom-class .spb_parallax_asset {
background-position: 70% 0!important;
}
}Cheers Anette
July 14, 2015 at 11:28 am #194414Hi Anette,
Pleasure to help out!
I am afraid there is not a way to add breadcrumbs into the slider as such. I am not sure a work around either other than to use the page builder to insert the slider then insert the breadcrumbs above that asset.
Thanks,
David.July 14, 2015 at 11:31 am #194416Thanks a lot David, the Swift Slider does not resize properly on iPad either. What code can I add to css to solve this?
Ciao Anette
July 14, 2015 at 12:03 pm #194436Hi David,
I had to set the pages back as they were before, looks better with layout and all.
I inserted the resize css (see screenshot) for the 2 row background images in my two pages that style. They do resize the images on the browser, but not on my iPad.
I cleared cache and history on iPad, that did not change anything, sadly. Any solution?
See screenshot of the css for the images, please.PS. I have added my-custom-class to the row options which have a background image set!
Ciao Anette
Attachments:
You must be logged in to view attached files.July 14, 2015 at 4:20 pm #194559Hi,
Ah yes I see, I have adjusted the media query and this is now working on re-size.
@media (min-width: 768px) { .my-custom-class.spb_parallax_asset { background-position: 70% 0!important; } }
Thanks,
David.July 14, 2015 at 4:25 pm #194562Thanks so much David, looks like it was my mistake with inserting the CSS 🙂
Sorry for that. I thought all goes in one line! Still learning 🙂
Now all solved, yeahTHANKS A MILL
Wish you a great day
Ciao Anette
July 14, 2015 at 6:02 pm #194596Hi Anette,
Great to hear!
Best,
David. -
Posted in: Atelier
You must be logged in to reply to this topic.