Jump to content
dev osCommerce
Forum
  • Checkout
  • Login
  • Contact Us
  • Get in touch

osCommerce

The e-commerce.

New Demo
Our Partners

Bootstrap Home Page Carousel Banner Slider Module Plugin Complete - Testing Welcome

vampirehunter

Recommended Posts

  • Replies 61
  • Created
  • Last Reply
snakelimit

snakelimit

Posted
Posted

p.s for some reason I was unable to edit my previous post...

 

 

OSC-Sevilla, on 02 Feb 2015 - 16:22, said:

 

I did try install what he give us and its working some how.

in Includes/modules/content/header/cm_carousel.php

 

Replace

if ($banner['banners_image'] !== '') {
//$wrapper_slides .= tep_image(DIR_WS_IMAGES . $banner['banners_image'], $banner['banners_html_text']);
$wrapper_slides .= tep_image(DIR_WS_IMAGES . $banner['banners_image'], '', 544, 172);
$wrapper_slides .= '<div class="carousel-caption"> </div>';
} else {
//$wrapper_slides .= tep_image(DIR_WS_IMAGES . 'pixel_silver.gif', 'alt', 544, 172 );
$wrapper_slides .= '<img class="img-responsive" alt="544x172" src="' . $background . '" />';
$wrapper_slides .= '<div class="carousel-caption">' . $banner['banners_html_text'] . '</div>';
}

with

if ($banner['banners_image'] !== '') {
$wrapper_slides .= tep_image(DIR_WS_IMAGES . $banner['banners_image'], '', 1800, 600);
if ($banner['banners_html_text'] . $banner['banners_html_text2'] !== '') {
$wrapper_slides .= '<div class="carousel-caption">';

if ($banner['banners_html_text'] !== '') {
$wrapper_slides .= '<h3>'. $banner['banners_html_text'] . '</h3>';
}

if ($banner['banners_html_text2'] !== '') {
$wrapper_slides .= '<p>'. $banner['banners_html_text2'] . '</p>';
}

$wrapper_slides .= '</div>';
}

} else {
$wrapper_slides .= '<img class="img-responsive" alt="544x172" src="' . $background . '" />';
$wrapper_slides .= '<div class="carousel-caption">' . $banner['banners_html_text'] . '</div>';
}

then I created extra column in SQL as he write but not sure if is needed as when playing around I did delete this column from SQL and text still showing up on top of image

 

 

 

 

I delete this part of code from same file as above as I dint like how buttons was looking at last I don't need it.

 

 


$controls = ' <!-- Controls -->
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>';

Regards

Mark

Link to comment
Share on other sites
  • 1 month later...
zpupster

zpupster

Posted
Posted

had a little trouble getting this to work.

 

can i move this out of the header to lets say where welcome to the store is??

 

http://sympacare.com/tristarbs/

 

i have tried quite a bit at this. i know where the code should go in either template_top.php underneath bread crumbs.

<body class="center">
<?php require(DIR_WS_INCLUDES . 'header.php'); ?>
  <?php echo $oscTemplate->getContent('navigation'); ?>
    <div class="col-sm-12<?php /* echo $content_width; */ ?>">
  <?php echo $breadcrumb->trail(' » '); ?>


  <div id="carousel" class="col-sm-<?php echo $content_width; ?>">

<?php

echo $carousel;

?>


</div>

or

 

index.php instead greeting

<div class="contentContainer">
  <div class="alert alert-info">
    <?php echo tep_customer_greeting(); ?>
  </div>

tried css to move it.

 

 

if someone could point out the code to place and what would  i need to change

 

thanks

Link to comment
Share on other sites
burt

burt

Posted
Posted

@@zpupster - I have not looked at the code, but it should be a module that needs no code inserted to make it show.  

 

So, you would "remove module"...then move the module files from (eg) /content/navigation/ to (eg) content/header and then turn the module back on in admin.  Done.

 

 

Video might go a bit fast, but shows the general idea - move the files from 1 content folder to another and then install via Admin.

 

Link to comment
Share on other sites
zpupster

zpupster

Posted
Posted

shazamm!!

 

just what the doctor ordered!

 

thanks you so much for taking time out to show me this.  I see lots of flexibility with these content modules.

 

i have not tried it yet, I see no problem.

Link to comment
Share on other sites
  • 1 month later...
videod

videod

Posted
Posted

