VirtueMart Forum

VirtueMart 2 + 3 + 4 => Templating & Layouts => Topic started by: ciriman on July 31, 2012, 12:00:34 PM

Title: [SOLVED] Arrows display pictures in popup (next and prev)
Post by: ciriman on July 31, 2012, 12:00:34 PM
in the new version installed you can not go forward or backward through the photos of the object. when I click a thumb, and I open the big picture, I would like to browse other photo with the arrow keys NEXT and PREV. Instead I have to close every time, and to click a new thumb. You can restore this function? remember that in the previous version of VM was present.
Title: Re: Arrows display pictures in popup (next and prev)
Post by: bytelord on July 31, 2012, 13:26:18 PM
Hello,

This does not exist in VM 2 and you can do it inside your template with custom code or you can use the following free code in that post.
http://forum.virtuemart.net/index.php?topic=105482.0;topicseen

Regards
Title: Re: Arrows display pictures in popup (next and prev)
Post by: ciriman on July 31, 2012, 15:00:55 PM
i tryed to use the solution in your link, but i don't want the slideshow in a page but only the "next prev" buttons in image popup! i can't resolve this.. you can find a solution whit this script?
Title: Re: Arrows display pictures in popup (next and prev)
Post by: bytelord on July 31, 2012, 17:08:12 PM
Hello,

You can modify the code above and hide the area with the slider buttons. I don't use the above code so to be able to make that changes for you but you can try. I think some small PHP and CSS changes will have the results you want (or just comment the part of the source you don't need).

After that you can use jquery, if you are familiar with js, and build a small image gallery as you want it.

Thanks
Title: Re: Arrows display pictures in popup (next and prev)
Post by: ciriman on July 31, 2012, 18:38:14 PM
if you could help me I would be very grateful. I use a modified file default_images.php for my site, you might see if you can implement what we need to work as servants to me? Only you can go to the next or previous image when you view a larger image in pop-up (like in old version of VM)

[attachment cleanup by admin]
Title: Re: Arrows display pictures in popup (next and prev)
Post by: www.vn-boom.com on August 01, 2012, 10:19:04 AM
I think this extension can help you: easy to use: http://forum.virtuemart.net/index.php?topic=105482.0
Title: Re: Arrows display pictures in popup (next and prev)
Post by: ciriman on August 01, 2012, 10:26:53 AM
Quote from: www.vn-boom.com on August 01, 2012, 10:19:04 AM
I think this extension can help you: easy to use: http://forum.virtuemart.net/index.php?topic=105482.0

bytelord have just suggested in previous post; thank you anyway.. i've find many problems with this script because i want only the arrows in image popup, not a slide in item page like this. I need only a "next - Prev" button in image popup!
Title: Re: Arrows display pictures in popup (next and prev)
Post by: bytelord on August 11, 2012, 23:29:40 PM
Hello ciriman,

Sorry taking to long to respond.
You can find an example with exactly what you want on that specific post from user Gruz.
http://forum.virtuemart.net/index.php?topic=97365.msg322269#msg322269

It uses jquery fancybox that already exists in assets VM folder.

I have place that code inside default_images.php and have attached below so you can place it inside your custom template.


Hope it helps.

Regards,

BL

[attachment cleanup by admin]
Title: Re: Arrows display pictures in popup (next and prev)
Post by: ciriman on August 13, 2012, 10:42:32 AM
thanks a lot! Thanks for taking your time to help me. I hope we can create a more automatic way to solve this problem. I hope to be re-integrated into the original script because the best solution to display all the photos for an article!
Thank you so much again. The best things.
Title: Re: Arrows display pictures in popup (next and prev)
Post by: techmodule on August 15, 2012, 04:03:40 AM
Quote from: bytelord on August 11, 2012, 23:29:40 PM
Hello ciriman,

Sorry taking to long to respond.
You can find an example with exactly what you want on that specific post from user Gruz.
http://forum.virtuemart.net/index.php?topic=97365.msg322269#msg322269

It uses jquery fancybox that already exists in assets VM folder.

I have place that code inside default_images.php and have attached below so you can place it inside your custom template.


Hope it helps.

Regards,

BL
dear
i use your file, and i upload to my webiste
But when i click to the picture, the browes will open new tab to show the pic?
Plz check again for me
Title: Re: [SOLVED] Arrows display pictures in popup (next and prev)
Post by: bytelord on August 15, 2012, 12:29:19 PM
Hello techmodule,

The code is working fine, could you please first check inside your template where is your asset folder and secondly try this with the default VM template because may be JavaScript is been overridden.

Which version of VM do you have?
Title: Re: [SOLVED] Arrows display pictures in popup (next and prev)
Post by: techmodule on August 15, 2012, 12:40:16 PM
Quote from: bytelord on August 15, 2012, 12:29:19 PM
Hello techmodule,

