Hi can anybody tell me how to do to change the default bluemaster slider ? can anyone give me the code to paste in the front page.tpl.php ? Thanks

Comments

gtsopour’s picture

Assigned: Unassigned » gtsopour
Status: Active » Closed (fixed)

The implementation for the default bluemasters slider is hardcoded in page-front.tpl.php. It is hardcoded for example purposes. Also, in order to enable the javascript slider you must use the themes/blumasters/js/bluemasters.js file.

<div class="main_view">
<div class="window">
<div class="image_reel">
<a href="?q=node/1"><img src="sites/all/themes/bluemasters/images/slide-image-1.jpg"></a>
<a href="?q=node/2"><img src="sites/all/themes/bluemasters/images/slide-image-2.jpg"></a>
<a href="?q=node/3"><img src="sites/all/themes/bluemasters/images/slide-image-3.jpg"></a>
</div>
<div class="descriptions">
<div class="desc" style="display: none;">Our Portfolio</div>
<div class="desc" style="display: none;">Creation of Beaches</div>
<div class="desc" style="display: none;">About iPadMasters</div>
</div>
</div>

<div class="paging" style="display: block;">
<a rel="1" href="#" class="">1</a>
<a rel="2" href="#" class="">2</a>
<a rel="3" href="#" class="">3</a>
</div>
</div>
skounis’s picture

Title: Change slider » How to change slider
Status: Closed (fixed) » Active

Can we add those instructions into BlueMasters wiki page (http://wiki.morethanthemes.com/index.php?title=Blue_Masters) ?

drupalerr’s picture

Thanks gtsopour for your answer. However, my question was more how to change the slider, which means how to implement another slider than the bluemasters one. How to implement for example the Nivo Slider as use in this demo : http://demo.marioaguiar.com/wp/ ? I try to change the bluemaster.js file and replace it with another Js but the slider i'm talking about require multiple js files. Morehover, how to define the narrow for the slider ?

Thanks

plato1123’s picture

@ drupalerr: Seems like the slider area should probably be a block instead of it being hard coded in... actually, as I look at the template file page-front.tpl.php it looks like lines 75-95 can simply be removed, line 74 can be changed to simply print $banner; and voila, the block named "banner" is re-enabled. I suspect this is in the documentation somewhere. Btw, bannersnack offers really easy to create professional looking banners that can be pasted into a block.

http://www.bannersnack.com/

srece’s picture

I figured out a way to duplicate the Bannerslider in a new block by just copying and pasting the code from "page-front.tpl.php" into the block and changing the paths that the images point to. So what I have now is 2 separate blocks that have rotating slider images (this is what the client wanted) on them plus the above banner... see my site: http://130.94.159.89/

The question is how do I make each of these blocks run independently? ...because as you can see all 3 sliders move at the same time, which is kinda cool but I wanna be able to set different settings for each slider. I know that the original slider is driven by "bluemasters.js" and the dimensions are controlled within the "style.css". How can I code 3 sliders to work independently from another? Do I have to create a separate js file for each or is there an easier way to do this?

honza_h’s picture