@@zpupster Did you ever get the code to go in the Welcome part of the first page?  I want to do the same thing.  I removed the New Products and will put the slider in there somewhere.   Removing the need for the slider at the top.  When viewing on a mobile device it should rock.  I believe the Welcome stuff is in the languages/english.php file so I am not sure how to go about making that happen.  Although, not sure how to make the text resize accordingly that is on the slides.  But that can be fixed by making text part of the image ... a work around.

 

Thanks,

 

Dave

Link to comment
Share on other sites
videod

videod

Posted
Posted

You can find the revised code here http://www.oscommerce.com/forums/topic/399709-bootstrap-home-page-carousel-banner-slider-module-plugin-complete-testing-welcome/?p=1713835.  Basically create the files and drop them in (the paths are provided).  In the Admin>Tools>Banner Manager: make sure you use the rotator group.  I forgot to do that in the beginning, but slowly read through the instructions in post #1 of this thread.

 

Cheers!

Dave

Link to comment
Share on other sites
  • 2 weeks later...
  • 4 months later...
  • 2 months later...
Guest

Guest

Posted
Posted

Hi

 

Have just installed this module, I am wanting to have images on either side and have modified the carousel.php template file as follows;

<div class= "col-md-12">
<div class="hidden-sm hidden-sm col-md-3"> 
<?php if ($banner = tep_banner_exists('dynamic', 'Link1')){?>
<?php echo tep_display_banner('static', $banner); ?>
<?php
 }
?>
<p/><p/><p/>
<?php if ($banner = tep_banner_exists('dynamic', 'Link2')){?>
<?php echo tep_display_banner('static', $banner); ?>
<?php
 }
?>
</div>

<div id="carousel" class="col-sm-<?php echo $content_width; ?>">

<?php

echo $carousel;


?>
<p/>
</div><div class="hidden-sm hidden-sm col-md-3"> 
<?php if ($banner = tep_banner_exists('dynamic', 'Link3')){?>
<?php echo tep_display_banner('static', $banner); ?>
<?php
 }
?>

<?php if ($banner = tep_banner_exists('dynamic', 'Link4')){?>
<?php echo tep_display_banner('static', $banner); ?>
<?php
 }
?><p/>
</div></div>

Is this code modification OK or is there a better way. It does seem to work.

 

Many thanks

 

Grandpa

Link to comment
Share on other sites
  • 1 month later...
Guest

Guest

Posted
Posted

@@vampirehunter

 

Hi

 

I am trying to get the corners rounded in this addon. Tried all sorts of bits of code, but alas no good. I see there was also a previous post exploreing this.

 

Are you able to tell me what and where code may go.

 

Many thaks

 

Grandpa

Link to comment
Share on other sites
Guest

Guest

Posted
Posted

Hi

 

Anyone interested here's how I did it

 

user.css

 

.carousel-control.left, .carousel-control.right {
  border-radius: 10px;
}

 

Cheers

Grandpa

Link to comment
Share on other sites
vampirehunter

vampirehunter

Posted
  • Author
Posted

Is it possible to change the left and right arrow colors? My images have white backgrounds and I'd like to make the arrows black. Also, can the gray shading be removed from the sides?

 

I think its to do with the CSS.

i am trying to figure this out as well.

I don't like the default carousal shade on hover and arrow colour.

Link to comment
Share on other sites
kymation

♥kymation

Posted
Posted

You can change the colors by overriding the CSS in your user.css. I use Firebug in Firefox to find the CSS to change.

 

Regards

Jim

See my profile for a list of my addons and ways to get support.

Link to comment
Share on other sites
  • 2 weeks later...
vampirehunter

vampirehunter

Posted
  • Author
Posted

You can change the colors by overriding the CSS in your user.css. I use Firebug in Firefox to find the CSS to change.

 

Regards

Jim

Cool thanks

I have a question.

 

When in a full size screen or a tablet sized screen, the slider carousel will show fine as the banners will be large.

When you get to mobile view though, in particular on smaller ones, the carousel will reduce in size and look a bit squashed.

 

Whats the best recommendation on modifying a carousel just for the small mobile views?

Should it be a case of having a seperate set of different smaller carousel images set to show only on XS and Small views?

 

So the normal carousel will only show on full size and medium sized viewports,

and the smaller carousel with its smaller specific images to show on small and xs viewports.

 

whats the concensus on it?

thanks

Link to comment
Share on other sites
bruyndoncx

♥bruyndoncx

Posted
Posted

 

Google this

best practice sliders carousel for mobile

 

Find this

http://baymard.com/blog/homepage-carousel

 