The code is working fine, could you please first check inside your template where is your asset folder and secondly try this with the default VM template because may be JavaScript is been overridden.

Which version of VM do you have?
Thank you for your responding
I use VM2.08
When i copy your file, and overwrite to the component/com_virtuemart/views/productsdetail/tmpl/
When i click to the thumail, the new blank will be oppened, not the lightbox
Plz check again and tell me the additional opption to run it
Title: Re: [SOLVED] Arrows display pictures in popup (next and prev)
Post by: techmodule on August 15, 2012, 13:01:46 PM
Quote from: bytelord on August 15, 2012, 12:29:19 PM
Hello techmodule,

The code is working fine, could you please first check inside your template where is your asset folder and secondly try this with the default VM template because may be JavaScript is been overridden.

Which version of VM do you have?
Dear
Plz check my web http://vinaplaza.vn/index.php/binh-dung-nuoc-rua-tay/loai-nut-bam/binh-dung-nuoc-rua-tay-tmyg-810-detail
And now, i read some topics, and i guess i have to turn on the JavaScript, right?
Can you guild me
Thank you
Title: Re: [SOLVED] Arrows display pictures in popup (next and prev)
Post by: bytelord on August 15, 2012, 13:14:49 PM
Hello,

You use a custom template from JA and i dont't know how to guide you exactly. Taking a look on your web site you load the following scripts. I can see that you are loading twice the jquery, one from google and one from your custom template. could you please disable on of them. Also i don't know how is your template structure because is a custom one. You can test first the code with the default vm template and if is working disable this line from your template options somewhere
<script src="/templates/ja_elastica/js/jquery/jquery-1.6.4.min.js" type="text/javascript"></script>

Also on site loading i am getting that error:
QuoteTypeError: $("a.gallery").fancybox is not a function
[Break On This Error]    

jQuery(document).ready(function($) { $("a.gallery").fancybox(); });

so there is something wrong with your template.


Your script files you are loading in product details page:

<script src="/media/system/js/mootools-core.js" type="text/javascript"></script>
<script src="/media/system/js/core.js" type="text/javascript"></script>
<script src="/media/system/js/mootools-more.js" type="text/javascript"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
<script src="/components/com_virtuemart/assets//js/jquery.noConflict.js" type="text/javascript"></script>
<script src="/components/com_virtuemart/assets//js/vmsite.js" type="text/javascript"></script>
<script src="/components/com_virtuemart/assets//js/facebox.js" type="text/javascript"></script>
<script src="/components/com_virtuemart/assets//js/vmprices.js" type="text/javascript"></script>
<script src="/media/system/js/modal.js" type="text/javascript"></script>
<script src="/components/com_virtuemart/assets/js/fancybox/jquery.fancybox-1.3.4.pack.js" type="text/javascript"></script>
<script src="/plugins/system/jat3/jat3/base-themes/default/js/core.js" type="text/javascript"></script>
<script src="/templates/ja_elastica/js/mega.rjd.js" type="text/javascript"></script>
<script src="/templates/ja_elastica/js/jquery/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="/templates/ja_elastica/js/jquery.masonry.js" type="text/javascript"></script>
<script src="/templates/ja_elastica/js/jquery.mediaqueries.js" type="text/javascript"></script>  <--- i don't know what that is!
<script src="/templates/ja_elastica/js/menu/mega.js" type="text/javascript"></script>
<script type="text/javascript">
Title: Re: [SOLVED] Arrows display pictures in popup (next and prev)
Post by: techmodule on August 15, 2012, 13:25:56 PM
Quote from: bytelord on August 15, 2012, 13:14:49 PM
Hello,

You use a custom template from JA and i dont't know how to guide you exactly. Taking a look on your web site you load the following scripts. I can see that you are loading twice the jquery, one from google and one from your custom template. could you please disable on of them. Also i don't know how is your template structure because is a custom one. You can test first the code with the default vm template and if is working disable this line from your template options somewhere
<script src="/templates/ja_elastica/js/jquery/jquery-1.6.4.min.js" type="text/javascript"></script>

Also on site loading i am getting that error:
QuoteTypeError: $("a.gallery").fancybox is not a function
[Break On This Error]    

jQuery(document).ready(function($) { $("a.gallery").fancybox(); });

so there is something wrong with your template.


Your script files you are loading in product details page:

<script src="/media/system/js/mootools-core.js" type="text/javascript"></script>
<script src="/media/system/js/core.js" type="text/javascript"></script>
<script src="/media/system/js/mootools-more.js" type="text/javascript"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
<script src="/components/com_virtuemart/assets//js/jquery.noConflict.js" type="text/javascript"></script>
<script src="/components/com_virtuemart/assets//js/vmsite.js" type="text/javascript"></script>
<script src="/components/com_virtuemart/assets//js/facebox.js" type="text/javascript"></script>
<script src="/components/com_virtuemart/assets//js/vmprices.js" type="text/javascript"></script>
<script src="/media/system/js/modal.js" type="text/javascript"></script>
<script src="/components/com_virtuemart/assets/js/fancybox/jquery.fancybox-1.3.4.pack.js" type="text/javascript"></script>
<script src="/plugins/system/jat3/jat3/base-themes/default/js/core.js" type="text/javascript"></script>
<script src="/templates/ja_elastica/js/mega.rjd.js" type="text/javascript"></script>
<script src="/templates/ja_elastica/js/jquery/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="/templates/ja_elastica/js/jquery.masonry.js" type="text/javascript"></script>
<script src="/templates/ja_elastica/js/jquery.mediaqueries.js" type="text/javascript"></script>  <--- i don't know what that is!
<script src="/templates/ja_elastica/js/menu/mega.js" type="text/javascript"></script>
<script type="text/javascript">
Dear
You mean that i have to dissable the template's script?
Tell me what i need to dissable, some or all of them?
Title: Re: [SOLVED] Arrows display pictures in popup (next and prev)
Post by: techmodule on August 15, 2012, 13:36:50 PM
Quote from: bytelord on August 15, 2012, 13:14:49 PM
Hello,

You use a custom template from JA and i dont't know how to guide you exactly. Taking a look on your web site you load the following scripts. I can see that you are loading twice the jquery, one from google and one from your custom template. could you please disable on of them. Also i don't know how is your template structure because is a custom one. You can test first the code with the default vm template and if is working disable this line from your template options somewhere
<script src="/templates/ja_elastica/js/jquery/jquery-1.6.4.min.js" type="text/javascript"></script>

Also on site loading i am getting that error:
QuoteTypeError: $("a.gallery").fancybox is not a function
[Break On This Error]    

jQuery(document).ready(function($) { $("a.gallery").fancybox(); });

so there is something wrong with your template.


Your script files you are loading in product details page:

<script src="/media/system/js/mootools-core.js" type="text/javascript"></script>
<script src="/media/system/js/core.js" type="text/javascript"></script>
<script src="/media/system/js/mootools-more.js" type="text/javascript"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
<script src="/components/com_virtuemart/assets//js/jquery.noConflict.js" type="text/javascript"></script>
<script src="/components/com_virtuemart/assets//js/vmsite.js" type="text/javascript"></script>
<script src="/components/com_virtuemart/assets//js/facebox.js" type="text/javascript"></script>
<script src="/components/com_virtuemart/assets//js/vmprices.js" type="text/javascript"></script>
<script src="/media/system/js/modal.js" type="text/javascript"></script>
<script src="/components/com_virtuemart/assets/js/fancybox/jquery.fancybox-1.3.4.pack.js" type="text/javascript"></script>
<script src="/plugins/system/jat3/jat3/base-themes/default/js/core.js" type="text/javascript"></script>
<script src="/templates/ja_elastica/js/mega.rjd.js" type="text/javascript"></script>
<script src="/templates/ja_elastica/js/jquery/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="/templates/ja_elastica/js/jquery.masonry.js" type="text/javascript"></script>
<script src="/templates/ja_elastica/js/jquery.mediaqueries.js" type="text/javascript"></script>  <--- i don't know what that is!
<script src="/templates/ja_elastica/js/menu/mega.js" type="text/javascript"></script>
<script type="text/javascript">
Dear
I have changed my website to  Beez2 - Default
But that does not run http://vinaplaza.vn/index.php/binh-dung-nuoc-rua-tay/loai-nut-bam/binh-dung-nuoc-rua-tay-tmyg-810-detail
plz check it again for me
Title: Re: [SOLVED] Arrows display pictures in popup (next and prev)
Post by: bytelord on August 15, 2012, 13:48:16 PM
locate your asset folder inside your template and check if fancybox is existing, also please disable your template jquery loaded for second time or the vm original one from the BE.

That's the path for the vm asset folder: /components/com_virtuemart/assets/js/fancybox/jquery.fancybox-1.3.4.pack.js (this should exist)

Also please check inside your template VM asset folder is fancybox exists because as i told you i don't know how your template is working, obviously loading jquery for second time. For specific support for your template you should ask JoomlaArt. i suggest you to disable jquery loading from your JA template.

Hope it helps.
Title: Re: [SOLVED] Arrows display pictures in popup (next and prev)
Post by: bytelord on August 15, 2012, 13:50:49 PM
Please enable your VM jquery with your breez template because no js is loaded.

ReferenceError: jQuery is not defined
[Break On This Error]    

})(jQuery)

