Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

Support thread for Specials carousel with Ribbon v2.3.4.1 CE


Recommended Posts

27 minutes ago, valquiria23 said:

Dear Zahid, good morning!!

It was 1 Special item that did not appear. I deleted it and loaded another one and now it shows me all the selected items correctly. No idea what happened ...

Where do I have to put that code in the ext / directory?

I am also using the Carousel addons:

Product_info_Carousel_Fade

Cataloge - JC-Carousel

Best regards

Valqui

 

No these all use Bootstrap not Owl, Only the 3 zip files use Owl js

 

Link to comment
Share on other sites

  • Replies 85
  • Created
  • Last Reply

thank you very much Zahid,

Where do I have to put that code in the ext / directory or only I have to use the new file?

 

<!-- Important Owl stylesheet -->

<link rel="stylesheet" href="/ext/owl-carousel/owl.carousel.css">

<!-- Default Theme -->

<link rel="stylesheet" href="ext/owl-carousel/owl.theme.css">

<!-- Include js plugin -->

<script src="ext/owl-carousel/owl.carousel.js"></script>

<!-- jQuery 1.7+ -->

<script src="ext/jquery/jquery-3.1.1.min.js"></script>

:heart: Community Oscommerce fan :heart: You'll find the latest osC community version here.

 

Link to comment
Share on other sites

First go to admin / modules/ heder_tags    and check for jQuery Owl Carousel v1.3.3  if it is installed turn it off and  unistall it as its probably not working as it should.

Then go to ext/  and check that you have all the directorys with files shown , you should have them but  just make sure path is corect. That should be all, now they should work with no issues with other scripts running.

ext/owl-carousel/owl.carousel.css

ext/owl-carousel/owl.theme.css

ext/owl-carousel/owl.carousel.js

ext/jquery/jquery-3.1.1.min.js

 

Link to comment
Share on other sites

  • 2 months later...
vor 1 Minute schrieb valquiria23:

This addon needs the Community Bootstrap Edition version v2.3.4.1 CE, it does not work for the standard version.

i don't have this ... oki .... easy come easy go .... 😉

Link to comment
Share on other sites

Using more than one owl carousel can cause conflicts on some websites. This is mainly due to the scripts being loaded more than once by each carousel.

To be honest I did not consider that more than one would be used on the same site!

A simple solution is to remove the script from each add-on and simply install it once as a footer script. This will then hopefully prevent any conflicts.

On my add-on’s simply go to the template file and find this code and remove or comment out.

<head>
       <!-- Important Owl stylesheet -->
    <!--<link rel="stylesheet" href="/ext/owl-carousel/owl.carousel.css">-->
     
    <!-- Default Theme -->
   <!-- <link rel="stylesheet" href="ext/owl-carousel/owl.theme.css">-->
     
    <!--  jQuery 1.7+  -->
    <!--<script src="ext/jquery/jquery-3.1.1.min.js"></script>-->
     
    <!-- Include js plugin -->
    <!--<script src="ext/owl-carousel/owl.carousel.js"></script>-->
	</head>

Then simply install the JcM Owl Header Tags , header_tags addon and turn on. The carousels should now work with out any funny overlaping of text and images.

If you have other carousels using Owl then they too will conflict if they are loading the script a second time! Turn it off and see if it fixes the problem, if it does then remove the script from the add-on as well.

Please note this is just for the scripts listed in the code above.

JcM Owl Header Tags.zip

 

Link to comment
Share on other sites

Sorry was error in Header Tags file. Use the updated one bleow.

It would appear that owl carousel has issues when more than one is running on the same site. The header Tags will only fix this if no other owl carousel is running with script being loaded locally.

However what I have found is if I remove the script from the header altogether I can load as many as I like with the script locally and they work fine with no text over images!

JcM Owl Header Tags-V1.2.zip

 

Link to comment
Share on other sites

I have looked into this display issue quite a bit now and sorry bu thave not been able ot find a stable fix for this. The problem is that owl carousel no matter which version you use

( I have recoded the addon to use the latest 2.3.4 version of owl and it still behaves the same) has no built in equal heights function. This is a known issue with no date for fix.

Several people have found a way to get round this mainly by using some sort of custom function but none appearer to work in a stable manner.

The problem is caused when you try to display several items which are of different in size. In osC this is caused by the product name being of different lengths or images sizes not being the same.

 

The description can also be an issue if it is too short! Long descriptions are cropped to 40 words or letter.

image.png

 

So if you are having this issue then your options are.

 

1) Don’t use the add-on. Sorry but I don’t have a fix currently or time to make a fix.

 

2) Keep using it and accept the fact that occasionally it look odd on some displays

 

3) remove the equal heights function and let it display as normal. It will look like this ( this is owl 2.3.4 with equal heights removed).

