en Jump to content
misthero

[FREE MODULE] Sliders Everywhere - Responsive Gallery, Image Sliders or Banners - NOW 3D!

Make a Better Module  

1,004 members have voted

  1. 1. What would you like to see as new feature in the future?

    • Automatically enable CMS page slider without manually editing theme file (*ADDED IN VERSION 1.5.4)
    • Video Slides
    • More customizations for colours and controls positions
    • Image map Slides with different clickable areas (*ADDED IN VERSION 1.6.1)
    • Entering custom html in description
    • Option to restart the slider after user click on controls (*ADDED IN VERSION 1.5.4)
    • Different Sliders on Category pages based on categories (*ADDED IN VERSION 1.5.4)


Recommended Posts

Hey people!

 

thanks to all of you for your appreciation

I'm very glad you found it useful

 

nice, thank you so much

can i add it to the free modules list? (it's a pinned topic)

it's worth to add this module there

Sure vekia i would like it, thank you!

Edited by misthero

Share this post


Link to post
Share on other sites

Seriously good module, thanks for sharing.

 

Just one question, if I want to display a slider on a specific category page I know I can use the following on the category.tpl:

 

{if $smarty.get.id_category == 64}
{hook h="displaySlidersPro" slider="sample"}
{/if}
 
But what's the best way to do it if I want to show different sliders on several categories?  Just repeat the above?
 
Thanks again
Edited by pel024

Share this post


Link to post
Share on other sites
Seriously good module, thanks for sharing.

 

 

 

 

You are welcome

 

 

Just one question, if I want to display a slider on a specific category page I know I can use the following on the category.tpl:

 

{if $smarty.get.id_category == 64}
{hook h="displaySlidersPro" slider="sample"}
{/if}
 
But what's the best way to do it if I want to show different sliders on several categories?  Just repeat the above?
 
Thanks again

 

 

yes, you are correct, right now that is the only solution (unless writing some custom override).

 

maybe I could add a functionality where each slider could be bound to a product category.. you gave me a good idea I have to investigate.

Edited by misthero

Share this post


Link to post
Share on other sites

Hi,

thank you very much for the module

how can i make the slide more short?

 

 

You can configure the height and width of the slider, if you change it you should reupload the images so they are saved with the new proportions, what is most importat is proportions because the slider is responsive and will try to adatpt the width to the available horizontal space and will keep the height of the images inside.

 

Spanish: puedes cambiare el ancho y el alto de las imagenes, si cambias las dimensiones vas a necesitar subir de nuevo las imagenes para que sean guardadas con las nuevas medidas, lo mas importante son las proporciones porque la galeria va a intentar adaptarse en largo al espacio disponible y el alto serà la medida de las imagenes proporcionadas (sin deformarse)

 

Hope this help you if not you can give me a link to your site so i can check what is wrong :)

 

i988.jpg

Edited by misthero

Share this post


Link to post
Share on other sites
Thanks so much.

This module really make me the life more easy

 

I just have a more question, Is Posible put two Top Modules? One module in the left side and other in the right side, but both in the same line.

Its just a question, thanks!! 

Share this post


Link to post
Share on other sites

 

Thanks so much.
This module really make me the life more easy
 
I just have a more question, Is Posible put two Top Modules? One module in the left side and other in the right side, but both in the same line.
Its just a question, thanks!! 

 

 

yes you can, this moudle is born  exactly for that, I had a project that needed 7 sliders on the same page!

 

you need to use the custom hook code anyway to have more than one slider on the same place

 

it looks like this: {hook h="displaySlidersPro" slider="your_slider_name_here"}

 

for example you can edit your theme header.tpl and look for "{$HOOK_TOP}" and write the code "{hook h="displaySlidersPro" slider="your_slider_name_here"}" somewhere near it.

Edited by misthero

Share this post


Link to post
Share on other sites

Hi Misthero

Seriously good module, thanks for sharing. 

How do I add external link to open in new window or new tab

 

Thanks again

Edited by shegar

Share this post


Link to post
Share on other sites

It is possible to set a description as tex permanently (no only on mouse over) in Sliders Everywhere  just edit style.css:

.slide_description {
  background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
  bottom: 0;
  color: #FFFFFF;
  display: block;
  height: auto;  /* *********** changed this to make description always visible***********/
  overflow: hidden;
  padding: 10px 2%;  /* *********** changed this to make description always visible***********/
  position: absolute;
  transition: all 0.3s ease 0s;
  width: 96%;
}

Thanks misthero

Edited by nicewikdesign

Share this post


Link to post
Share on other sites

Can you show us some example or demo?

 

Can we add youtube or another video?

 

thanks

 

I have no demo at the moment, anyway it is similar to the official homeslider from Prestashop team, just with more option and features and is not limited to the homepage. You can place it "Anywhere"!

 

right now it only support images, in the future, if people need it, video slider functionality is a possibility.

Share this post


Link to post
Share on other sites

I cant get this to work I added the following code:

 

<div class="rte{if $content_only} content_only{/if}">
{hook h="DisplaySlidersPro" CMS="1"}
{$cms->content} </div>{elseif isset($category)} <div class="block-cms">
 
 
is this correct?

Share this post


Link to post
Share on other sites

I cant get this to work I added the following code:

 

<div class="rte{if $content_only} content_only{/if}">
{hook h="DisplaySlidersPro" CMS="1"}
{$cms->content} </div>{elseif isset($category)} <div class="block-cms">
 
is this correct?

 

that is correct, but you did the other step? Did you assigned a slider to your cms page?

Edited by misthero

Share this post


Link to post
Share on other sites

Hi Misthero,

 

This module is exactly what I have been looking for!

 

Could you please do me a favour? I've downloaded and installed the module for use on my site: www.stilllivelucky.com

 

