Modul für Bildergalerie

uniqu3 · Post by **uniqu3** » Wed May 04, 2011 4:54 pm

Also hier kann ich nur rate Spielchen spielen wie Du das ganze aufgebaut hast.
Ohne dein aufbau, Templates, Gallery aufrufe zu sehen kann ich auch nicht viel sagen.

Vielleicht ist der weg zu deiner Lösung hier http://forum.cmsmadesimple.org/viewtopic.php?t=41491

brandy · Post by **brandy** » Thu May 05, 2011 5:59 am

Sorry - so nun alle Infos:

Gallerytemplate:

Code: Select all

<!-- Thumbnails -->
<div id="thumbnails">
<ul id="thumbs" class="jcarousel jcarousel-skin-thumbs">
{foreach from=$images item=image}
<li><a href="{$image->file}" title="{$image->titlename}"><img src="{$image->thumb|escape:'url'|replace:'%2F':'/'}" alt="{$image->titlename}" /></a></li>
{/foreach}
</ul>
</div>
<!-- # Thumbnails -->

<!-- Imagebox -->
<div id="imagebox">
<ul id="mycarousel" class="jcarousel jcarousel-skin-tango">
{foreach from=$images item=image}
<li><a href="{$image->file|escape:'url'|replace:'%2F':'/'}" title="{$image->titlename}" class="group"><img src="{$image->file|escape:'url'|replace:'%2F':'/'}" alt="{$image->titlename}" /></a></li>
{/foreach}
</ul>
</div>
<!-- # Imagebox -->

Gallery Javascript:

Code: Select all

<__script__ type="text/javascript">
jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel({
      horizonal: true,
        scroll: 1
    });   
   jQuery('#thumbs').jcarousel({
      vertical: true,
        scroll: 3
    });
});
</__script>

Das gehört alles zum jcarousel.
Den Link den du mir gesendet hast, schau ich mir wenn ich zu Hause bin an. Hört sich nicht schlecht an, aber ich müsste das Ding wieder mit dem Jcarousel verbinden.

brandy · Post by **brandy** » Thu May 05, 2011 8:53 am

Hier noch das Template:

Code: Select all

{process_pagedata}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<__html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
<title>{sitename} - {title}</title>
{metadata}
{cms_stylesheet}
<__script__ type="text/javascript" src="lib/jcarousel/jquery-1.4.2.min.js"></__script>
<__script__ type="text/javascript" src="lib/jcarousel/jquery.jcarousel.min.js"></__script>
</head>
</__body>
<div class="container">
<div class="top">&nbsp;</div>
<div class="left">	{Gallery dir='Projekte/Frauen'}<div>
<div class="back_image"><div class="content" id="content">{content}</div></div>
<div class="bottom"><div class="menu_top"> {menu template="Foto Riedler Menü"}</div></div>
</div>
<__body>
</__html>

Falls nochwas benötigt wird bitte melden!

uniqu3 · Post by **uniqu3** » Fri May 06, 2011 8:17 am

Hmm ok ich denke damit kommst Du nicht zum gewünschten resultat auch nicht mit http://forum.cmsmadesimple.org/viewtopic.php?t=41491 glaube ich zumindest.

Hoffentlich habe ich in nächster zeit etwas mehr zeit um mir eine Lösung zu überlegen und testen nur im Moment hätte ich keine vernünftige Antwort.