image.thumb.png.fef19c33c402651a9f612cb34f97a374.png

As you can see each box is a different size but all stay in the frame and it display fine with no issues.

4) If it's critical to your site then ask  a developer to make a fix for you. ( Not me I'm not a developer)

So sorry but that’s as far as I was able to debug this in the time I have available. I will look at this again to see if I can get a fix using the new 2.3.4 owl carousel as this issupposed to be fully responsive so the fix should be possible, It may even be easy, perhaps I’m just not seeing it? If you have a fix feel free to post it.

 

 

Link to comment
Share on other sites

Ok may have found a solution! I came across a forum discussing this problem, They think its down to a cahe problem. The images and other content may be beeing loaded after the js script.

Simple solution is to change the function from $(document).ready(function() to

$(window).load(function()  this allows the images / content to load first before the jQuery loads.

So I have tested on one site and it worked! did over 20 reload / refreshes in 2 browsers and could not get images and text to overlay as before.

It needs to be done on all owl carousels for it to work. For my add-ons In each template file find the following line of code around line 147 ( shoud be the same in most others)

$(document).ready(function() {
  var owl = $("#i-featured-products");

Replace it with,

$(window).on("load",function() {
  var owl = $("#i-featured-products");

Remember line 2 will be different for each add-on.

Lets hope this fix works for your site also.

 

 

 

 

Link to comment
Share on other sites

The Add-on has been updated to use owl carousel 2.3.4 and include the above  display issue fix.

It no longer requires the owl_carousel 2.3.4 script to be loaded locally. These are now loaded to the header and footer using Header_Tags and use CDN rather than local install.

Owl requires the owl style sheets and jQuery to be loaded in a specific order to work properly. See the recommendations here

https://owlcarousel2.github.io/OwlCarousel2/docs/started-installation.html

If you are using any other add-on using owl it may cause issues if it’s not installed correctly.

It is still a no core change add-on.

Install and turn on both Header_Tags then simply install the other files and install and turn on the new add-on.

It has been tested on the v2.3.4.1 CE Only.

 

 

Link to comment
Share on other sites

Has been updated to fix error as i loaded up old files, they will work but just with default Owl2 settings.

Bug fix to make speed controls work.

If you want to edit then in template file,

Find line autoPlay: and copy it and replace autoPlay: with autoplayTimeout:

Find paginationSpeed: and replace with autoplaySpeed:

Find slideSpeed: and replace with navSpeed:

Find navigationText and replace with navText

 

 

Link to comment
Share on other sites

  • 2 weeks later...
  • 2 weeks later...
On 10/15/2018 at 11:06 PM, Owl Sauron said:

any chance of making this appear using the footer area (width) instead of the index one?

I'm not a developer, the add-ons I do are done for my site or just for fun! , but if you need it then simply post in the comercial section and I am sure one of the developers will be happy to help. Sorry but busy with other stuff at the moment.

 

Link to comment
Share on other sites

  • 1 month later...

@wanou Simply adding aditional language file will have nothing to do with your issue! Check your error log and post any error Also check your html out put to see what the code is producing.

Provide a bit more info and we may be able to help!

 

Link to comment
Share on other sites

@wanou I think you are geting confused this is the thread for the "Support thread for Specials carousel with Ribbon v2.3.4.1 CE" .

https://apps.oscommerce.com/dNLAv&amp;specials-carousel-with-ribbon-v2-3-4-1ce

I have checked and it is correct and as sould be. You are confusing this with the other add-on. JcM Specials % discount Card CE BS4/3

https://apps.oscommerce.com/VLp5Q&amp;jcm-specials-discount-card-ce-bs4-3

Please make sure to download the correct one for your needs. The thread for the one you were uisng is this

 

 

 

Link to comment
Share on other sites

  • 5 months later...

Hi @JcMagpie,

There's some warnings about the schema microdata.. In my case 8 warnings.

SKU, aggregateRating, description, brand, review, product ID and at offers it's missing url and priceValidUntil.

This also is happening at product_info page but I'm fixing the header tag module: ht_product_schema.php

Also have a question wouldn't be better to use JSON-LD instead microdata?

Link to comment
Share on other sites

Nothing to do with add-on.

Plus these are only warnings not errors, Google is always changing it's algorithm so don't be supprised you see warnings.

You can try to fix them if you can but not all can be fixed. Read more about it here.

https://rich-snippets.io/errors-and-warnings-on-googles-structured-data-test-tool/

 

Link to comment
Share on other sites

Actually this addon has microdata.. itemtype="http://schema.org/ItemList"

So probably search console will also throw warnings to who uses this addon.

I referrer the product_info because there's some warnings also there from  ht_product_schema.php but I'm at this moment fixing them.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...