and find this

http://shouldiuseacarousel.com/

KEEP CALM AND CARRY ON

I do not use the responsive bootstrap version since i coded my responsive version earlier, but i have bought every 28d of code package to support burts effort and keep this forum alive (albeit more like on life support).

So if you are still here ? What are you waiting for ?!

 

Find the most frequent unique errors to fix:

grep "PHP" php_error_log.txt | sed "s/^.* PHP/PHP/g" |grep "line" |sort | uniq -c | sort -r > counterrors.txt

Link to comment
Share on other sites
randyroy

randyroy

Posted
Posted

I installed the carousel mod into my store and it works great. Thanks for that.

 

I see that it is on the home page (index.php) but not on any other pages. And that's fine as I would like to use my regular logo on the other pages. But if I enable the logo in the admin panel, it displays on all pages including the one with the carousel. Is there a way to disable the logo just on the index.php page where the carousel is being displayed? I am using 2.3.4 bootstrap.

 

Any assistance is greatly appreciated. Thanks much. 

Link to comment
Share on other sites
randyroy

randyroy

Posted
Posted

I think I figured it out. Here is what I did. In the includes/modules/content/header/cm_header_logo.php file, 

 

change this 

 

function isEnabled() {
      return $this->enabled;
    }
 
to this
 
function isEnabled() {
     global $cPath, $PHP_SELF;
     if (strpos($_SERVER['SCRIPT_NAME'], 'index.php') !== false) {
      $this->enabled = true;
      }else{
      return $this->enabled;
      }
    }
 
Now, when my logo and carousel are both enabled, only the carousel displays on the index.php page. Only the logo displays on all of the other pages.
 
Hopefully that can help someone else. :)

 

Link to comment
Share on other sites
randyroy

randyroy

Posted
Posted

I think this might be better still and more efficient. In the includes/modules/content/header/cm_header_logo.php file,

change this...

 

function isEnabled() {
      return $this->enabled;
    }
 
to this

 

function isEnabled() {
     global $cPath, $PHP_SELF;
     $url = 'http://' . $_SERVER['SERVER_NAME'] . $_SERVER['REQUEST_URI'];
 
 
if (strpos($url,'index.php')) {
//echo $url;
      $this->enabled = false;
      }else{
      return $this->enabled;
      }
    }
Link to comment
Share on other sites
kymation

♥kymation

Posted
Posted

Your $url is a bit overkill, as $PHP_SELF has already been defined as the current filename. Also, you have no return from the method if the if statement evaluates true. I suggest the following:

function isEnabled() {
  global $PHP_SELF;
 
  if( $PHP_SELF === 'index.php' ) {
    $this->enabled = false;
  }

  return $this->enabled;
}

Regards

Jim

See my profile for a list of my addons and ways to get support.

Link to comment
Share on other sites
  • 2 weeks later...
vampirehunter

vampirehunter

Posted
  • Author
Posted

I have a question.

On this part of the code here

$wrapper_slides .= tep_image(DIR_WS_IMAGES . $banner['banners_image'], $banner['banners_html_text']);

There doesn't seem to be an Alt tag outputted in the html.

 

What is the best way to edit this so an Alt tag will show up in the source html?

 

If i use this, it seems to work and output an Alt tag and a title tag in the image source code html


              $wrapper_slides .= tep_image(DIR_WS_IMAGES . $banner['banners_image'], $banner['banners_image'], $banner['banners_html_text']);

thanks

Link to comment
Share on other sites
kymation

♥kymation

Posted
Posted

That sounds like a good idea. I'll take a look and add that to the master.

 

Thanks for the suggestion.

 

Regards

Jim

See my profile for a list of my addons and ways to get support.

Link to comment
Share on other sites
  • 4 weeks later...
randyroy

randyroy

Posted
Posted

Your $url is a bit overkill, as $PHP_SELF has already been defined as the current filename. Also, you have no return from the method if the if statement evaluates true. I suggest the following:

function isEnabled() {
  global $PHP_SELF;
 
  if( $PHP_SELF === 'index.php' ) {
    $this->enabled = false;
  }

  return $this->enabled;
}

Regards

Jim

 

Thanks, Jim. That works great. I appreciate your help.

 

Can you please tell me if there is a way to hide empty categories in Bootstrap? I only want to hide them if there are no products in them. I have 2.3.4.

 

Thanks,

Randy

Link to comment
Share on other sites

Archived

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

Go to topic listing
×
×
  • Create New...