[Pro] Help with Owl- I will pay you

Freeway
1

’m using Owl Carousel for some quotes on a website I am building and I can’t seem to get this version to work. I’ve used Version 1 on another site: http://www.aroundgtown.com and it works great. Everything is set up according to the instruction. Help!

You will find the carousel here: http://smartytest.com/Sarah/index.php

Click “Press” or scroll to “People are Talking”

Anyone if you can help.

Billy

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

2

You have two JavaScript errors in this page. One is from mc-validate.js, line 189. The other is from jquery.cycle2.js, line 659. You also have a bunch of security errors from Facebook and Twitter and Lightwidget. These scripts assume that you are running the page in a HTTPS (secure) context, and they cannot do what they are asked without that.

What I recommend that you do first, before anything else, is make a new Freeway document with one page in it, add the Owl Carousel to that page, and most importantly, don’t put a single other thing on the page. No Facebook widgets, no nothing. Just the barest of what is needed to make the Owl work. See if that works.

If that works, then add things from the other document one at a time until you find what breaks it. That will tell you what you need to do. My sincere belief is that you will find that Owl works fine in isolation, and that there is something that it cannot work alongside.

Walter

On May 3, 2018, at 10:06 AM, billy kimmel email@hidden wrote:

’m using Owl Carousel for some quotes on a website I am building and I can’t seem to get this version to work. I’ve used Version 1 on another site: http://www.aroundgtown.com and it works great. Everything is set up according to the instruction. Help!

You will find the carousel here: http://smartytest.com/Sarah/index.php

Click “Press” or scroll to “People are Talking”

Anyone if you can help.

Billy

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

3

Thank you that.

Billy

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

4

Ok so I created a new page without anything but the Owl Carousel and it doesn’t work.
http://www.smartytest.com/Sarah/test.html

I had no problem with Version 1, worked like a charm.

http://www.aroundgtown.com

This is the install instruction: Installation | Owl Carousel | 2.3.4

Billy

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

5

Try adding the owl-theme class to your owl-carousel element. Also put some more elements inside, by default it appears to want to show three at a time. You can change that by adding to the jQuery call that initializes it:

$(".owl-carousel").owlCarousel({items: 1});

Walter

On May 3, 2018, at 8:03 PM, billy kimmel email@hidden wrote:

Ok so I created a new page without anything but the Owl Carousel and it doesn’t work.
http://www.smartytest.com/Sarah/test.html

I had no problem with Version 1, worked like a charm.

http://www.aroundgtown.com

This is the install instruction: Installation | Owl Carousel | 2.3.4

Billy

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

6

There’s a ton of options you can set that way:

https://owlcarousel2.github.io/OwlCarousel2/docs/api-options.html

Walter

On May 3, 2018, at 8:03 PM, billy kimmel email@hidden wrote:

Ok so I created a new page without anything but the Owl Carousel and it doesn’t work.
http://www.smartytest.com/Sarah/test.html

I had no problem with Version 1, worked like a charm.

http://www.aroundgtown.com

This is the install instruction: Installation | Owl Carousel | 2.3.4

Billy

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

7

Last point here, you have added the configuration options after the call to the owlCarousel() method. You need to put these options inside the call itself. Where you have this:

$(document).ready(function(){
  $(".owl-carousel").owlCarousel();
  loop:true;
});

You should have:

$(document).ready(function(){
  $(".owl-carousel").owlCarousel({
    loop: true
  });
});

If you have more than one option to set, you need to separate them by commas, like this:

$(document).ready(function(){
  $(".owl-carousel").owlCarousel({
    loop: true,
    items: 2
  });
});

Walter

On May 3, 2018, at 9:13 PM, Walter Lee Davis email@hidden wrote:

There’s a ton of options you can set that way:

Options | Owl Carousel | 2.3.4

Walter

On May 3, 2018, at 8:03 PM, billy kimmel email@hidden wrote:

Ok so I created a new page without anything but the Owl Carousel and it doesn’t work.
http://www.smartytest.com/Sarah/test.html

