AW: Superfish-Menü für JTL-Shop3
Hallo,
Hoffe ich kann helfen, habe selber erst das Superfish-Menü eingebaut!
Punkt1:
im templates/"TEMPLATE_NAME"/templates.xml:
unter: <JS Name="jtl3.js">
habe ich diese 3 Zeilen hinzugefügt:
<File Path="js/superfish/superfish.js" />
<File Path="js/superfish/supersubs.js" />
da ich die .js-Dateien in templates/"TEMPLATE_NAME"/js/superfish/ hineinkopiert habe...
desweiteren habe ich bei
<CSS Name="custom.css">
<File Path="themes/base/base.css" />
<File Path="themes/base/page.css" />
<File Path="themes/base/boxes.css" />
<File Path="themes/base/specific.css" />
<File Path="themes/custom/theme.css" />
<File Path="themes/custom/superfish.css" />
hinzugefügt.
Vorteil hierbei du kannst jedes theme mit superfish nutzen, und bei jedem theme auch die superfish.css anpassen (Farbe....)
natürlich muss auch in jedem themes/custom,dark,green,... ein superfish.css vorhanden sein.
Punkt 2:
desweiteren musst du in der tpl_inc/header_custom.tpl folgendes einfügen:
{literal}
<script type="text/javascript">
// initialise plugins
jQuery(function(){
jQuery('ul.sf-menu').superfish({
pathLevels: 1, // the number of levels of submenus that remain open or are restored using pathClass
delay: 400, // the delay in milliseconds that the mouse can remain outside a submenu without it closing
animation: {opacity:'show',height:'show'}, // an object equivalent to first parameter of jQuery’s .animate() method
speed: 'fast', // speed of the animation. Equivalent to second parameter of jQuery’s .animate() method
disableHI: false, // set to true to disable hoverIntent detection
onInit: function(){}, // callback function fires once Superfish is initialised – 'this' is the containing ul
onBeforeShow: function(){}, // callback function fires just before reveal animation begins – 'this' is the ul about to open
onShow: function(){}, // callback function fires once reveal animation completed – 'this' is the opened ul
onHide: function(){}, //callback function fires after a sub-menu has closed – 'this' is the ul that just closed
minWidth: 12, // minimum width of sub-menus in em units
maxWidth: 27, // maximum width of sub-menus in em units
extraWidth: 1 // extra width can ensure lines don't sometimes turn over
});
});
</script>
{/literal}
<!--[if lt IE 7]>
Vergiss die {literal} blos nicht, sonst funktionieren keine Hovereffekte, Pfeile, ...
sowie die:
<!--Superfish-->
<div id="headercat">
<ul class="sf-menu">{$full_category_tree}</ul>
</div>
<!--Superfish-ende-->
<div id="page_wrapper" class="{get_box_layout}">
<div id="content_wrapper">
{/if}
ich habe es hier eingefügt, da ich dass Superfish-Menü alls letztes im Header_wrapper haben wollte
ich hoffe ich konnte helfen
LG
Christian
Hallo,
Hoffe ich kann helfen, habe selber erst das Superfish-Menü eingebaut!
Punkt1:
im templates/"TEMPLATE_NAME"/templates.xml:
unter: <JS Name="jtl3.js">
habe ich diese 3 Zeilen hinzugefügt:
<File Path="js/superfish/superfish.js" />
<File Path="js/superfish/supersubs.js" />
da ich die .js-Dateien in templates/"TEMPLATE_NAME"/js/superfish/ hineinkopiert habe...
desweiteren habe ich bei
<CSS Name="custom.css">
<File Path="themes/base/base.css" />
<File Path="themes/base/page.css" />
<File Path="themes/base/boxes.css" />
<File Path="themes/base/specific.css" />
<File Path="themes/custom/theme.css" />
<File Path="themes/custom/superfish.css" />
hinzugefügt.
Vorteil hierbei du kannst jedes theme mit superfish nutzen, und bei jedem theme auch die superfish.css anpassen (Farbe....)
natürlich muss auch in jedem themes/custom,dark,green,... ein superfish.css vorhanden sein.
Punkt 2:
desweiteren musst du in der tpl_inc/header_custom.tpl folgendes einfügen:
{literal}
<script type="text/javascript">
// initialise plugins
jQuery(function(){
jQuery('ul.sf-menu').superfish({
pathLevels: 1, // the number of levels of submenus that remain open or are restored using pathClass
delay: 400, // the delay in milliseconds that the mouse can remain outside a submenu without it closing
animation: {opacity:'show',height:'show'}, // an object equivalent to first parameter of jQuery’s .animate() method
speed: 'fast', // speed of the animation. Equivalent to second parameter of jQuery’s .animate() method
disableHI: false, // set to true to disable hoverIntent detection
onInit: function(){}, // callback function fires once Superfish is initialised – 'this' is the containing ul
onBeforeShow: function(){}, // callback function fires just before reveal animation begins – 'this' is the ul about to open
onShow: function(){}, // callback function fires once reveal animation completed – 'this' is the opened ul
onHide: function(){}, //callback function fires after a sub-menu has closed – 'this' is the ul that just closed
minWidth: 12, // minimum width of sub-menus in em units
maxWidth: 27, // maximum width of sub-menus in em units
extraWidth: 1 // extra width can ensure lines don't sometimes turn over
});
});
</script>
{/literal}
<!--[if lt IE 7]>
Vergiss die {literal} blos nicht, sonst funktionieren keine Hovereffekte, Pfeile, ...
sowie die:
<!--Superfish-->
<div id="headercat">
<ul class="sf-menu">{$full_category_tree}</ul>
</div>
<!--Superfish-ende-->
<div id="page_wrapper" class="{get_box_layout}">
<div id="content_wrapper">
{/if}
ich habe es hier eingefügt, da ich dass Superfish-Menü alls letztes im Header_wrapper haben wollte
ich hoffe ich konnte helfen
LG
Christian
