quick question about content block

[foley13]

Hi,
I'm new to CMS made simple and I have been asked by someone to make some changes to their site which is made in CMS made simple.

They want me to add a link to an image slider on their homepage which should be very very simple but I cannot find anywhere to add a link to the slider images.

If I go to Content->Pages then click on the template called home I see this

Code: Select all

<div id="mainBanner">
<a href="#" class="next"></a>
<div class="scroll">
	<div class="pics">
                {content block="Image Slider" }
        </div>
</div>

</div><!-- end mainBanner -->

When I click on the page Home I see this:

Code: Select all

<img src="uploads/images/home/1a.jpg" alt="" />
<img src="uploads/images/home/2a.jpg" alt="" />
<img src="uploads/images/home/3a.jpg" alt="" />
<img src="uploads/images/home/4a.jpg" alt="" />
<img src="uploads/images/home/5a.jpg" alt="" />
<img src="uploads/images/home/6a.jpg" alt="" />

Which are the images, now I'm thinking just add a <a href link around them but when I do the images disappear from the slider?

Can someone tell me how to acheive this seriously basic task?

Thankyou

[velden]

Do you have a link to the website?

My guess is that this is more a JS issue then CMSMS

[foley13]

http://visualiser2.flyingatom.co.uk/johnfoster2/ the slider is on the homepage

[Rolf]

Off topic:

{content block="Image Slider"_}

Better remove the last redundant space. It will break CMSMS in latest release with Smarty3

[velden]

I think this should work:

Code: Select all

<a href="http://www.example.com"><img src="uploads/images/home/1a.jpg" alt="" /></a>
<a href="http://www.example.com"><img src="uploads/images/home/2a.jpg" alt="" /></a>
<a href="http://www.example.com"><img src="uploads/images/home/3a.jpg" alt="" /></a>
<a href="http://www.example.com"><img src="uploads/images/home/4a.jpg" alt="" /></a>
<a href="http://www.example.com"><img src="uploads/images/home/5a.jpg" alt="" /></a>
<a href="http://www.example.com"><img src="uploads/images/home/6a.jpg" alt="" /></a>

then in the connected stylesheet (css/screen.css) find and change:

Code: Select all

#mainBanner .pics img {
    cursor: pointer;
    float: left;
    height: 374px;
    margin: 0;
    width: 809px;
}

becomes:

#mainBanner .pics a {
    display : block;
    float: left;
    height: 374px;
    margin: 0;
    width: 809px;
}

And then at the bottom:

Code: Select all

<__script__ type="text/javascript">
$(function() {

// enable circular scrollables with a click handler
$(".scroll").scrollable({ circular: true, speed: 1000, }).autoscroll(7000).click(function() {
	$(this).data("scrollable").next();		
});
});
</__script>

becomes:

<__script__ type="text/javascript">
$(function() {

// enable circular scrollables WITHOUT a click handler
$(".scroll").scrollable({ circular: true, speed: 1000, }).autoscroll(7000);
// I should think the comma after '1000' should not be there!?
});
</__script>

Not tested of course, but guessing it works.

[foley13]

Sorry for the delayed response but thanks for your help and thankyou velden that worked. Thankyou very much.

[psy]

There are many ways to add a link to a page from an image in a slider. See http://forum.cmsmadesimple.org/viewtopi ... =4&t=65055 as an example.

In this case MenuManager looks for pages that have a page image and if so, puts the image in the slider with a link to the page.