Seite 1 von 1

Modul mit "Tool-Tipp"

Verfasst: Di 18. Mai 2010, 09:06
von JoZi63
Hallo Contenidos,

ich bin neu hier im Forum und echt begeistert von Contenido. Das Forum konnte mir schon oft weiterhelfen. Aber nun brauche ich doch mal Hilfe von Euch contenido-Profis.

Mein Problem:
Ich habe eine Geräte-Detail-Seite auf der am unteren Ende bis zu fünf Boxen mit möglichem Zubehör angezeit werden sollen. Diese Boxen sind 100 X 100 pixel groß. Also zu klein, um einen Beschreibungstext hinzuzufügen. Eine Vergrößerung der Boxen ist - wegen dem Layout - nicht möglich. Daher habe ich mir gedacht, machst Du halt einen "Tool-Tipp". Wenn man mit der Maus über das Bild des Zubehörs fährt öffnet sich - via JS - ein ausgeblendeter DIV mit dem Beschreibungstext.
Soweit gut.

Meine Ansätze:
Zuerst habe ich das Standard-BildModul folgendermaßen angepasst:

Code: Alles auswählen

<?php
    $setting['image']      = "CMS_IMG[105]";
    $setting['desc']        = "CMS_IMGDESCR[105]";

        if ( $setting['image'] != '' or $edit ) 
        {
            list($myWidth, $myHeight, $myType, $myAttributes) = getimagesize(str_replace($cfgClient[$client]["path"]["htmlpath"], $cfgClient[$client]["path"]["frontend"],$setting['image'])); // hier $setting['image']

            if( $setting['image'] )
            {
               echo "<img src=\" " .$setting['image']. " \" onmouseout=\"javascript:popup_zbh_box('zbh_box_1')\" onmouseover=\"javascript:popup_zbh_box('zbh_box_1')\" border=\"0\" width=\"95\" height=\"95\">";
            }
            
            if( $setting['desc'] )
            {
            	echo "<div class=\"popup_zbh_beschreibung\" id=\"zbh_box_1\">";
            	echo $setting['desc'];
                echo "</div>";
            }
        }
    unset( $setting );
?>


Der Gedanke dahinter war, dass der Redakteur den Beschreibungstext als Bildbeschreibung ins Modul tippert und gut ist. Aber leider wurde mir nun das Icon für den Redakteur, um ein Bild zu Implementieren...

Der zweite Ansatz war folgender:

Code: Alles auswählen

<?php
    $setting['image']      = "CMS_IMG[105]";
    $setting['desc']        = "CMS_IMGDESCR[105]";

        if ( $setting['image'] != '' or $edit ) 
        {
            list($myWidth, $myHeight, $myType, $myAttributes) = getimagesize(str_replace($cfgClient[$client]["path"]["htmlpath"], $cfgClient[$client]["path"]["frontend"],$setting['image'])); // hier $setting['image']

            if( $setting['image'] )
            {
               echo "<img src=\" " .$setting['image']. " \" onmouseout=\"javascript:popup_zbh_box('zbh_box_1')\" onmouseover=\"javascript:popup_zbh_box('zbh_box_1')\" border=\"0\" width=\"95\" height=\"95\">";
            }
            
           	echo $setting['desc'];
           
        }
    unset( $setting );

?>

<div class="popup_zbh_beschreibung" id="zbh_box_1">

	<?php
        if (!isset($tpl) || !is_object($tpl)) 
        {
            $tpl = new Template();
        }
        
        if("CMS_HTML[15]" != "")
        {
            $tpl->reset();
            $tpl->set('s', 'text', "CMS_HTML[15]");
            $tpl->generate('templates/text_zbh_box_1.html');    
        }
        
	?>
  
</div> 
Ich habe in den Pop-Up-Div ein Text-Modul eingebaut. Auch das funzt - technisch - soweit wie es soll. Allerdings kommt auch hier der Redakteur im Backend (TinyMCE) nicht an das Text-Modul dran, weil es ja nur aufpoppt, wenn man das Bild mit der Maus "überfährt" :-)