vmsite.js (line 110)

ReferenceError: jQuery is not defined
[Break On This Error]    

...art:function(){},onCancel:function(){},onComplete:function(){},onCleanup:functio...

jquery...pack.js (line 46)

TypeError: $("a.gallery").fancybox is not a function
[Break On This Error]    

jQuery(document).ready(function($) { $("a.gallery").fancybox(); });
Title: Re: [SOLVED] Arrows display pictures in popup (next and prev)
Post by: techmodule on August 15, 2012, 14:09:51 PM
"Please enable your VM jquery with your breez template because no js is loaded."
Ok, i do it, and this run!
Thank for the important advise
The second question about
"locate your asset folder inside your template and check if fancybox is existing, also please disable your template jquery loaded for second time or the vm original one from the BE.

That's the path for the vm asset folder: /components/com_virtuemart/assets/js/fancybox/jquery.fancybox-1.3.4.pack.js (this should exist)"
Plz check my attached file, the file exist
And you mean that i have to copy jquery.fancybox-1.3.4.pack.js to my template folder?
If that right, tell me where to copy, i upload the file to public_html/templates/ja_elastica/html/com_virtuemart/assets/js
But it is still not runned
I also attached my template forder here
Can you check for me how to disable the Srcript
Thank you so much!!!!

[attachment cleanup by admin]
Title: Re: [SOLVED] Arrows display pictures in popup (next and prev)
Post by: bytelord on August 15, 2012, 15:14:59 PM
Hello again,

Normally you should ask for support from JoomlaArt. The template you send me was incomplete because was needed and a plugin to test it .. i found it on JA web site and i test it. Also you didn't send me any VM template  (doen't exist at all). So i suppose you use the VM default, you should search on the forum how you use those files inside your template because every time you upgrade vm all your edits will be lost.

You solution was easy:

1. Inside your template joomla_folder\templates\ja_elastica\js\jquery you could rename that folder jquery or delete it because its overrides the jquerry loadind. I was search inside ja elastica template and from the backend options and there is no option to exclude it from loaded (fail)! lol
So just rename or delete the folder jquery to not be loaded (no error comes out, it just overides the original one).

2. From your backend Configuration -> Templates -> Activate Css styles & javascript enable them all.

3. run it and test it ... it works great for me with your template.

For further assistance you should speak with Joomla art.

Thank you.

Regards,

Bytelord

Title: Re: [SOLVED] Arrows display pictures in popup (next and prev)
Post by: techmodule on August 15, 2012, 15:23:34 PM
Quote from: bytelord on August 15, 2012, 15:14:59 PM
Hello again,

Normally you should ask for support from JoomlaArt. The template you send me was incomplete because was needed and a plugin to test it .. i found it on JA web site and i test it. Also you didn't send me any VM template  (doen't exist at all). So i suppose you use the VM default, you should search on the forum how you use those files inside your template because every time you upgrade vm all your edits will be lost.

You solution was easy:

1. Inside your template joomla_folder\templates\ja_elastica\js\jquery you could rename that folder jquery or delete it because its overrides the jquerry loadind. I was search inside ja elastica template and from the backend options and there is no option to exclude it from loaded (fail)! lol
So just rename or delete the folder jquery to not be loaded (no error comes out, it just overides the original one).

2. From your backend Configuration -> Templates -> Activate Css styles & javascript enable them all.

3. run it and test it ... it works great for me with your template.

For further assistance you should speak with Joomla art.

Thank you.

Regards,

Bytelord
Hahaha
Thank you thank you
it run
So fun, beacuse the jquery is not use in
=))
Thank you again
Title: Re: [SOLVED] Arrows display pictures in popup (next and prev)
Post by: techmodule on August 15, 2012, 15:28:10 PM
dear
sorry for ask much
If i want to add the text that "Next"    "Previous" in the button like the attached file
How can i do it
Thank you

[attachment cleanup by admin]
Title: Re: [SOLVED] Arrows display pictures in popup (next and prev)
Post by: bytelord on August 15, 2012, 15:52:51 PM
The file is located here and you can downloaded. http://forum.virtuemart.net/index.php?topic=105909.msg354661#msg354661

I place the file inside default vm template (components\com_virtuemart\views\productdetails\tmpl) and works just fine with your template.

But i cannot help more with your JA template, you have to ask them. You have a custom template with a custom framework and this mess things.

Also you don't have any vm template ... you use the default one from VM installation

Hope it helps you about.
Title: Re: [SOLVED] Arrows display pictures in popup (next and prev)
Post by: harut2005 on June 12, 2013, 03:47:14 AM
Thank you very much guys!
I just deleted only this line of index.php in my template's folder and everything is ok now!

Quote<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>


No js conflicts between virtuemart's and template's scripts!