Phil Ewels

Hi @rarcher30,

I started writing a response saying that I’m not keen on adding functionality on top of the Bootstrap core code, however the link you posted to looks pretty good. If you could add an issue on the GitHub repo (https://github.com/ewels/cpt-bootstrap-carousel) then I (or someone else) could look into adding this as an opt-in option to include. It shouldn’t be too tricky I think.

I should warn that I don’t really do much web dev these days and have been pretty terribly at maintaining the plugin over the past couple of years, so it may be a while till I get to it myself. If you fancy submitting a PR then I’d be happy to merge though.

Cheers,

Phil

Hi @thewestharbour,

Sorry for my delay in replying. I think that currently, this isn’t possible. However it shouldn’t be too difficult to do and I think it’s a good idea. I haven’t worked on the plugin myself for ages now (I don’t do so much web dev these days), but if you fancy having a go then the code is all open source at https://github.com/ewels/cpt-bootstrap-carousel

Otherwise, please add an issue there and I’ll try to get to it one day ??

Phil

Hi @jimgasperini,

Apologies for my long delay in replying. Did you get anywhere with this problem? If I’m honest, it sounds like a problem with the webserver in serving up the images, and not really to do with this plugin.

I’ll mark this as resolved now, but let me know if I can be of any help.

Phil

Hi @fitfeline,

Apologies for my delay in replying, I’ve been away travelling for a bit and have been a bit slow in my support for this plugin (I haven’t used it myself in years now).

Did you resolve this problem in the end? Scrolling up usually suggests that there’s a problem with the javascript in your page – the buttons are links to a section in the page, so that’s their default behaviour if the JS isn’t catching the click events.

I’ll mark this as resolved now, but feel free to come back if I can be of any help ??

Phil

Hey,

The bootstrap site has a customise page where you can download specific parts: https://getbootstrap.com/customize/

Just untick all of the CSS and JS apart from the Carousel and you should be fine.

Note that you need JavaScript and CSS for the carousel to work properly. There’s a risk that there could be name collisions in the CSS if you import this as well as what you have in the current site. For this reason it could be worth looking elsewhere for a carousel plugin.. You have been warned! ??

Phil

Hi there,

I’m looking at this on my phone so I can’t be sure, but it looks like your site isn’t built with the Bootstrap CSS / JS framework. This plugin depends on that, so it won’t work without it (you’ll just see the raw HTML, which is what you see).

See the plugin front page for more information. Let me know if I’m wrong and you are using bootstrap and I’ll look into it more.

Phil

Nice work getting the carousel to work, looks like the Simple Share Buttons plugin is still broken on your site though. I would try to fix that before anything else, as it will be doing strange things to your site if some JavaScript is unable to execute as a result.

The CPT Bootstrap Carousel plugin works by creating a WordPress Custom Post Type. Deactivating the plugin stops the carousel from loading but doesn’t delete the posts that you’ve created. You can delete them manually whilst the plugin is activated, but I don’t think it does any harm to keep them around when the plugin is deactivated / uninstalled. Note that removing the shortcode from the page will also remove the carousel.

Phil

Hi @geekattri,

It looks like you have some errors in your JavaScript which are not related to the plugin. These are stopping any JavaScript from running, including the carousel. Take a look at the developer tools to see them – once fixed the carousel should work.

These are the key ones:

jquery.mobile.customized.min.js?ver=4.6.1:1 Uncaught TypeError: Cannot set property 'touchstart' of undefined
(index):205 Uncaught TypeError: jQuery(...).superfish is not a function

Phil

• This reply was modified 8 years, 5 months ago by Phil Ewels.

Hi Maurizio,

The source code for the site looks weird – you have <pre> and <code> tags in there. My guess is that you copied the shortcode in to your page from the plugin page and that it kept it’s appearance as code. If you check the HTML view of the page instead of the raw formatting I bet you’ll see some HTML tags around the shortcode. If you delete these then you’ll probably be fine.

Phil

Hi @thewestharbour,

I had a quick look at your site yesterday but couldn’t see anything obviously wrong. To be honest, if you have the same problem with the non-plugin version then it’s almost certainly nothing to do with the code here. Often these kinds of things are caused by CSS name clashes, or JavaScript clashes. As the problem isn’t plugin specific, you might have more luck asking in a more general forum such as stack overflow (other than here, which is basically just me).

I’ll take another more in depth look when I get a chance. Let me know if you find the solution.

Phil

Hi Diego,

Sorry for being slow to respond – great that you got it working! Yeah this is the only downside of WordPress with its hundreds of plugins, lots of things affect each other and it can be super tricky to track down what’s causing what.

Anyway, nice work!

Phil

Hi nusa,

How did the carousel look before? Was it taller? There’s a gap because the images aren’t as wide as the page (try making your browser window smaller, then there’s no gap).

It looks like the source images themselves are big enough when opened by themselves. I think the problem is a cheeky sizes="(max-width: 900px) 100vw, 900px" which is creeping into the image tags. The plugin isn’t doing this, it gets this code from a core WordPress function. It could be a new / different setting when you set the featured images – maybe check that these are set to use the full size images?

Sorry, can’t be much more help than this as I think it’s something else that’s causing the problem.. Let me know if I can do anything else.

Cheers,

Phil (the developer)

ps. Cool site! I was in Denpasar and Ubud last summer, gorgeous part of the world – I’m jealous!

pps. Some slightly weird stuff going on in your HTML – might be worth checking that you have tags in the right place in your templates. eg. This yoast code should be inside the <head> section (not at the top where it is now):

<title>nusa mag | nusa </title>
<!-- This site is optimized with the Yoast SEO plugin https://yoast.com/wordpress/plugins/seo/ -->
<meta property="og:image" content="https://nusasurfwear.com/wp-content/uploads/2015/08/THUMBNAILS-FOR-FACEBOOK.jpg" />
<!-- / Yoast SEO plugin. -->

Also this code should be in <body> instead of inside <head> where it is now:

<div class="container" style="text-align:right">
<a href="https://nusasurfwear.com/eshop/quick-order" target="_blank"><img src="https://nusasurfwear.com/images/icon-cart.png" title="eshop cart"style="width:33px;" />cart</a> &nbsp;
<a href="https://nusasurfwear.com/eshop/my-account" target="_blank">sign in</a></div>

Hi pizzapie79,

I’m not totally sure about what you’re asking, but you can remove the carousel dots by hiding them with some custom CSS:

.carousel-indicators {
  display: none;
}

See https://getbootstrap.com/javascript/#carousel for the HTML markup that is used with the carousel.

Hope this helps!

Phil

Hi advancedigitalinc,

Short answer is – you can’t.

Longer answer is – you can, by customising the bootstrap slider. Try googling “bootstrap carousel fade instead of slide” – there are quite a lot of posts on this topic. For instance, I see no reason why this solution wouldn’t work (switching .carousel-fade for .carousel in the CSS). However, these kinds of customisations are outside of what the plugin does.

Hope this helps!

Phil

Thanks for the constructive feedback!