Modul für Bildergalerie

brandy · Post by **brandy** » Sat Jan 01, 2011 9:19 pm

Hallo!

Ich möchte gerne auf der Startseite ein paar Bilder wie auf folgender Seite darstellen - http://www.foto-bobzin.de/! Meine Frage wäre nur ob jemand schon so etwas gemacht hat bzw. es dafür ein dementsprechendes Modul gibt. Eigentlich sind es ja nur slidende DIVs. Wenn mir jemand erklären kann wie man das Sliden macht, hab ich damit auch kein Problem!

Vielen Dank für eure Antwort!

lg

uniqu3 · Post by **uniqu3** » Sat Jan 01, 2011 9:36 pm

Hi,

das kannst Du mit jQuery Kwicks plugin http://www.jeremymartin.name/projects.p ... ect=kwicks ganz einfach umsetzen.
Du könntest es mit content image tag umsetzen oder auch falls es mehrmals auf der Seite verwendet werden sollte das Gallery Modul http://dev.cmsmadesimple.org/projects/gallery nehmen und Template dementschprechend umbauen.

brandy · Post by **brandy** » Wed Jan 26, 2011 6:50 pm

Hallo!

Hat wer eine Idee wie man so etwas verwirklichen kann - http://www.andreasortner.com/ - Interessieren würde mich die Gestaltung auf den Unterseiten, bzw. ob es eine wunderbare Bildverwaltung für CMSMS-Verwaltung gibt?

Vielen Dank für eure Antwort!

uniqu3 · Post by **uniqu3** » Wed Jan 26, 2011 7:12 pm

Lade dir eins meiner Templates herunter (siehe signatur) da kannst Du sehen wie Gallery Modul auch als slider verwendet werden kann.
Im Prinzip brauchst Du nur das Gallery Modul template nehmen es mit jQuery cycle plugin verbinden und daraus ein auf die Seite abgestimmtes Template erstellen.

Hier kannst Du sehen wie Du das Gallery Template + Cycle plugin aufbauen könntest um kleine Bilder links und Große im Inhalt anzuzeigen http://malsup.com/jquery/cycle/pager2.html
Und wenn Du in den quelltext der Seite schaust siehst Du das dort jCarousel verwendet wurde, also http://sorgalla.com/jcarousel/ öffnen und Beispiele ansehen.

brandy · Post by **brandy** » Sun Mar 27, 2011 1:11 pm

Hab mir das Ding jetzt geladen - wie bau ich es aber in ein Template in CMSms ein?

Mein Template sieht so aus:

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}
</head>
</__body>
<div class="container">
<div class="top">&nbsp;</div>
<div class="left">{Gallery}</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>

Abgesehen vom Javascript im Head wie bau ich das Teil da ein?

Vielen Dank für einen Tipp!

brandy · Post by **brandy** » Thu Mar 31, 2011 6:45 pm

Kann mir keiner zumindest einen kleinen Tipp geben?

Vielen Dank!

tbtip · Post by **tbtip** » Fri Apr 01, 2011 5:09 am

Da ich jetzt nicht weiß für welches Modul du dich entschieden hast, kann ich dir leider auch keine fertige Antwort geben.

Bin auch nicht der Experte bei diesen Sachen, aber vom Grundprinzip kann ich dir vielleicht helfen.

Wenn ich es richtig sehe, hast du das Template von deiner Internetseite veröffentlicht.

Solltest du z.B. das Gallery Modul verwendet haben, so kann man die Templates von dem Gallery Modul separat anpassen bzw. neue erzeugen ohne dabei überhaupt im Quellcode des Haupttemplates eingreifen zu müssen.

Schau doch mal da nach falls du das Gallery Modul im Einsatz haben solltest.

Inhalte >> Gallery >> Reiter Templates

Bereits fertige Gallery Templates findest du hier. Vielleicht mußt du da ja nur noch ein paar Anpassarbeiten vornehmen.

brandy · Post by **brandy** » Thu Apr 07, 2011 5:40 am

So jetzt bin ich wieder zurück bei diesem Projekt!

Ja ich hab das Gallery-Modul laufen. Aber jetzt will ich noch, dass die Bilderleiste links nach oben bzw. nach unten läuft und die Bilder im Hauptcontent von links hereinkommen.
Meines Wissens ist das mit dem Jcarousel möglich. Nur leider weiß ich nicht wie ich das schöne Teil in CMSMS integriere! Die Anleitung versteht sich nur für alleinstehende html-Datein.
Ich weiß auch das ich einen eigenen Reiter für Templates habe, wo ich ein eigenes Textfeld für einen Javascript-Code habe. Nur leider versetehe ich nicht was ich da eintragen muss!

Vielleicht hat wer damit Erfahrung!
Vielen Dank!

brandy · Post by **brandy** » Sat Apr 09, 2011 9:04 am

Hallo nochmal!

