Ocultar descripcion larga en pagina de producto en todos los articulos

[[email protected]]

Buenas tardes.

Lo primero es felicitar a todos los integrantes de la comunidad, la ayuda que se brinda no tiene precio para desarrollar nuestra actividad y a la vez para aprender los vericuetos de esta plataforma de una manera sencilla y practica.

He revisado el foro y demás paginas especializadas con el objetivo de localizar la cuestión que pretendo pero no he conseguido dar con la tecla, me he quedado cerca, pero no es el resultado esperado.

Básicamente lo que busco es ocultar la descripción larga de todos los artículos de mi tienda, para ello he comentado product.tpl y consigo ocultar la pestaña de descripción pero la descripción sigue estando visible cuando se accede al articulo.

El objetivo del cambio es que cuando un usuario acceda a cualquier articulo se vea directamente y de manera predeterminada el detalle ya desplegado y no tenga que clicar el cliente en la pestaña de detalles.

Adjunto fotografía de la web en cuestión con las zonas a cambiar re encuadradas en color rojo.

Por supuesto agradecer de antemano toda la ayuda que llegue y si he incumplido alguna norma del foro por favor comunicadmelo para subsanarlo de manera inmediata.

Un saludo a todos.

 

[Juanjomg]

Muy buenas.

Te doy los pasos para prestashop 1.7 y el theme classic, si tienes otro tendrás que adaptarlo.

Para modificar las pestañas, tienes que ir al fichero product.tpl, y en el bloque product_tabs, es donde se encuentran todas. Primero para desactivar la pestaña “Detalles”, depende de lo que desees hacer, es decir, eliminarla u ocultarla.  El bloque que se va a modificar es el siguiente, justo donde has modificado añadiendo hidden-xs-up:                 

 {if $product.description}
	<li class="nav-item">
		<a
			class="nav-link{if $product.description} active {/if}"
			data-toggle="tab"
			href="#description"
			role="tab"
			aria-controls="description"
			{if !$product.description} aria-selected="true"{/if}>{l s='Description' d='Shop.Theme.Catalog'}</a>
	</li>
{/if}

 Para eliminarlo podemos simplemente borrar todo el código, o modificar la línea:

{if $product.description}

A

{if $product.description && false}

Para ocultarla, sustituimos el código por:

{if $product.description}
	<li class="nav-item hidden-xs-up">
		<a
			class="nav-link{if $product.description} {/if}"
			data-toggle="tab"
			href="#description"
			role="tab"
			aria-controls="description"
		>{l s='Description' d='Shop.Theme.Catalog'}</a>
{/if}

A continuación aparece el código de la pestaña  “Detalles del producto”, la cual vamos a activar:

<li class="nav-item">
	<a
	class="nav-link{if !$product.description} active{/if} "
	data-toggle="tab"
	href="#product-details"
	role="tab"
	aria-controls="product-details"
	{if $product.description} aria-selected="true"{/if}>{l s='Product Details' d='Shop.Theme.Catalog'}</a>
</li>

Modificándolo por:

<li class="nav-item">
	<a
		class="nav-link  active"
		data-toggle="tab"
		href="#product-details"
		role="tab"
		aria-controls="product-details"
		aria-selected="true">{l s='Product Details' d='Shop.Theme.Catalog'}</a>
</li>

 

Ahora pasamos al contenido de las pestañas, en el mismo fichero, tenemos:

<div class="tab-content" id="tab-content">
	<div class="tab-pane fade in{if $product.description} active{/if}" id="description" role="tabpanel">
		{block name='product_description'}
			<div class="product-description">{$product.description nofilter}</div>
		{/block}
</div>

Donde se visualiza la descripción, lo mismo de antes para eliminarlo, dejo la primera línea borrando el resto:

<div class="tab-content" id="tab-content">

 

Y para ocultarlo borro la clase active.

<div class="tab-content" id="tab-content">
	<div class="tab-pane fade " id="description" role="tabpanel">
		{block name='product_description'}
			<div class="product-description">{$product.description nofilter}</div>
		{/block}
</div>

 

Para activar el contenido “Detalles del producto”, a continuación del código anterior vemos que se carga el fichero catalog/_partials/product-details.tpl, si lo editamos tenemos al principio del fichero:

<div class="tab-pane fade{if !$product.description} in active{/if}"
	id="product-details"
	data-product="{$product.embedded_attributes|json_encode}"
	role="tabpanel"
  >

Y para dejarlo activado o visible quedaría:

<div class="tab-pane fade  in active"
	id="product-details"
	data-product="{$product.embedded_attributes|json_encode}"
	role="tabpanel"
>

Espero que te funcione.

[[email protected]]

Buenas tardes.

Muchísimas gracias por tan fantástica y bien detallada respuesta Juanjomg, me ha servido de maravilla, no solo para dejar la web exactamente como quería si no que para comprender un poco mas el funcionamiento, me reafirmo en lo dicho anteriormente, este foro y sus colaboradores sois únicos en atención y desempeño, hacéis la función de ayuda técnica y a la vez de ilustración para comprender el ecosistema Prestashop.

Podemos dar por cerrado el tema, si puedo ayudar en algo con mis mas que limitados conocimientos lo haré encantado.

Un saludo en especial para ti Juanjomg y también para toda la comunidad.