Page 1 of 3

scrollable content [opgelost]

Posted: Sun Jan 22, 2012 8:15 pm
by Gregor
Ik heb een serie uitspraken over zeilen :-) die wil ik op de voorpagina laten zien. Mijn eerste gedachte was om News icm NFS te gebruiken, echter bij deze uitspraken is geen 'title', welke wel verplicht is bij news. Nu zou ik hier de auteur kunnen zetten en dan in 'content' de feitelijke uitspraak.

Is er iemand die een andere suggestie heeft? Om een idee van uitspraken te krijgen http://www.uisge-beatha.eu/zeiluitspraken.html Aanvullen mag :-)

Gregor

Re: scrollable content

Posted: Sun Jan 22, 2012 10:24 pm
by Rolf

Re: scrollable content

Posted: Mon Jan 23, 2012 5:40 am
by Gregor
Ehhhhh, ja ::)

Gregor

Re: scrollable content

Posted: Mon Jan 23, 2012 7:44 am
by Rolf
Opnemen in de head van de website:

Code: Select all

{cms_jquery}

{literal}
<__script__ type="text/javascript" src="http://www.JOUWEIGENWEBSITENAAM,NL/scripts/jquery.cycle.all.min.js"></__script>
<__script__ type="text/javascript">
$(document).ready(function() {
    $('.slider').cycle({
          fx: 'scrollRight',
          timeout: 5000,
          pause: 1
      });
});
</__script>
{/literal}
{cms_jquery} zorgt voor de basis aanroep van jQuery code vanuit het CMS. Kan zijn dat je al jQuery (Gallery, Album, ...) op je website gebruikt... Dan hoeft dit dus niet. Let wel op dat deze aanroep eerder is dan de rest van de code, anders werkt het natuurlijk niet.

Dan een aanroep naar een los bestand die op de webserver moet worden geplaatst.
Hier kun je hem downloaden: http://jquery.malsup.com/cycle/download.html
Meer informatie over deze parameters vind je hier: http://jquery.malsup.com/cycle/options.html

Opnemen in de website.
De basis is:

Code: Select all

<ul class="slider">
<li>...</li>
<li>...</li>
<li>...</li>
</ul>
Dus je zou de uitspraken kunnen opnemen in een HTML blok...

Of in een module (Bijv. News)

Code: Select all

<ul class="slider">
{foreach from=$items item=entry}
<li><div class="NewsSummary">

{* Allerlei HTML en Smarty code *}

</div></li>
{/foreach}
</ul>
Velden die je vanuit News niet gebruikt, hoef je dus ook niet op te nemen in het sjabloon.

grt. Rolf :)

Re: scrollable content

Posted: Mon Jan 23, 2012 8:17 am
by Gregor
Thanks Rolf!! Ik zal daar vanavond eens induiken. Is lijkt een lichtere oplossing dan de NFS-variant.

Een enkele keer krijg ik een uitspraak erbij, iemand stuurt die via het contactformulier en die plaats ik dan in de bewuste pagina. Een kleine moeite om het in een html-blok te doen, een GCB aanmaken met daarin een opsomming.

Gregor

Re: scrollable content

Posted: Mon Jan 23, 2012 5:24 pm
by Gregor
Er is progressie :) Op deze link is te zien hoe het er nu uit ziet:
http://www.uisge-beatha.eu/homepage.html

Ik heb een GCB 'zeiluitspraken aangemaakt met daarin:

Code: Select all

<div id="zeiluitspraken">
<ul class="slider">
<li>Koop een boot en werk je dood<br /><em>Joop de Graaf Sr.</em></li>
<li>Hoe groter de boot<br />Hoe korter op het water</li>
....
</ul>
</div>
In de template staat: {global_content name='Zeiluitspraken'}

In het css staat:

Code: Select all

#zeiluitspraken {
   width: 98%;
   height: auto;
   background-color: #8af753; /* tijdelijk voor het visuele effect */
}

ul.slider {
   height: auto;
}
ul.slider li {
   width: 99%;
   height: auto;
}
ul.slider li em {
}
Kijkend naar de pagina, valt op
A) dat de tekst soms buiten het blok loopt
B) de hoogte vooraf niet bekend is.

Ik denk dat mijn css niet goed is, maar kan dat niet met zekerheid bepalen. Iemand die daar zijn/haar licht over wil laten schijnen?

Gregor

Re: scrollable content

Posted: Mon Jan 23, 2012 5:55 pm
by Rolf
Je zult de breedte van de ul.slider li moeten beperken in pixels en niet in percentage. Dan ben je al wat verder denk ik

®

Re: scrollable content

Posted: Mon Jan 23, 2012 6:09 pm
by Gregor
Helaas Rolf, welke waarde ik in px ook invul, geen enkele verandering in breedte. Is de aanroep wel juist in het stylesheet?

Gregor

Re: scrollable content

Posted: Mon Jan 23, 2012 9:04 pm
by timdebuurman
Misschien ook wat mooier om een padding in te stellen in de div zeiluitspraken.

is nu:

#zeiluitspraken {
background-color: #8AF753;
height: auto;
width: 200px;

wordt:

#zeiluitspraken {
background-color: #8AF753;
height: auto;
width: 180px;
padding: 10px;

Re: scrollable content

Posted: Tue Jan 24, 2012 7:30 am
by Gregor
Dank voor de tip.

Gregor

Re: scrollable content [opgelost]

Posted: Tue Apr 24, 2012 2:50 pm
by timdebuurman
Even een vraagje aan de hand van dit topic.

Is het (makkelijk) te doen om als content de samenvattingen van de Products-module te laten wisselen?

Hoe zou dat gecodeerd moeten worden?

Re: scrollable content [opgelost]

Posted: Tue Apr 24, 2012 3:04 pm
by Rolf
timdebuurman wrote:Is het (makkelijk) te doen om als content de samenvattingen van de Products-module te laten wisselen?
Je kunt in de list van alles zetten.
Je kunt deze dus ook laten vullen in de Products module, even een snel samenvatting voorbeeldje:

Code: Select all

<ul class="slider">
{foreach from=$items item=entry}
<li>
<a href="{$entry->detail_url}">{$entry->product_name}</a>&nbsp;({$entry->weight}{$weight_units})&nbsp;&nbsp;{$currency_symbol}{$entry->price}
</li>
{/foreach}
</ul>

Re: scrollable content [opgelost]

Posted: Tue Apr 24, 2012 3:08 pm
by timdebuurman
Hoeft er dan niet ergens op de pagina aangegeven worden dat het om variabelen gaat uit de products-module?

Of worden die automatisch over de hele website beschikbaar?

Re: scrollable content [opgelost]

Posted: Tue Apr 24, 2012 3:25 pm
by Rolf
Nee, dit *is* een Products samenvatting sjabloon...

Re: scrollable content [opgelost]

Posted: Tue Apr 24, 2012 6:05 pm
by timdebuurman
Ah!
Thx, ik had m zo in de gallery-module gezet anders, dan had het dus niet gewerkt.

Ik ga ermee aan de gang.