Bei einer Artikelliste kann ich ja leider nur Kategorien auswählen und nicht innerhalb eine Kategorie bestimmte Artikel.

Kann mir jemand von Euch weiterhelfen - mir einen Tipp geben, wie ich das Problem lösen kann. Mir fällt im Moment jedenfalls keine Lösung dazu ein.

Schonmal vielen Dank für Eure Unterstützung und Hilfe.

Gruß

Jörg

Re: Modul mit "Tool-Tipp"

Verfasst: Di 18. Mai 2010, 09:41
von Oldperl
Hallo Jörg,

erst einmal willkommen im Contenido Forum. :-)

Warum nimmst du denn für die Darstellung im Backend nicht einfach ein angezeigtes div?
Ich würde halt, abhängig von $edit, eine andere css-Klasse zuweisen. Damit kannst du dann den div-Tag wie gewünscht formatieren.

Gruß aus Franken

Ortwin

Re: Modul mit "Tool-Tipp"

Verfasst: Di 18. Mai 2010, 09:54
von JoZi63
Hallo Ortwin,

ich glaube ich stehe grade aufm Schlauch :lol: Wie meinst Du das?
Ich hatte auch schon

Code: Alles auswählen

<?php
    $setting['image']      = "CMS_IMG[105]";
    $setting['desc']        = "CMS_IMGDESCR[105]";

        if ( $setting['image'] != '' or $edit ) 
        {
            list($myWidth, $myHeight, $myType, $myAttributes) = getimagesize(str_replace($cfgClient[$client]["path"]["htmlpath"], $cfgClient[$client]["path"]["frontend"],$setting['image'])); // hier $setting['image']

            if( $setting['image'] )
            {
               echo "<img src=\" " .$setting['image']. " \" onmouseout=\"javascript:popup_zbh_box('zbh_box_1')\" onmouseover=\"javascript:popup_zbh_box('zbh_box_1')\" border=\"0\" width=\"95\" height=\"95\">";
            }
            
            if( $setting['desc']  != "" OR $edit )
            {
            	echo "<div class=\"popup_zbh_beschreibung\" id=\"zbh_box_1\">";
            	echo $setting['desc'];
                echo "</div>";
            }
        }
    unset( $setting );

Aber auch hier war das Icon nicht zu fassen zu bekommen...
Oder soll ich den Div in der zweiten Lösung (TextModul) so abfragen????
Kannst Du mir dazu noch etwas Hilfestellung geben?

Außerdem habe ich dann ja das Problem, das die DIV-Tags sich gegenseitig überlappen würden...

Code: Alles auswählen

div.popup_zbh_beschreibung{
    width:250px;
    height:140px;    
    padding:5px;
    background:#eeeeee;
    border:1px solid #ddd;
    position:relative;
    top:-190px;
    left:25px;
    display:none;
    text-align:left;
}

...wäre ja auch nicht sonderlich hilfreich für den Redakteur

Danke sehr.


Gruß

Jörg

Re: Modul mit "Tool-Tipp"

Verfasst: Di 18. Mai 2010, 12:11
von JoZi63
Hallo Contenidos,

zunächst mal Danke an Ortwin für die schnelle Antwort und die Willkommensgrüße... :-)
Nachdem ich nun ein wenig rum probiert habe, habe ich es folgendermaßen gelöst:

Code: Alles auswählen

...
if( !$edit)
{
    echo "<div class=\"popup_zbh_beschreibung\" id=\"zbh_box_1\">";
}
else
{
    echo "<div style=\"width:250px;height:140px;padding:5px;background:#eeeeee;border:1px solid #ddd;text-align:left;\">"; 
}
...
Nun werden die Boxen im Backend angezeigt und im Frontend nur dann, wenn ein mouseover auf das Bild gemacht wird...

Vielen Dank für deinen Tipp Ortwin.

Schönen Gruß an adie Community :-)

Jörg