Page 1 of 1
lightbox aan newsmodule toevoegen
Posted: Fri Aug 31, 2012 9:23 am
by andre_designer
hallo
ik wil een lightbox aan het news artikel template toevoegen op deze manier
nu heb al geprobeerd hier mcfactory voor te gebruiken voor makkelijk uploaden van afbeeldingen maar als ik dan daar een template in mcfactory voor aanmaak dan moet ik daar een foreach loop voor aanmaken met als gevolg dat ik meerdere Afbeeldingen krijg in het ZELFDE artikel en ik wil één lightbox/afbeelding in één artikel. dus ik wil zeg maar 1 lightbox in 1 samengevat news item en 1 lightbox in het uitgebreide volledige artikel.
ik wil als het ware de mcfactory geproduceerde module toevoegen aan new module template het enige probleem waar ik tegen aanloop is als ik de module tag toevoeg aan het news sjabloon (dit lukt/kan ook wel) dat als ik vervolgens afbeeldingen ga toevoegen in de geproduceerde module meerdere lightboxen aan één news artikel krijgt toe gevoegd en ik wil 1 lightbox per artikel en een makkelijke manier om foto's te uploaden zoals in de afbeelding.
Dacht dit te doen met mcfactory maar dan voegd ie meerdere lightboxen aan één artikel toe. en ik wil er één. weet iemand een makkelijke manier om een lightbox toevoegen aan een news artikel en een makkelijke manier om de afbeeldingen te uploaden.
zodat het er uitziet als de afbeelding hierboven??
Of weet iemand een module waar je een lightbox toe kan voegen aan de news sjabloon?? En makkelijk foto's kan uploaden!!
Re: lightbox aan newsmodule toevoegen
Posted: Mon Sep 03, 2012 9:30 pm
by velden
Volgens mij kun je beter de zaken wat uit elkaar trekken:
1. De news module heeft een eigen mogelijkheid om images toe te voegen via 'Field Definitions' -> File
Bij het aanmaken van een nieuwsbericht kun je dan een lokaal bestand (of meer als je meer Fields hebt aangemaakt) kiezen en deze worden geupload naar een eigen directory per news item.
Vervolgens kun je deze afbeelding(en) in de samenvatting- en detail templates gebruiken.
1a. ik gebruik zelf vaak de SuperSizer plugin om de foto's automatisch te laten resizen naar het gewenste formaat.
2. lightbox integreren zou je prima kunnen doen door in de head van het template (of in de 'Page Specific Metadata' van de betreffende nieuws-pagina's (summary-pagina en detail-pagina)) de lightbox scripts te linken.
3. een jQuery aanroep om de lightbox(es) te activeren op de gewenste images
4. volgens mij kun je in lightbox verschillende 'groups' van images aanmaken die ieder hun eigen lightbox krijgen
http://lokeshdhakar.com/projects/lightbox2/#how
<a href="images/image-1.jpg" rel="lightbox[roadtrip]">image #1</a>
<a href="images/image-2.jpg" rel="lightbox[roadtrip]">image #2</a>
<a href="images/image-3.jpg" rel="lightbox[roadtrip]">image #3</a>
In bovenstaand voorbeeld horen de 'roadtrip' images bij elkaar. Maar je kunt natuurlijk i.p.v. 'roadtrip' overal een unieke waarde invullen. Ik denk dat nieuwsitem-ID of alias wel beschikbaar is daarvoor.
Denk dat het op bovenstaande manier wel te maken moet zijn.
Re: lightbox aan newsmodule toevoegen
Posted: Wed Sep 05, 2012 9:59 pm
by andre_designer
Bij het aanmaken van een nieuwsbericht kun je dan een lokaal bestand (of meer als je meer Fields hebt aangemaakt) kiezen en deze worden geupload naar een eigen directory per news item.
Vervolgens kun je deze afbeelding(en) in de samenvatting- en detail templates gebruiken.
Ik heb een upload veld aangemaakt en ik kan er afbeeldingen naar uploaden maar hoe kan ik er nu voor zorgen dat ik de afbeelding automatisch aan het artikel word toegevoegd?? Ik had hiervoor gedacht mcfactory te gebruiken en dit kan opzich ook wel WARE HET NIET als ik de module gegenereerde smarty tag toevoeg aan het samenvatting en -detail sjabloon en dan meedere afbeeldingen ga toevoegen met de door de mcfactory gegenereerde module dat dan MEERDERE afbeeldingen in ALLE artikelen verschijnen ipv één verschillende afbeelding in één artikel verschijnt . dit komt doordat er in mcfactory een foreach loop wordt gebruikt wordt EN in de nieuws sjablonen een foreach wordt gebruikt.ik weet alleen niet hoe ik dit anders moet oplossen/ aanpakken Ik weet hoe het komt Maar ik weet niet hoe ik dit anders moet aanpakken/oplossen.( Ik heb een stukje van de oplossing.) Het is iets met smarty .Only the big question is What and how!! mijn smarty kennis is onder de maat (helaas!!). Het grote voordeel van mcfactory kunnen gebruik is dat ik afbeeldingen kan toevoegen Zonder in de html-code hoeft te spitten.
Ik snap eigenlijk niet zo goed hoe ik de afbeelding/ de code kan kiezen op de manier die jij beschrijft. kun je dit uitleggen hoe je dit doet. Eigenlijk wil ik hier mcfactory voor gebruiken omdat je dan afbeeldingen kan toevoegen zonder code te kennen. alleen het probleem is nu als ik nu de code tag toevoegen aan de templates dat dan ALLE afbeeldingen in ALLE nieuws artikelen komen te staan hoe kan ik dit oplossen?? Het is iets met smarty. Only What. iemand ideeën/ suggesties!!??
Re: lightbox aan newsmodule toevoegen
Posted: Mon Sep 10, 2012 12:07 pm
by velden
Sorry, lees je reactie nu pas.
Hieronder een voorbeeld dat ik gebruik voor een website waar ik cmsms heb geimplementeerd:
SummaryTemplate
Code: Select all
{foreach from=$items item=entry name=loop}
{if $smarty.foreach.loop.first}
<div class="NewsSummary first">
<div class="news-text">
{if $entry->postdate}
<div class="NewsSummaryPostdate">
{$entry->postdate|cms_date_format}
</div>
{/if}
<h1 class="title">
{$entry->title|cms_escape}
</h1>
{if $entry->summary}
<div class="NewsSummarySummary">
{eval var=$entry->summary assign="summary"}{$summary|strip_tags|truncate:350:"":false} <a class="moreurl" href="{$entry->moreurl}" title="{$entry->title|cms_escape:htmlall}">lees meer...</a>
</div>
{else if $entry->content}
<div class="NewsSummaryContent">
{eval var=$entry->content assign="summary"}{$summary|strip_tags:true|truncate:350:"":false} <a class="moreurl" href="{$entry->moreurl}" title="{$entry->title|cms_escape:htmlall}">lees meer...</a>
</div>
{/if}
</div>
{if isset($entry->fields)}
{if $entry->fieldsbyname.afbeelding1}
{supersizer path="`$entry->file_location`/`$entry->fieldsbyname.afbeelding1->value`" strip_tags=true crop="true" width=437 height=288 protect=false class="news-image" alt="" width_attr="437" height_attr="288"}
{/if}
{/if}
<div style="clear : both;"></div>
</div>
{else}{*not first*}
<div class="NewsSummary">
{if isset($entry->fields)}
{if $entry->fieldsbyname.afbeelding1}
{supersizer path="`$entry->file_location`/`$entry->fieldsbyname.afbeelding1->value`" strip_tags=true crop="true" width=232 height=152 protect=false class="news-image" alt="" width_attr="232" height_attr="152"}
{/if}{/if}
<div class="news-text">
{if $entry->postdate}
<div class="NewsSummaryPostdate">
{$entry->postdate|cms_date_format}
</div>
{/if}
<h3 class="title">
{$entry->title|cms_escape}
</h3>
{if $entry->summary}
<div class="NewsSummarySummary">
{eval var=$entry->summary assign="summary"}{$summary|strip_tags|truncate:400:"":false} <a class="moreurl" href="{$entry->moreurl}" title="{$entry->title|cms_escape:htmlall}">lees meer...</a>
</div>
{else if $entry->content}
<div class="NewsSummaryContent">
{eval var=$entry->content assign="summary"}{$summary|strip_tags:true|truncate:400:"":false} <a class="moreurl" href="{$entry->moreurl}" title="{$entry->title|cms_escape:htmlall}">lees meer...</a>
</div>
{/if}
</div>
<div style="clear : both;"></div>
</div>
{/if}
{/foreach}
<!-- End News Display Template -->
Wellicht niet de meest efficiente code maar het werkt wel.
Het is overigens wel iets complexer dan wat jij nodig hebt denk ik. Dit template geeft namelijk een andere layout voor het eerste item, dan voor de volgende items.
Die regel controleert of het het eerste (laatste nieuwe) nieuwsitem is.
Je ziet ook gelijk het gebruik van Supersizer plugin. Erg makkelijk om ervoor te zorgen dat images altijd in het juiste formaat gepresenteerd worden.
Resultaat kun je zien op:
http://www.vandingenentransport.nl/inde ... age=nieuws