But I want a slider to ONLY appear on the sub-category ''Still Reigning'' (http://www.stilllivelucky.com/en/18-still-reigning).

 

Could you please, in a step-by-step way tell me how to achieve this?

 

I would really appreciate it!

 

Thank you!

Share this post


Link to post
Share on other sites

Hi Misthero,

 

This module is exactly what I have been looking for!

 

Could you please do me a favour? I've downloaded and installed the module for use on my site: www.stilllivelucky.com

 

But I want a slider to ONLY appear on the sub-category ''Still Reigning'' (http://www.stilllivelucky.com/en/18-still-reigning).

 

Could you please, in a step-by-step way tell me how to achieve this?

 

I would really appreciate it!

 

Thank you!

 

you can do it just like pel024 did on page 1, you just need to change the id of the category to match your own:

http://www.prestashop.com/forums/topic/310597-free-module-sliders-everywhere-responsive-gallery-image-sliders/?do=findComment&comment=1573324

Share this post


Link to post
Share on other sites

Hi Misthero!

 

Thanks for the reply. Would you mind (as I'm not very good with coding) directing me as to where in category.tpl I should add that code?

 

Thanks very very much!

Share this post


Link to post
Share on other sites

Hello great module. But that it is the last version 1.52 or 1.51? Thank you

 

1.52, none reported anything but if you find any bug in this version let me know

 

Hi Misthero!

 

Thanks for the reply. Would you mind (as I'm not very good with coding) directing me as to where in category.tpl I should add that code?

 

Thanks very very much!

 

anywhere, it really depends on your theme and your taste, just remeber that where you place that code represents where the slider will appear on the page.

Edited by misthero

Share this post


Link to post
Share on other sites

Thanks for your response, Misthero!

 

However, as I said before I'm not too familiar with coding, so if yo could point me in the right direcion it would really help.

 

Based on the configuration settings of your module, the slider appears in the sub cateories PERFECT (see attached image). This is EXACTLY the right positioning that I would like it to have on the page (you can still see it at: http://www.stilllivelucky.com/en/18-still-reigning)

 

Unfortunately however, the slider also appears on my homepage and every other category, when I only want it to appear in my ''still-reigning'' category.

 

My category.tpl code is the following:

 

{include file="$tpl_dir./breadcrumb.tpl"}
{include file="$tpl_dir./errors.tpl"}
{if isset($category)}
{if $category->id AND $category->active}
<h1>
{strip}
{$category->name|escape:'htmlall':'UTF-8'}
{if isset($categoryNameComplement)}
{$categoryNameComplement|escape:'htmlall':'UTF-8'}
{/if}
<span class="category-product-count">
{include file="$tpl_dir./category-count.tpl"}
</span>
{/strip}
</h1>
{if $scenes}
<!-- Scenes -->
{include file="$tpl_dir./scenes.tpl" scenes=$scenes}
{*
{else}
<!-- Category image -->
{if $category->id_image}
<div class="align_center">
<img src="{$link->getCatImageLink($category->link_rewrite, $category->id_image, 'category_default')}" alt="{$category->name|escape:'htmlall':'UTF-8'}" title="{$category->name|escape:'htmlall':'UTF-8'}" id="categoryImage" width="{$categorySize.width}" height="{$categorySize.height}" />
</div>
{/if}
*}
{/if}
        <p class="cat_desc bordercolor bgcolor" id="category_description_full">{$category->description}</p>
{if isset($subcategories)}
<!-- Subcategories -->
<div id="subcategories">
<h2>{l s='Subcategories'}</h2>
<ul>
{foreach from=$subcategories item=subcategory}
<li>
<a class="bgcolor bordercolor" href="{$link->getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}" title="{$subcategory.name|escape:'htmlall':'UTF-8'}">
{if $subcategory.id_image}
<img src="{$link->getCatImageLink($subcategory.link_rewrite, $subcategory.id_image, 'medium_default')}" alt="" />
{else}
<img src="{$img_cat_dir}default-medium_default.jpg" alt="" />
{/if}
<span>{$subcategory.name|escape:'htmlall':'UTF-8'|truncate:20:'...'}</span>
</a>
                    <strong></strong>
</li>
{/foreach}
</ul>
</div>
        <div class="clear"></div>
{/if}
{if $products}
{include file="$tpl_dir./product-sort.tpl"}
{include file="$tpl_dir./product-list.tpl" products=$products}
{include file="$tpl_dir./product-compare.tpl"}
{include file="$tpl_dir./pagination.tpl"}
{elseif !isset($subcategories)}
<p class="warning">{l s=''}</p>
{/if}
{elseif $category->id}
<p class="warning">{l s='This category is currently unavailable.'}</p>
{/if}
{/if}
 
 
 
Could you, or somebody else please tell me what I need to edit and where, in order to keep the slider in this current position, but ONLY in the specified category?
 
Thanks very much!

 

 

post-646718-0-47222000-1395006759_thumb.jpg

Share this post


Link to post
Share on other sites

@nickleus: if the slider appear in every page it has nothing to do with the code, you probably activated somewhere else.

Check the module configuration page, and remove it from any position you may have activated. Deselect every hook, save and check again.

 

;)

Share this post


Link to post
Share on other sites

Hi, it is really a great module, like it very much.

Currently we are testing multi-store with it, well, it works fine on default page, doesn´t show up on the other "store". Is there anyway to do it.

 

 

Very thanks in advance!

Share this post


Link to post
Share on other sites

Hello, did you created the slider and saved hook position in the configuration page for the other shop?

 

Prestashop backoffice when in multi store context allows you to switch store configurations, by default the module comes with a sample slider just for the main store.

 

if that's not the problem i need more details to help you, for example if you are using custom hooks or the standards, or if you are using for cms pages and so on.

 

Let me know.

Share this post


Link to post
Share on other sites

Hi Misthero,

 

Got everything to work perfectly on my other categories, however on this category: http://www.stilllivelucky.com/en/31-macabre-gadgets

 

The images appear one on top of the other, instead in the slider. Why is this? Could it have something to do with the fact that there are 15 slides?

 

Please help me out if you can.

 

Thanks very much!

Share this post


Link to post
Share on other sites

The images appear one on top of the other, instead in the slider. Why is this? Could it have something to do with the fact that there are 15 slides?

 

Please help me out if you can.

 

Thanks very much!

 

is not the quantity of images, in that page the slider javascript is missing, try to clear the cache, or at least try disabling ccc for javascript files in BO to see if it works without it. If it works you should clear the javascript cache and reenable it.

 

btw your site is reeeeally slow for me, do you have enabled cache "file system"? if you are on a shared hosting try disabling that. In my experience sometime on shared hosting that option slows down the site badly...

Edited by misthero

Share this post


Link to post
Share on other sites

Hi Misthero,

 

I did everything you suggested. Still no change :/. I cleared the cache on chrome multiple times, cleared smarty cache in BO, disabled ccc for javascript in bo and still nothing changed.

 

Any other suggestions?

Share this post


Link to post
Share on other sites

Hi Misthero,

 

I did everything you suggested. Still no change :/. I cleared the cache on chrome multiple times, cleared smarty cache in BO, disabled ccc for javascript in bo and still nothing changed.

 

Any other suggestions?

 

I think I got it, maybe your slider is called "macabre gadgets1" ?? if so that is the problem there should be no white spaces in the gallery name or the javascript will not fire.

 

at the moment there is no check internally but when you create a new slide near the text box you can read

"(Only lowercase letters and underscores, no special characters.)"

 

so it should be "macabre_gadgets1" with an underscore or "macabregadgets1" or anything but no white spaces or any other character like %$#@^& etc..

Edited by misthero

Share this post


Link to post
Share on other sites

Great module, thanks.

Is there some way to insert some html tags (<br>, <div>...) to description field?

hello, actually the module strip out html tags to avoid errors, if you want to do that you have to modify 2 files

 

homeSlidePro.php around line 28:

'description' =>    array('type' => self::TYPE_STRING, 'lang' => true, 'validate' => 'isCleanHtml', 'size' => 4000),
change to:

'description' =>    array('type' => self::TYPE_HTML, 'lang' => true, 'validate' => 'isCleanHtml'),
and

 

homeslidepro.tpl around line 15:

<span class="slide_description">{$slide.description|escape:'htmlall':'UTF-8'}</span>
change to :

<span class="slide_description">{$slide.description}</span>

keep in mind that doing that you can break your site layout if you are not careful... Correctly closing html tags etc..

 

have fun!

Edited by misthero

Share this post


Link to post
Share on other sites

In version 1.6.0.5 works but has a problem: it sees the first slider well as all other are seen quickly and the last slider appears. pls help.

Share this post


Link to post
Share on other sites

In version 1.6.0.5 works but has a problem: it sees the first slider well as all other are seen quickly and the last slider appears. pls help.

... ehm.. can you be more specific? o give a link to the site?

Share this post


Link to post
Share on other sites

ok I see that there are many javascript errors on your theme, did you developed it?

 

Also you are using jquery 1.11, slidersEverywhere uses a modified bxSlider an open source script and looks like there is some incompatibility with that version of jQuery documented here: https://github.com/stevenwanderski/bxslider-4/issues/440

 

anyway try the attached file

 

slidereverywhere.zip

 

unpack it and replace the file in modules/homsliderpro/js

 

please let me know if it works so I can include this patch in next version. thank you.

Share this post


Link to post
Share on other sites
Hello Misthero, thank you for a great module! However when I install the module and try out the module I don't get a slider but the pictures below eachother? What am I doing wrong here?

 

post-765608-0-33691800-1395931322_thumb.jpg

post-765608-0-33691800-1395931322_thumb.jpg

Edited by rvzoest

Share this post


Link to post
Share on other sites

the pictures one on top of another mean javascript didn't fired, what is your slide name? don't use white spaces or special characters

Resolved, with version 1.6 and remark above, thanks!

Share this post


Link to post
Share on other sites

New version available!

 

Changelog:

 

Version 1.5.3:

  • ** NEW ANIMATION 3D Flipping slides!! ** (fallback to fade animation if browser doesn't support 3D)
  • Added check on Slide name to avoid unwanted characters breaking the javascript
  • Slightly modified and optimized the CSS
  • New Icon
  • Various fixes and improvements

Share this post


Link to post
Share on other sites

thank you Vekia,

 

to everyone else, if you downloaded the version 1.5.3 you should update to 1.5.31, the 3D Flip animation was not working on chrome on that version due to a little bug, I removed the wrong version from first page!!

 

sorry. :)

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More