Genesis and WordPress Tutorials
by Sridhar Katakam 18 Comments Favorited: 3 times
In this article I show how we can set Soliloquy (commercial plugin) as background of Centric's first homepage section.
At lower widths, the text widget is set to drop below the slider thus ensuring that the solution is mobile responsive.
Edit home.js. Comment out or delete
To view the full content, please sign up for the membership.
Already a member? Log in below or here.
Find my tutorials helpful and wish to donate?
Please log in again. The login page will open in a new tab. After logging in you can close it and return to this page.
Centric use the background image for all pages in stead of color
do you know how to use different images for different pages ?
In Centric there is only 1 background image
do you also know how to add a background image to a page just the container for using it in a widget (featured page) more or less the same as in parallax theme
Hi Sridhar – I sent you an email via your contact form. I could REALLY use some help in getting this to work. I did get the slider to display (forgot to add the slider widget), but I want it to look like your example above. Opaque black with the slider images behind it and white text. I set the slider to accommodate my large images, but it is cutting the heads off on all of them. Can you please help?
Thanks very much!
The opaque black is a part of the images used in the slider itself. I shall reply to your mail now.
This works great. However, one problem I’ve not been able to solve is that, in Chrome, the header behaves strangely and scrolls off the screen. I would prefer it to stay on top when scrolling down the page. It does behave the way I want in both Firefox and IE. Any ideas on how I can do that?
I still haven’t figured out the underlying cause, but I discovered that the problem only occurs if the background image is set to fixed. Changing it to scroll fixed the problem. I confirmed with a clean install, as well.
I have tried your above tutorial, but my header (which includes my menu) scrolled off the screen as well.
How do I change the background image to scroll? I can’t find that option.
Great tutorial. Can you suggest how to add the Royal Slider instead – tried changing code but no luck
I do not have that plugin. If you can get the plugin author(s) to send me a copy via http://www.sridharkatakam.com/contact/ I can advise/write a tutorial.
Thanks so much Sridhar! Worked like a charm. Your WordPress and Genesis tutorials are the best…and much appreciated.
I just noticed that in my case, these changes are not responsive and the text flows way below the slider on mobile devices. Maybe I didn’t do something correctly. Here is where I tried it http://webdesignerstl.com/ Any ideas what i need to do to make it responsive? Thank you!
Just noticed the same issue.
confirmed, the slider with centric pro theme is not responsive. It pushes the site title up half way out of the browser and pushes the contents of the widget in header area 1 down when it should maintain the overlay on top of the slider.
can you fix this or tell me how please.
email me for the website it is located on
Great tutorial. Can you suggest how to add the Genesis Responsive Slider instead, in Centric Pro– I have added on my minimum pro, it works great, since you showed us both 2 Themes, Soliloqui and genesis responsive slider.
Thanks lot. You’re Super. I love your tutorials, since we’re members of studiopress for years.
I am doing a test site over on this domain (http://elevatechurchslo.vectorchurch.com), and the web version works fine with the new slider changes, but on mobile the slider disappears under the header. Any way you can look at it and let me know what you think?
I used this tutorial on http://mercerracewaypark.com and on the desktop it works fine, but at least on Android phones it does not seem to be working properly. The slider is small but appears about where I think it should, but the white text over-lay drops below it and is lost in a large white area. Can you help me figure out how to correct this?
I would like to use the text inside the actual slider description, how would I code this?
Thanks for this tutorial!
Would you mind sharing how to keep the text widget on top of the slider even on mobile devices? Thanks!
Comment out or delete http://pastie.org/pastes/10509959/text from step 3.