Product page layout edit

[Drex]

Hello,

Site: http://devel2.alphabeta.ro/alex/urzeala ... t-produs-3

I want to move the long description (<div class="ph-item-bottom-box">) under the compare button (<div class="ph-pull-right">).

I presume this needs to be done in some php file, but it cant find the right one. Anyone could help?

Thanks!

LE: from my research i think this is the file: components/com_phocacart/views/item/tmpl/default.php
And the code is between 1127-1183 lines:

Code: Select all

	echo '<div class="ph-item-bottom-box">';







	// TABS

	$active 		= $this->s['c']['tabactive'];

	$activeTab 		= $this->s['c']['tabactvietab'];// Not displayed in Bootstrap4

	$tabO	= '';

	$tabLiO	= '';



	// DESCRIPTION

	if (isset($x->description_long) && $x->description_long != '') {

		$tabLiO .= '<li class="'.$this->s['c']['nav-item'].' '.$activeTab.'"><a href="#phdescription" data-toggle="tab" class="'.$this->s['c']['nav-link'].' '.$active.'">'.JText::_('COM_PHOCACART_DESCRIPTION').'</a></li>';



		$tabO 	.= '<div class="'.$this->s['c']['tabpane'].' ph-tab-pane '.$active.'" id="phdescription">';

		$tabO	.= Joomla\CMS\HTML\HTMLHelper::_('content.prepare', $x->description_long);

		$tabO	.= '</div>';

		$active = $activeTab = '';

	}



	// FEATURES

	if (isset($x->features) && $x->features != '') {

		$tabLiO .= '<li class="'.$this->s['c']['nav-item'].' '.$activeTab.'"><a href="#phfeatures" data-toggle="tab" class="'.$this->s['c']['nav-link'].' '.$active.'">'.JText::_('COM_PHOCACART_FEATURES').'</a></li>';



		$tabO 	.= '<div class="'.$this->s['c']['tabpane'].' ph-tab-pane '.$active.'" id="phfeatures">';

		$tabO	.= Joomla\CMS\HTML\HTMLHelper::_('content.prepare', $x->features);

		$tabO	.= '</div>';

		$active = $activeTab = '';

	}

but can't find a way to move it to the right side as requested.

[dmlwebal]

Hi Drex

This is an overall guide as the process will require a bit of work on the CSS and the file structure of the layout - default.php

So, you are on the right path, you will need to create a Joomla override of the file:

components/com_phocacart/views/item/tmpl/default.php

to do so,
copy the contents of /components/com_phocacart/views/item/tmpl

place them in your template folder
/templates/[template_name]/html/com_phocacart/item

So, now you have a copy of default.php in the correct location

The next part requires some idea of HTML structure and a little PHP so that you recognise the code areas that need 'moving'

So, you will need to 'cut' a large chunk of the PHP that you've identified and 'paste' it higher up in the overall layout.

Probably from 1132 to 1725 and then paste it all in to 1122

Then you may have to watch out for any left over open and closing div tags

It should be a case of some CSS after that

Regards
David

[Drex]

Hi Drex

This is an overall guide as the process will require a bit of work on the CSS and the file structure of the layout - default.php

So, you are on the right path, you will need to create a Joomla override of the file:

components/com_phocacart/views/item/tmpl/default.php

to do so,
copy the contents of /components/com_phocacart/views/item/tmpl

place them in your template folder
/templates/[template_name]/html/com_phocacart/item

So, now you have a copy of default.php in the correct location

The next part requires some idea of HTML structure and a little PHP so that you recognise the code areas that need 'moving'

So, you will need to 'cut' a large chunk of the PHP that you've identified and 'paste' it higher up in the overall layout.

Probably from 1132 to 1725 and then paste it all in to 1122

Then you may have to watch out for any left over open and closing div tags

It should be a case of some CSS after that

Regards
David

Hello David,

I've followed your steps, but the output structure of the page didnt change. And i'm sure the override works since i wrote a php print and it shows on the item page correctly.
Any idea how to fix this?

Thanks!

[dmlwebal]

Hi Drex

I have a dev site on which I can test this out. Will try it tomorrow and get back to you

Regards
David

[Drex]

Thanks David!

[dmlwebal]

Sorry for the delay. I had some work come in that needed my attention.

However, tomorrow (17th) I shall be running dev tests on another site and this work fits in quite neatly. So, I should have it done for Sunday (18th)

Regards

David

[Drex]

No problem mate, whenever you have time its ok for me, thanks again!

[dmlwebal]

Hi Drex

I've got a dev server running with a clean install (to allow testing of J3.9.26 with PHP8.03 and the new Gantry5.5beta with Phoca Cart 3.5.7 beta6)

So this link currently heads to a test product page layout. This a default layout in the template I use as a base, but I gather you want the Description/Reviews Tabs to be part of the right hand section on the page and tucked under the add to Cart button?

http://webdev.sites.k-hosting.co.uk/ind ... st-product

Regards
David

[dmlwebal]

So example is this

https://imgur.com/a/j9p7X4y

and you want something like this

https://imgur.com/a/qmvznkN

Regards

David

[Drex]

Hi David,

Yes, exactly right like in the 2nd screenshot.