Welche Anpassungen für jquery Tabs?

[Toby]

Hi,
ich möchte in eine alte Version die Produkt jquery Tabs einbauen.
Welche Anpassungen muss ich da alles machen?

Vielen Dank

Linkback: https://www.modified-shop.org/forum/index.php?topic=26087.0

[Toby]

Sorry, habs schon gefunden.
Alles gut

[jannemann]

Hallo Toby,

dann teile doch deine Lösung oder den Link mit der Community

Schöne Grüße,
Jan

[Toby]

Also,
wer die jquery Tabs in der Produkt Info nachträglich noch irgendwie einbauen möchte, der macht folgendes:

/template/css/general.css einfügen:

Code: PHP  [Auswählen]

<?php // BOF - web28 - 2010-07-09 - TABS/ACCORDION in product_info ?>
<?php
if (strstr($PHP_SELF, FILENAME_PRODUCT_INFO )) {
?>
<link rel="stylesheet" href="<?php echo 'templates/'.CURRENT_TEMPLATE; ?>/css/jquery-ui.css" type="text/css" media="screen" />
<?php
}
?>
<?php // EOF - web28 - 2010-07-09 - TABS/ACCORDION in product_info ?>

in /template/javascript/general.js einfügen:

Code: PHP  [Auswählen]

<script src="<?php echo 'templates/'.CURRENT_TEMPLATE; ?>/javascript/jquery.js" type="text/javascript"></script>

und das:

Code: PHP  [Auswählen]

<?php // BOF - web28 - 2010-07-09 - TABS/ACCORDION in product_info ?>
<?php
if (strstr($PHP_SELF, FILENAME_PRODUCT_INFO )) {
?>
<script src="<?php echo 'templates/'.CURRENT_TEMPLATE; ?>/javascript/jquery-ui.js" type="text/javascript"></script>
<script type="text/javascript">
/* <![CDATA[ */
        //Laden einer CSS Datei mit jquery     
    $.get("<?php echo 'templates/'.CURRENT_TEMPLATE; ?>"+"/css/javascript.css", function(css) {
                $("head").append("<style type='text/css'>"+css+"<\/style>");
        });
       
        $(function() {
                $("#tabbed_product_info").tabs();
                $("#accordion_product_info").accordion({ autoHeight: false });
        });
/*]]>*/
</script>
<?php
}
?>
<?php // EOF - web28 - 2010-07-09 - TABS/ACCORDION in product_info ?>

dann in /template/stylesheet.css einfügen:

Code: PHP  [Auswählen]

/* BOF - web28 - 2010-07-25 - NO JAVASCRIPT FALLBACK für TABS/ACCORDION in product_info */
#tabbed_product_info ul,#accordion_product_info h3 a {
display:none;
}

#tabbed_product_info .morepics {
background-color:#ededed;
padding:6px;
border-width:1px 0 0 0;
width:512px;
margin-bottom:17px;
}
/* EOF - web28 - 2010-07-25 - NO JAVASCRIPT FALLBACK für TABS/ACCORDION in product_info */

/* BOF - web28 - 2010-07-25 - FIX DER AUFZÄHLUNGEN IM CONTENT  für TABS/ACCORDION in product_info */
#tab_description ol, #tab_description ul, #accordion_product_info ol, #accordion_product_info ul{
margin:10px 0 10px 22px;
display:block;
}
/* EOF - web28 - 2010-07-25 - FIX DER AUFZÄHLUNGEN IM CONTENT  für TABS/ACCORDION in product_info */

und dann noch in /template/module/product_info/product_info_tabs_v1 einfügen:

Code: PHP  [Auswählen]

{*BEGIN TABS*}
<div id="tabbed_product_info" style="margin-top:40px;">

<ul>
        {if $PRODUCTS_DESCRIPTION !=''}<li><a href="#tab_description">{#description#}</a></li>{/if}
        {if $MODULE_cross_selling != '' || $MODULE_reverse_cross_selling != ''}<li><a href="#tab_cross_selling">{#cross_selling#}</a></li>{/if}
        {if $MODULE_also_purchased != ''}<li><a href="#tab_also_purchased">{#also_purchased#}</a></li>{/if}
        {if $MODULE_products_reviews != ''}<li><a href="#tab_reviews">{#products_reviews#}</a></li>{/if}
        {if $MODULE_products_media != ''}<li><a href="#tab_media">{#products_media#}</a></li>{/if}
        {if $more_images|@count > 0}<li><a href="#tab_more_images">{#more_images#}</a></li>{/if}
</ul>

{if $PRODUCTS_DESCRIPTION !=''}<div id="tab_description">{$PRODUCTS_DESCRIPTION}</div>{/if}
{if $more_images|@count > 0}<div id="tab_more_images">
        <!-- More Pictures -->
        <div class="morepics">
        {foreach item=more_images_data from=$more_images}
                <a class="thickbox" rel="{$PRODUCTS_ID}" title="{$PRODUCTS_NAME}" href="{$more_images_data.PRODUCTS_IMAGE|replace:"info_images":"popup_images"}"><img align="left" src="{$more_images_data.PRODUCTS_IMAGE}" alt="{$PRODUCTS_NAME}" /></a>                          
        {/foreach}
        </div>
        <div style="clear:both;"></div>
        </div>
{/if}
{if $MODULE_products_media != ''}<div id="tab_media">{$MODULE_products_media}</div>{/if}
{if $MODULE_products_reviews != ''}<div id="tab_reviews" style="padding-bottom:40px;">{$MODULE_products_reviews}</div>{/if}
{if $MODULE_cross_selling != '' || $MODULE_reverse_cross_selling != ''}<div id="tab_cross_selling">{$MODULE_cross_selling}{if $MODULE_reverse_cross_selling != ''}{$MODULE_reverse_cross_selling}{/if}</div>{/if}
{if $MODULE_also_purchased != ''}<div id="tab_also_purchased">{$MODULE_also_purchased}</div>{/if}

</div>
{*END TABS*}

Nun noch folgende Dateien hochladen aus modified Installationspaket:
/template/css/javascript.css
/template/css/jquery-ui.css
/template/css/images (kompletter Ordner)
/template/javascript/jquery-ui.js
/template/javascript/jquery.js

Ich hoffe ich habe nichts vergessen:)
Vielleicht kann es ja jemand gebrauchen.

[web28]

In eine alte VEsrion sollte man gar nichts mehr einbauen, sondern auf die aktuelle Shopversion updaten.

Shopversionen älter als 1.05 SP1d sollten nicht mehr benutzt werden!