Make slider smaller or reduce slider size
-
I’m creating a mockup site for a client at https://69.89.31.94/~agresou1/dummy2/ .
It’s still very rough, but client says slider is just too big. I can’t figure out how to reduce its size and have white space around it.Thanks,
Sydney
-
Try using a browser developer tool for this kind of exploratory CSS work.
I use Google Chrome’s built-in Developer Tool and it’s really easy to expose the webpage’s underlying HTML and CSS.Now that you know the style, from being exposed by the Developer Tool, you can add a new style to override it.
You ought to add new styles externally, not within the theme’s files. Changes to the theme’s files will compromise the theme and be compromised when the theme updates.
External changes can be made using a Child Theme or through a plugin that provides Custom CSS functionality.
I recommend using the Jetpack plugin and its Custom CSS functionality to hold your CSS modifications.
Thanks Andrew, but for some reason this theme is kicking my butt, so to speak. I may just be tired, but I really need someone to simply tell me where/what code changes the slider width. I am too tired this Monday to search any longer. So far, I found that if I move the slider from the main template area into the content area, it is a little smaller. Now I need to find out how to manipulate the content section to make it smaller or the slider to make it smaller, but I don’t want the whole site to get narrower by using the site options/layout editor.
Also, using Firefox’s developer’s tool, I can see the following:
flexslider .slides img {
width: 100%;
display: block;
}
body .content img {
max-width: 100%;
height: auto;
}
img {
height: auto;
border: 0px none;
vertical-align: middle;
}But these aren’t in the style sheet or in the RTL stylesheet.
Help!Why are you looking in the stylesheet for them?
Well, hm, they look like CSS code to me. Where should I look? Again, I’m not being cagey or coy. I just need help. If you can tell me how to make the slider or the content narrower, Andrew, then please just direct me as to how to do that. Asking me a question like that isn’t too helpful. I should add that I’m not a “real” website developer; I only dabble and ususally for people I know who know my limitations. Though, having said that, I’ve had great success with ripping apart simpler WP themes and making them look completely different. For some reason, that’s my skill. But this time, I didn’t want to rip the theme apart, I just wanted to use it. And I can’t figure out how to do this one thing that would make the client happy. So can you help or not?
Thanks in advance,
SydneyAnd will a staff member check in here and answer my question at some point, or . . . ??
And I do use child themes, but this was just a quick mockup to show client that turned into not so quick. I will reinstall and use child theme at appropriate time, but I will still need to know how to change slider size.
The browser developer tool should only be used to expose the CSS.
You don’t need to then go fishing for that CSS in its original file. You already have enough information to create a new style and override it.Moderators do roam the forums regularly, there’s a good chance they’ll see your thread. There are no staff, what do you mean by this?
Sorry, but for this theme, if I don’t put the new style in the stylesheet since I don’t see the code there, then where do I put it? Please, no rude response as to where to put it! ??
Andrew, I just want to make it smaller. Do you know how or not?
Also, I am sure I saw “staff” written on some people’s ids on responses elsewhere in the forum when I was looking for the answer, but I was tired last night and am very possibly wrong.Sydneyjbg, you don’t need to worry about a rude response. Volunteers in www.remarpro.com forums are always pushing for a nice atmosphere.
I recommend using the Jetpack plugin and its Custom CSS functionality to hold your CSS modifications.
I do know how to make the slider smaller.
Maybe there are staff actually, but not in the sense of paid staff. They’re still volunteers.
Hi sydney.
I’ve made a site before using flex slider,
Here is the css class you need to change
.fslider { background: rgba(255, 255, 255, 0.4); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4); -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; padding: 5px; width: 200px; }
You need to mess around with the width of the css properties in the slider.
and andrew, awnser the guys question, I think thats the message he is trying to imply
Thanks Danny. I have to run to a meeting, but when I get back, I’ll look for .fslider and start tinkering.
Much obliged. It is in the rtl.css, is that right? Because there’s almost no code in the style.css.
Andrew, you just said in your post “I do know how to make the slider smaller” but you still didn’t tell me. You’re just messing with me, right? Hoping I’ll hurl my coffee cup at my computer screen.
Cheers!!
It’s important you know where to put the style before you have it, really it is. This is to avoid the possibility that your changes will erase when you update the theme.
Andrew, with all due respect, I already told you this was a quick mockup and that I would be using a child theme and redoing this later. I just need to make the slider smaller. [Moderated negative comment.]
I think its in the javascript file, The stylesheet that comes with the file when you download it. Have a look around.
thanks
@sydneyjbg – you may want to visit the dedicated forums for Pagelines — as they should be able to give you specific help. From what I’ve seen, Pagelines works a bit differently from most WP themes.
Also, please remember that everyone here offering help is a volunteer — freely giving his/her time. If the help is not what you need, just ignore it, but please refrain from negative personal remarks.
Thanks, WPyogi, point taken and received. I will behave. Just getting a tad frustrated with why someone would keep taking the time to respond without actually responding.
I did start with pagelines itself, but for the free WP theme, they directed me here to this area of WP.
I know Danny has pointed me in the right direction. I just haven’t had a chance to look there yet.
Thanks again, and I do appreciate all the help.
- The topic ‘Make slider smaller or reduce slider size’ is closed to new replies.