Product Page Tabs always Expanded

[TFPtMaster]

Hello

 

I'm looking for a solution to have all the tabs in the product page always expanded. I'm using prestashop 1.5.6.1

 

Something like this.

 

[NemoPS]

Could you share the site's url?

[TFPtMaster]

Could you share the site's url?

Hi Nemo.

 

Thank you for your reply.

 

I kinda got a solution i only need to be able to minimize the categories like in the image.

 

http://www.audiophonics.fr/fr/boitiers-aluminium/boitier-aluminium-pour-dac-i-sabre-v2-raspberry-pi-20-b-p-10280.html

 

Ty

[TFPtMaster]

Maybe you can help me. I'm having a little problem when i chose the last tab (reviews) everything disapears.

[NemoPS]

That tpl is missing the code other have, like this 

id="idTab2"

Anyway you got duplicate ids on the page

[TFPtMaster]

That tpl is missing the code other have, like this 

 

id="idTab2"

 

Anyway you got duplicate ids on the page

 

Hi Nemo

 

Thank you for the reply. Maybe i did not understand what you said.

 

But here you can find my code

<!-- description and features -->
{if (isset($product) && $product->description) || (isset($features) && $features) || (isset($accessories) && $accessories) || (isset($HOOK_PRODUCT_TAB) && $HOOK_PRODUCT_TAB) || (isset($attachments) && $attachments)}
	<div id="more_info_block">
		<ul class="shortcutList">
            <li><a class="active" href="#">{l s='Product'}</a></li>
            {if $product->description}<li><a href="#idTab1">{l s='Description'}</a></li>{/if}
            {if $features}<li><a href="#idTab2">{l s='Data sheet'}</a></li>{/if}
            {if $attachments}<li><a href="#idTab9">{l s='Download'}</a></li>{/if}
            {if isset($accessories) AND $accessories}<li><a href="#idTab4">{l s='Accessories'}</a></li>{/if}
			{$HOOK_PRODUCT_TAB}
</ul>
		<div>
			
			<!-- description -->
			{if isset($product) && $product->description}
			<section class="page-product-box">
				<ul></ul>
					<h3 class="page-product-heading">{l s='Description'}</h3>
						<ul id="idTab1" class="bullet" style="border: 1px solid rgb(234, 234, 234);">
							<div>
								<div itemprop="description">
									{$product->description}
								</div>
							</div>
						</ul>
			</section>
			{/if}
		<!--end  Description -->	
		
		<!-- Data sheet -->
			<section class="page-product-box">
				<ul></ul>
					{if isset($features) && $features}
						<h3 class="page-product-heading">{l s='Data sheet'}</h3>
							<table class="table-data-sheet">
									<ul id="idTab2" class="bullet"style="border: 1px solid rgb(234, 234, 234);">
									{foreach from=$features item=feature}
										{if isset($feature.value)}
											<li><span>{$feature.name|escape:'htmlall':'UTF-8'}</span> {$feature.value|escape:'htmlall':'UTF-8'}</li>
										{/if}
									{/foreach}
									</ul>
							{/if}
						</table>
			</section>          
		<!--	End Data sheet -->
			
		<!-- Attachments -->
			<section class="page-product-box">
				<ul></ul>
					{if isset($attachments) && $attachments}
						<h3 class="page-product-heading">{l s='Attachments'}</h3>
							<ul id="idTab9" class="bullet">
								{foreach from=$attachments item=attachment}
									<li><a href="{$link->getPageLink('attachment', true, NULL, "id_attachment={$attachment.id_attachment}")}">{$attachment.name|escape:'htmlall':'UTF-8'}</a><br />{$attachment.description|escape:'htmlall':'UTF-8'}</li>
								{/foreach}
							</ul>
					{/if}
			</section>	
		<!--End Attachments -->		
			
		<!--Accessories -->
			<section class="page-product-box">
				<ul></ul>
					{if isset($accessories) AND $accessories}
						<h3 class="page-product-heading">{l s='Accessories'}</h3>
							<ul id="idTab4" style="border: 1px solid rgb(234, 234, 234);" >
									{foreach from=$accessories item=accessory name=accessories_list}
										{assign var='accessoryLink' value=$link->getProductLink($accessory.id_product, $accessory.link_rewrite, $accessory.category)}
											<li class="ajax_block_product bordercolor {if $smarty.foreach.accessories_list.first}first_item{elseif $smarty.foreach.accessories_list.last}last_item{else}item{/if} product_accessories_description">
												<div class="accessories_desc">
													<a href="{$accessoryLink|escape:'htmlall':'UTF-8'}" title="{$accessory.legend|escape:'htmlall':'UTF-8'}" class="accessory_image product_img_link bordercolor"><img src="{$link->getImageLink($accessory.link_rewrite, $accessory.id_image, 'medium_default')}" alt="{$accessory.legend|escape:'htmlall':'UTF-8'}" width="{$mediumSize.width}" height="{$mediumSize.height}" /></a>
														<h5><a  class="product_link" href="{$accessoryLink|escape:'htmlall':'UTF-8'}">{$accessory.name|escape:'htmlall':'UTF-8'}</a></h5>
															<a class="product_descr" href="{$accessoryLink|escape:'htmlall':'UTF-8'}" title="{l s='More'}" class="product_description">{$accessory.description_short|strip_tags|truncate:120:'...'}</a>
												</div>
												<div class="accessories_price bordercolor">
													{if $accessory.show_price AND !isset($restricted_country_mode) AND !$PS_CATALOG_MODE}<span class="price">{if $priceDisplay != 1}{displayWtPrice p=$accessory.price}{else}{displayWtPrice p=$accessory.price_tax_exc}{/if}</span>{/if}
														{if ($accessory.allow_oosp || $accessory.quantity > 0) AND $accessory.available_for_order AND !isset($restricted_country_mode) AND !$PS_CATALOG_MODE}
															<a class="ajax_add_to_cart_button" href="{$link->getPageLink('cart', true, NULL, "qty=1&id_product={$accessory.id_product|intval}&token={$static_token}&add")}" rel="ajax_id_product_{$accessory.id_product|intval}" title="{l s='Add to cart'}">
																<input style="width: 150px ! important; margin: auto ! important; height: 32px ! important; display: block ! important; text-align: center; background: none repeat scroll 0% 0% rgb(61, 105, 174); font: 12px/35px "Arial" ! important; color: rgb(255, 255, 255) ! important; text-transform: uppercase; cursor: pointer; border-radius: 3px; padding: 0px; border: 0px !important;" class="button_cart_listing" value="Ajouter au panier" type="button">    
															</a>
														{else}
													{/if}
												</div>
											</li>
									{/foreach}
								</ul>
						{/if}
				</section>
			<!--end Accessories -->
			
			<!--HOOK_PRODUCT_TAB -->
				<section class="page-product-box">
					<h3 class="page-product-heading-a">
						{if isset($HOOK_PRODUCT_TAB_CONTENT) && $HOOK_PRODUCT_TAB_CONTENT}{$HOOK_PRODUCT_TAB_CONTENT}{/if}</h3>
				</section>

</div>
{/if}

[NemoPS]

What I meant was that your "reviews" link on the right was pointing to a non existing ID.
You need  to add an ID to your reviews tpl file, so that when you click on the right link, it scrolls there.