Homepage › Community Forums › inSync Theme Support › InSync Demo Image in Slider
Tagged: slider inSync
How can I change out the demo image in the InSync slider? When I add my own photo via a widget in the slider area, my photo just sits atop the demo photo. My photo is sized exactly as the demo photo. I see the demo photo in the css code, but unable to determine how to switch out. Any feedback would be greatly appreciated as I’ve been trying to resolve for four days.
Thanks much,
Do you have FTP access? If so, you can upload the image there and then link to it by replacing the slider image with it.
If not, you could use the Media uploader in your WP Admin and upload the image there. Just make sure it’s uploaded at the full/large size, and then grab the link from there.
Thank you, Wes. I still don’t know where to add the link. I uploaded the full size photo via the Media uploader from the beginnin – same size as the demo photo. Can you tell me where to enter the link and remove the link to the demo photo? That is the gist of my question. An empty text widget in the Slider position places the demo photo in but the text widget is blank so how do I remove the link? If I add a link to my photo it just sits atop the demo photo. So where do I enter the link for my photo and where do I remove the demo link? I’m not getting something about this.
Let me add, when I first tried to resolve this I tried linking to my photo via CSS and also tried doing so using html in the Slider text widget and neither of those worked. There are no slider settings in my dashboard, so where should I be doing this?
Once you click the image you want to use in your Media, there should be a URL section to the right. You can use that link to add in your CSS.
You mentioned you already know where the link is in your CSS right?
Hi, Wes:
No, I do not have the correct place in CSS to link.
I attempted this a few days ago and it did not work. So please point me to the correct place in CSS.
The place in which I saw the demo photo in Slider CSS shows “slider-bg” I tried replacing with my photo link and it did not work
This is where I tried to change out:
.slider {
-webkit-background-size: cover;
-moz-background-size: cover;
background-attachment: fixed;
background-image: url(images/slider-bg.jpg);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
clear: both;
Try replacing images/slider-bg.jpg
with your new link.
That is what I have Wes (see below) and its not working: See http://hotrodmedia.com There is no photo showing:
.slider {
-webkit-background-size: cover;
-moz-background-size: cover;
background-attachment: fixed;
background-image: url (http://www.hotrodmedia.com/wp-content/uploads/2016/04/HRM-In-Sync-Home.jpg);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
clear: both;
}
Remove the space between url
and (
It should look like this –
background-image: url(http://www.hotrodmedia.com/wp-content/uploads/2016/04/HRM-In-Sync-Home.jpg);
You’re Welcome!