Ich vermute das Du links nur thumbnails aufrufen musst unabhängig vom Inhalt rechts und im Inhalt rechts müsste Gallery erneut geladen werden mit entsprechenden Bilder.
Lösung wäre wahrscheinlich showtemplate=false (mehr dazu hier http://calguy1000.com/Blogs/9/60/jquery ... -news.html) und etwas jQuery um Gallery Inhalt im {content} bereich zu laden.

Andererseits wäre es fast einfacher im linken bereich eine "Bild" Navigation ohne Gallery zu erstellen.
Für jede Frau/Man eigene Seite mit Vorschaubild "Seite Bearbeiten -> Optionen tab -> Bild dropdown".
So könntest auf jeder Seite richtige Galerie direkt im WYSIWYG/Editor aufrufen.
Natürlich müsste dazu im linken bereich ein entrechendes MenuManager Template erstellt und aufgerufen werden.

Aber wie gesagt da müsste ich wohl selber noch mehr überlegen und testen.
Es könnte aber natürlich auch sein das Jos eine bessere Antowrt dazu hätte.

brandy · Post by **brandy** » Fri May 06, 2011 10:07 am

Ja ok wenn ich jetzt eine Bildnavigation erstelle und mit dieser eine Gallery aufrufe, dann müsste ich ja diese wieder so hinbiegen, dass er mir die Bilder im {Content} ausgibt. Die Frage ist jetzt ob es nicht einfacher wäre, als die Gallery so hinzutrimmen, dass sie nicht in die letzte Ebene springt und dass Design auf die Gallery umzumünzen?

Vielen Dank für die Überlegungen und Denkanstöße!

uniqu3 · Post by **uniqu3** » Fri May 06, 2011 10:30 am

Ja wie erwähnt Möglichkeiten gibt es, was für dich einfacher oder kunden einfacher wäre keine Ahnung

Wenn Du mit jQuery umgehen kannst wäre ja die vorgeschlagene Lösung mit showtemplate=false die richtige.
Du musst ja Inhalt der Galerie über link der Thumbnails mit ajax oder jquery im bereich des Inhalts (also im <div id="imagebox"> </div> laden.

Mit der zweiten variante hättest Du links Navigation (mit thumbnails), Rest wird als inhalt also {content} über Seitenverwaltung eingefügt, dazu brauchst ja nur mehr im WYSIWYG {Gallery dir="Frauen/einefrau"} in jeder Seite einfügen.

brandy · Post by **brandy** » Fri May 06, 2011 11:03 am

Naja die zweite Variante wäre von dem her das einfachste, jedoch mit mehr Verwaltungsaufwand, weil ich nach jedem Upload wieder eine Seite erstellen muss...
Ok werd mir das anschauen, wenn ich was gemacht hab meld ich mich!

Vielen Dank!

brandy · Post by **brandy** » Sun May 08, 2011 4:07 pm

Hallo nochmal - arbeite nun schon an der zweiten Variante und hab folgendes Menutemplate - wie bau ich in dieses nun den img-Tag ein, der mir das Thumbnail, dass ich ihm im Backend der Seite gebe, anzeigt?

Vielen Dank!

uniqu3 · Post by **uniqu3** » Sun May 08, 2011 6:01 pm

Im MenuManager Template kannst Du $node->image oder $node->thumbnail verwenden.
Also in etwa so zum meispiel: <img src="dein/pfad/{$node->thumbnail}" alt="{$node->menutext}" width="150" height="150" />

brandy · Post by **brandy** » Mon May 09, 2011 5:53 am

Welches Bild nimmt er dann? Das Bild, das so heißt wie die Seite? Weil ich kann ja auch ein Bild das unter /uploads liegt in den Seitenoptionen auswählen.

Anbei mal das Menütemplate:

Code: Select all

{* CSS classes used in this template:
.currentpage - The active/current page
.bullet_sectionheader - To style section header
hr.separator - To style the ruler for the separator *} 
{if $count > 0}
<ul class="clearfix">
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="<ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</li>
{elseif $node->index > 0}</li>
{/if}

{if $node->current == true}
<li><div class="menulink_left"><a href="{$node->url}" class="currentpage"{if $node->target ne ""} target="{$node->target}"{/if}> <img src="uploads/{$node->thumbnail}" alt="{$node->menutext}" width="150" height="150" /> </a></div>

{elseif $node->parent == true && $node->depth == 1 and $node->type != 'sectionheader' and $node->type != 'separator'}
<li class="activeparent"> <div class="menulink_left"><a href="{$node->url}" class="activeparent"{if $node->target ne ""} target="{$node->target}"{/if}> <img src="uploads/{$node->thumbnail}" alt="{$node->menutext}" width="150" height="150" /> </a></div>

{elseif $node->type == 'sectionheader'}
<li class="sectionheader"><div class="menulink_left">{$node->menutext}

{elseif $node->type == 'separator'}
<li style="list-style-type: none;"><hr class="separator_left"/>

{else}
<li><div class="menulink_left"><a href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}> <img src="uploads/{$node->thumbnail}" alt="{$node->menutext}" width="150" height="150" /></a></div>

{/if}
{/foreach}

{repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}

uniqu3 · Post by **uniqu3** » Mon May 09, 2011 7:59 am

Es wird das ausgewählte Bild ausgegeben.

brandy · Post by **brandy** » Mon May 09, 2011 12:14 pm

Vielen Dank - muss mir das nochmal anschauen wegen dem Bild - kanns momentan nicht hochladen!

Ich war gerade auf der Suche nach einem Tool mit dem man ein DIV scrollen lassen kann und bin auch gleich auf dieses hier gestoßen - http://www.dyn-web.com/code/scroll/. Schaut verdammt gut aus und funktioniert auch, nur leider müsste ich es auf onclick umbauen - vielleicht hast du als Javascriptler eine Ahnung davon wie das funktioniert bzw. hast eine einfachere Lösung!

brandy · Post by **brandy** » Mon May 09, 2011 12:57 pm

Ok sorry zu früh gepostet - habs schon!
Thanks...

brandy · Post by **brandy** » Mon May 09, 2011 4:48 pm

Hallo nochmal - kennt wer ein ähnliches Teil bzw. weiß jemand eine gute Seite, wo beschrieben wird, wie man ein DIV scrollen lässt? Die Lizenz auf dieser Seite kostet etwas, ausser man nutzt das Teil nur innerhalb einer Familie!

Vielen Dank!

uniqu3 · Post by **uniqu3** » Mon May 09, 2011 8:53 pm

http://www.kelvinluck.com/assets/jquery ... basic.html
http://jscrollpane.kelvinluck.com/

CMS Made Simple Forums

Modul für Bildergalerie

Re: Modul für Bildergalerie

Re: Modul für Bildergalerie

Re: Modul für Bildergalerie

Re: Modul für Bildergalerie

Re: Modul für Bildergalerie

Re: Modul für Bildergalerie

Re: Modul für Bildergalerie

Re: Modul für Bildergalerie

Re: Modul für Bildergalerie

Re: Modul für Bildergalerie

Re: Modul für Bildergalerie

Re: Modul für Bildergalerie

Re: Modul für Bildergalerie

Re: Modul für Bildergalerie

Re: Modul für Bildergalerie