Jump to content

How to resize Image Slider on Homepage


Recommended Posts

How do I resize the Image Slider on my site's homepage? The advertising content of some banners in the Image Slider is either blocked by the transition dials (or circles) in the Image Slider or some the text is cut off at the bottom of the banner because the size of the Image Slider. Each banner I uploaded is the same size (720 x 263) in the Image Slider module in the PS back office. I am using the PrestaCoder Gadget theme. Can anyone suggest an alternative Image Slider module for the Homepage?

 

 

valuebins.com

Link to comment
Share on other sites

its hard to say what exactly you must edit without an access to template files. But i think that this tutorial may help you:

change size and position of homeslider module

 

I don't want to move the homeslider module to hookDisplayHome() or displayTop position according to tutorial you shared because I'm using megamenucategories block in left column. If you review some of the banners on my site, the advertising content in a few of the banners is either blocked by transition circles on the right and some text is hiddenat the bottom in the last banner because of either the bx-wrapper container or the Image Slider's height is probably to small. I had each of the banners made the same the dimensions or size shown in the BlockImageSlider module in the PS back office. If this makes any sense. I'd like to get rid of the transitions circles and green arrows also and still have the banners sweep through the transitions in the Image Slider on the Homepage of my site.

Link to comment
Share on other sites

Could somebody recommend a Image Slider module that doesn't have the transition transform circles and continues to transitions through the image banners without the prev and next pager arrows? Plus it need to fully show the banners' advertising content without any issues.

 

but you can figure out how to change size of the slider

 

So I should change the bx_styles.css file to change the Image Slider size? :unsure: The tutorial you shared isn't really helpful concerning my issue. :(

Link to comment
Share on other sites

  • 1 year later...

its hard to say what exactly you must edit without an access to template files. But i think that this tutorial may help you:

change size and position of homeslider module

 

I'm running a PrestaShop™ 1.6.0.5 with homeslider module 1.3.9, but your tutorial doesn't work. I want to resize the default height of 698px to less about 200px or less. Am I missing something from the tutorial? The bx_styles.css  file is also nowhere to be found.

Link to comment
Share on other sites

I'm running a PrestaShop™ 1.6.0.5 with homeslider module 1.3.9, but your tutorial doesn't work. I want to resize the default height of 698px to less about 200px or less. Am I missing something from the tutorial? The bx_styles.css  file is also nowhere to be found.

 

so you mean taht you want to DECREASE size, not increase, right?

tutorial is about increasing size

Link to comment
Share on other sites

  • 3 weeks later...
  • 4 months later...

I'm trying to do this, but PS 1.6 doesn't record new max-width value! It seems it can't record it into database, but I have this problem only on this module (all others modules work well). 
Do you know why I can't insert any other value? 

http://www.templatemonster.com/help/prestashop-1-6-x-how-to-change-slider-dimensions.html

Edited by marcocavicchioli (see edit history)
Link to comment
Share on other sites

I'm trying to do this, but PS 1.6 doesn't record new max-width value! It seems it can't record it into database, but I have this problem only on this module (all others modules work well). 

Do you know why I can't insert any other value? 

http://www.templatemonster.com/help/prestashop-1-6-x-how-to-change-slider-dimensions.html

Simple, do this:

change the homeslider.css file in \themes\default-bootstrap\css\modules\homeslider 

 

Change on this code: 

 #homepage-slider {
  padding-left: 0;
  padding-right: 0;
  margin-bottom: 14px;
  max-width: 100%;
  max-height: 100%;
  overflow: hidden;
  position: relative;
 
Change max-width: 100%; and max-height: 100%; to the value you want but usin px   Example: 
max-width: 200px;
  max-height: 100px;
 
The image will appear the how you want it to be.
 
Link to comment
Share on other sites

 

Simple, do this:

change the homeslider.css file in \themes\default-bootstrap\css\modules\homeslider 

 

Change on this code: 

 #homepage-slider {
  padding-left: 0;
  padding-right: 0;
  margin-bottom: 14px;
  max-width: 100%;
  max-height: 100%;
  overflow: hidden;
  position: relative;
 
Change max-width: 100%; and max-height: 100%; to the value you want but usin px   Example: 
max-width: 200px;
  max-height: 100px;
 
The image will appear the how you want it to be.
 

 

 

Ok, tks. I will try and I will tell you if it will work. 

Link to comment
Share on other sites

There are several tips available on the internet to resize Image Slider on Homepage, and also you can better get the tips from the Thesis Writing Service which may help you to answer in a perfect way. So try to get details with these kinds of services that may be helpful for you to get an appropriate idea in a successive manner.

 

I want to know why I can't edit max-width on the backoffice... I think it's very strange! 

Link to comment
Share on other sites

 

Simple, do this:

change the homeslider.css file in \themes\default-bootstrap\css\modules\homeslider 

 

Change on this code: 

 #homepage-slider {
  padding-left: 0;
  padding-right: 0;
  margin-bottom: 14px;
  max-width: 100%;
  max-height: 100%;
  overflow: hidden;
  position: relative;
 
Change max-width: 100%; and max-height: 100%; to the value you want but usin px   Example: 
max-width: 200px;
  max-height: 100px;
 
The image will appear the how you want it to be.
 

 

Have you tried the changes mentioned above?  It should make it...

Link to comment
Share on other sites

  • 2 weeks later...

I'm trying to do this, but PS 1.6 doesn't record new max-width value! It seems it can't record it into database, but I have this problem only on this module (all others modules work well). 

Do you know why I can't insert any other value? 

http://www.templatemonster.com/help/prestashop-1-6-x-how-to-change-slider-dimensions.html

 

 I'm having this same issue. Did anyone found anything on this!?

Thanks

Link to comment
Share on other sites

I found this:
 
http://www.prestashop.com/forums/topic/384086-full-width-home-slider-not-working/?p=1885020

 

please verify if module configuration variables aren't duplicated in ps_configuration table
 
just make sure that HOMESLIDER_WIDTH field isn't duplicated in ps_configuration table in your database (and other variables with HOMESLIDER_ in name)

 

it was indeed duplicated in my database, deleted those duplicates and is working now!

Now i can change the values in the BO

hope it helps !

Edited by namelesshachi (see edit history)
Link to comment
Share on other sites

  • 1 month later...

I found this:

 

http://www.prestashop.com/forums/topic/384086-full-width-home-slider-not-working/?p=1885020

 

 

it was indeed duplicated in my database, deleted those duplicates and is working now!

Now i can change the values in the BO

hope it helps !

 

Hi

I have the same problem. Would you be so kind to show me how did you find and cancel the duplicates in the database.

thank you in advance 

Link to comment
Share on other sites

  • 2 months later...

 

 
 
Have you changedthe homeslider.css file in \themes\default-bootstrap\css\modules\homeslider
 
at: #homepage-slider {
  padding-left: 0;
  padding-right: 0;
  margin-bottom: 14px;
  max-width: 100%;
  max-height: 100%;
  overflow: hidden;
  position: relative;
 
change max-height to 300px?

 

 

Thanks it is done with your help. :)

Link to comment
Share on other sites

×
×
  • Create New...