Am besten ich erklär jetzt alles Schritt für Schritt. Was ich vorhabe wisst ihr ja schon, aber hier nochmals kurz.

Geht mal auf www.foto-riedler.com/index.php - Jetzt seht ihr links eine Gallery, die per Scroll nach oben oder unten fahren soll. Hier werden die einzelnen Projekte mit einem Bild aus dem entsprechenden Projektverzeichnis angezeigt. Bei Klick auf ein solches Bild erscheint das Bild rechts im Content. Hier sollte praktisch wieder ein Scroll sein, dass wenn man weiter klickt das nächste Bild des Projekt erscheint.

So nun hab ich mir das Paket - jsor-jcarousel-0.2.7-0-g951280d.zip - geholt. Ich verstehe grundsätzlich wie das Ding funktioniert, jedoch nicht wie ich das in CMSMS integriere.
Wenn ich ein Gallerytemplate öffne hab ich da ja schon einen bestehenden Javascript-Code drinnen. Muss ich da zusätzlich diesen vom Paket hinzufügen oder reicht hier eine Verlinkung auf das entsprechende Javascript.

Naja dann hoff ich mal, dass mir wer weiterhelfen kann!

Vielen Dank schon mal im Voraus!

uniqu3 · Post by **uniqu3** » Sat Apr 09, 2011 9:39 am

Brandy,
eins der bestehenden Gallery Templates ist für dein vorhaben irrelevant.
Du solltest die andreasortner.com Seite aufrufen (da ja eh schon 1 zu 1 kopie machst) und in denn quelltext nachsehen und ein neues Gallery template erstellen.

In deinem Gallery template brauchst Du dann jcarousel.js, dazugehörende stylesheets (im Stylesheet bereich) und js funktion aufruf wie auf Andreas Ortner Seite (im JavaScript bereich).

Code: Select all

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

Und dein Gallery template könnte ungefähr so aussehen:

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 class="group" href="{$image->file|escape:'url'|replace:'%2F':'/'}" title="{$image->titlename}" rel="gallery-{$galleryid}"><img src="{$image->thumb|escape:'url'|replace:'%2F':'/'}" alt="{$image->titlename}" /></a></li>
{/foreach}
</ul>
</div>
<!-- # Imagebox -->

Das ist kein copy/paste sondern nur ein Gedanken anstoß wie es funktionieren könnte.

brandy · Post by **brandy** » Sat Apr 09, 2011 2:11 pm

Vielen Dank, hat mir schon mal weitergeholfen!

Wie steuere ich das Ding jetzt aber?
Ich hab mal dein Template genommen, wenn ich da jetzt noch zwei Buttons einbaue, wie schreib ich das, dass es hin- und herfährt?

Vielen Dank!

uniqu3 · Post by **uniqu3** » Sat Apr 09, 2011 6:16 pm

Template oben sollte doch nur ein gedanken anstoß und nicht copy/paste lösung sein.
Dir fehlen vermutlich richtige jQuery scripte oder klassen und id's, habe aber jetzt wirklich nicht genau auf deiner Seite nachgesehen.
Guck doch bitte im Quelltext der andreasortner.com seite, dort findest du doch eigentlich alle antworten die du brauchst

Edit: eventuell hier nachlesen http://sorgalla.com/projects/jcarousel/
Auf jeden fall fehlt dir schon mal jcarousel css.

brandy · Post by **brandy** » Fri Apr 29, 2011 5:53 am

Hallo nochmal!

Also die Bildergallerie fährt jetzt wie gewollt - www.foto-riedler.com/index.php, jedoch hätte ich noch eine Frage.
Die Bilder sind in der Gallery folgendermaßen sortiert "Gallery/Kategorie/Name/Bilder" d.h. z.B sieht es so aus: Gallery/Frauen/Lena/IMG_1234.jpg. Wenn ich jetzt in der Gallery auf einen Punkt klicke hüpft er immer eine Ebene tiefer, dh er zeigt zuerst alle Projekte an, beim Klick auf ein Projekt komme ich in die entsprechende Ebene und und sehe alle Fotos eines Projekts.
Wie kann ich verhindern, dass er mir eine Ebene tiefer geht? Es sollten praktisch in der linken vertikalen Liste immer die Projekte zu sehen sein, nicht die einem Projekt zugewiesenen Fotos.

brandy · Post by **brandy** » Mon May 02, 2011 9:47 am

Müsste theoretisch ja nur ein kurzer Code sein, dass er in der Gallerie nicht in die letzte Ebene springt?
Vielleicht hat irgendjemand eine Idee - Vielen DAnk!

brandy · Post by **brandy** » Wed May 04, 2011 1:32 pm

Bzw. wenn ich es nicht verhindern kann, dass er mir in die letzte Ebene hüpft, sollte er mir auf der Seite die eine höhere gelegene Gallerie anzeigen - Bekomm ich das irgendwie hin?

Vielen Dank!

CMS Made Simple Forums

Modul für Bildergalerie

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