I had no problem with Version 1, worked like a charm.

http://www.aroundgtown.com

This is the install instruction: Installation | Owl Carousel | 2.3.4

Billy

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

8

Thank you for all of this. Didn’t know about the comma between options.

I’ll try this on the morning.

Billy

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

9

Hey Walter,
The carousel now works!
Interestingly if you look on the Owl Carousel website at the docs, they have stated the brackets incorrectly in the “call to script” Once I change that from your example it all worked.

Now I want to have a video carousel on the same page. Do I need to the give the carousel a unique class different from the other.

For example my first carousel class is owl-carousel"
So the second one… "owl-carousel2 ?

Of course then adding the video option code.

Billy

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

10

No, they say quite often in the docs that the owl-carousel class is required. I would not change that. Each one will be self-contained. As a bit of HTML knowledge: classnames can be repeated within a page. You could have one or twenty-one carousels on the page, all with the same classnames, and this would be a valid page. But IDs cannot repeat within a page. If you wanted two different carousels to have two different sets of settings (one auto-move, the other not) then you would use the ID of the element to trigger the owlCarousel() method in JavaScript. (Leave the class="owl-carousel" part in your page!) But then something like this to initialize them:

$('#owl_one').owlCarousel({ some settings here });
$('#owl_two').owlCarousel({ other settings here });

Walter

On May 4, 2018, at 11:18 AM, billy kimmel email@hidden wrote:

Hey Walter,
The carousel now works!
Interestingly if you look on the Owl Carousel website at the docs, they have stated the brackets incorrectly in the “call to script” Once I change that from your example it all worked.

Now I want to have a video carousel on the same page. Do I need to the give the carousel a unique class different from the other.

For example my first carousel class is owl-carousel"
So the second one… "owl-carousel2 ?

Of course then adding the video option code.

Billy

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

11

I didn’t explain this all the way through. Unlike classnames, no two things on the page can have the same ID. (Freeway won’t let you, but the spec also says such a page is invalid.) This is helpful if you want to address individual items on the page from JavaScript and need to give each one a different behavior.

When you use jQuery, you use CSS notation to describe what you are trying to change. So this:

$('.foo')

accesses everything on the current page that has the classname ‘foo’ applied to it. A preceding dot in the CSS selector means “class”. Conversely, this:

$('#bar')

accesses the one and only thing on the current page that has the ID ‘bar’ applied to it. As you’ve no doubt guessed, a preceding octothorp means “id”.

If you use Prototype.js, then there are two different accessors to find single (id-based) or multiple (any CSS you can think of) page elements:

$('some_id')
$$('.foo > a[title*="wibble"]')

You can do the latter trick with crazy-deep CSS selectors in jQuery, too; it’s not just for classnames.

Walter

On May 4, 2018, at 11:31 AM, Walter Lee Davis email@hidden wrote:

No, they say quite often in the docs that the owl-carousel class is required. I would not change that. Each one will be self-contained. As a bit of HTML knowledge: classnames can be repeated within a page. You could have one or twenty-one carousels on the page, all with the same classnames, and this would be a valid page. But IDs cannot repeat within a page. If you wanted two different carousels to have two different sets of settings (one auto-move, the other not) then you would use the ID of the element to trigger the owlCarousel() method in JavaScript. (Leave the class="owl-carousel" part in your page!) But then something like this to initialize them:

$('#owl_one').owlCarousel({ some settings here });
$('#owl_two').owlCarousel({ other settings here });

Walter

On May 4, 2018, at 11:18 AM, billy kimmel email@hidden wrote:

Hey Walter,
The carousel now works!
Interestingly if you look on the Owl Carousel website at the docs, they have stated the brackets incorrectly in the “call to script” Once I change that from your example it all worked.

Now I want to have a video carousel on the same page. Do I need to the give the carousel a unique class different from the other.

For example my first carousel class is owl-carousel"
So the second one… "owl-carousel2 ?

Of course then adding the video option code.

Billy

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options