Problem with boostrap slider caption after theme upgrade

This safed the day for me. I was really surprised when I took a look at the new design, because in the changelog there wasn’t anything about a bootstrap update. Ok, however, thank you Abigailm for this short introduction in CSS for me!!

Jonny

Hi,
@abigailm : I was asking just one question as this is not the first article that I found that gives a negative opinion to BootStrap.
I do not see why denigrate a framework more than another.

your article is in 2 parts: the pros and cons, points that can be applied to all the frameworks I see nothing there that makes me say that this is the best of the frameworks, Genesis would also make good and also bad, to name him.
I wonder finally account if the ideal is not a theme without association to a framework.

@noaneo: all in all, it’s hard to find a theme without Bootstrap now… And regarding this article, which I read a few days ago, it seems that bootstrap is forcing WordPress to work in the Boots’ way…

I’m not a expert in that framework stuff but then, why isn’t it easier to find themes working along wordpress and only wordpress?

@Booutterfly : Excuse me I did not understand your last sentence?

You think that most themes use a framework, I did not pay attention to it, to a site I use Hueman, methinks not use framework.
Not that the themes from https://themegrill.com are with a framework
Then the themes delivered with WordPress have no framework.
Without denigrating the work of the authors, because they do a fabulous job and we have free themes, a responsive theme is very difficult to encode, associate a framework is the easiest time, I understand it, one may learn making themes but not part Responsive.

Well, what I meant is that it’s hard to find themes without Bootstrap itself.

Actually, through my “wordpress training” I’m now at the “fastening my website” step and I was thinking whether having bootstrap (and specialy Evolve) was a break to my website speed or not since this is a heavy theme.

Anyway, as you said, it’s hard to make a website responsive and bootstrap makes it for you somehow!

By the way, I have no problem with bootstrap myself, I’m just trying to find the best match to have great features, responsivness and fast theme.

Hello everyone,

It’s been three hours I’m trying to get the bootstrap slider exactly as it was before.

Can anyone tell me what on earth do I need to add to the CSS manager in order to get it right ?

I have been trying a few things but it still doesn’t look as it was

https://www.leblocnotes.com

I would so grateful…

Thanks heaps

@chloericcardo –what specific elements are giving you problems? The width of the caption, or placement of buttons?

I was hoping that my posting of CC would help narrow down which elements need to be coded – no that people would copy my specs exactly.

Re the Bootstrap discussion above – the issues with layout on the “Bootstrap slider” have nothing whatsoever to do with Bootstrap. None of the layout items that I needed to correct are coded using Bootstrap conventions. I referred to “Bootstrap” in my question to distinguish this slider from the other slider options that are packaged with Evolve.

I think that the discussion about pros & cons of the Bootstrap framework probably belongs in another thread.

Hey Abigailm,

Well, you’re right! We kind of moved away from the purpose of this topic indeed!

Anyway, from my part, I’m not at the stage of customizing the banner yet but will soon be. And if it appears I use your code (which I’m unlikely to do), I’ll add a comment and refer to you as a thank you :).

@abigailm

Hi Abigailm,

Thank you so much for your concern.

I would like the bootstrap slider to look exactly as it was in the default version which is :

– No separation between the banners (#bootstrap-slider .carousel-caption and #bootstrap-slider .carousel-caption p) : the banner of the subtitle goes above the one of the headtitle. And the one of the headtitle takes nearly half of the slider.

– I would also like to have the arrows separated : the one showing the right on the right and the other one on the left.

I have tried to paste the code of the previous version in the Css manager window (“personnalize”) but it still would not work.

I am deeply sorry if it is not really clarly explained, as you would have noticed I am fairly new to wordpress.

Thank you again so much in any case !

I screenshoted the old version for you chloericcardo, it’d be easier, then, to have help! ??

@bobbutterfly : AWESOME !! Thank you so much ??

@chloericcardo -I understood what you want to do — I just thought that when you said you had spent 3 hours working on that you might have made some progress and I was wanting to know what was left to be done.

You can’t cut and paste the old CSS because some of the classes have changed:

Here’s what I remember from working on the problem:

#bootstrap-slider .carousel-caption controls the whole division, so you would use that class to set the size and color of the large rectangle. You should be able to get the width you want by fiddling around with width, margin, or padding properties.

#bootstrap-slider .carousel-caption h2 controls the section with the large print at the top — so that’s where you would set the color, font-size, etc.

#bootstrap-slider .carousel-caption p controls properties for the next line.

#bootstrap-slider a.button controls button placement. You’ll see from my CSS above that I got it where I wanted it to be by adding a float:right to put it to the edge of the div. I think that if you want to get it centered, you’ll have to first set it to be a block level element with display:block and then to get it centered you could try either text-align:center or set the left/right margin to “auto”.

The arrows are a little trickier, as they are entirely new — They are set with:
#bootstrap-slider .carousel-control &
.carousel-control.left &
.carousel-control.right

If you want them the same way as before, you’ll have to fiddle around with various positioning properties to get them placed properly.

I use Chrome and rely a lot on the Inspect Element features of the Chrome Developer Tools. If you have the server space, I’d suggest installing Evolve on a development site and fiddling around with the banner there until you figure out the coding.

I don’t know if you will get the banner exactly the same, but you should at least be able to get to a point where it is close enough for your satisfaction.

Hi @abigailm im using the evolve theme and I was wondering if you could help me implement qTranslate into the bootstrap slideshow so text can be in english and chinese fro the slide’s titles/subtitles/button.. could you do that?
I have a budget for this, but need someone I can trust that can do this…
Please reply to me directly if you can wpwork@visionear.com
Thank you

@manuki — I am sorry but I cannot offer you coding help. Have you already tested gTranslate already? I have Transposh installed on my site and the language changes carry through to the Bootstrap banner without a problem — so perhaps you simply need to change plugins.