Contributions

Products Tabs

This Contribution will add a new field to your products with multi language support and plus add a new field which is products_spec so instead of having only description and out everything there you can have description + specification or what ever you name it and its not only that. when customers see your products instead of having a long page with full of texts they will see some tabs with details in them which is much more better than the old way
and also i added a back button in product_info so customer doesnt need to use back button instead there will be a back button next to add_to_cart

Here is the demo

www.gadgetboom.net/store/product_info.php/products_id/59

i hope it will help

any problem email me : hamed@gadgetboom.net

Expand All / Collapse All

Support thread created

25 Dec 2010

This great contribution should have its own thread. It can now be found at:

http://forums.oscommerce.com/topic/368948-contribution-products-tabs/

Search in Products Tabs

2 May 2009

Product Tabs 2.1 and the Fck editor

5 Mar 2009

This is a addon to the Product Tabs 2.1 (Fixed and Full English Version Modified by Waleed Hagag).

I provid this since I thought that the information in the package by Mr Waleed Hagag) didn't work very well regarding how to include the Fck editor.

Include the Fck editor:

1)
Start by download the latest Fck editor from the Fck editor homepage.
2)
Create a new directory in your osCommerce directory named Fckeditor (you can name it whatever you like and place it someware else but then you have to change some of the codes below).
3) Upload all the files in the Fck editor package to this directory.
4) Make the following changes to the admin/include/modules/product_tabs.php file

On the first line add the following:

<?php
require_once("../fckeditor/fckeditor.php") ;
?>

Then replace everything after this:

<ul class="domtabs">
<li><a href="#t1<?=$i?>"><?PHP ECHO TEXT_TAB_DESCRIPTION;?></a></li>
<li><a href="#t2<?=$i?>"><?PHP ECHO TEXT_TAB_SPEC;?></a></li>
<li><a href="#t3<?=$i?>"><?PHP ECHO TEXT_TAB_MUSTHAVE;?></a></li>
<li><a href="#t4<?=$i?>"><?PHP ECHO TEXT_TAB_EXTRAIMAGE;?></a></li>
<li><a href="#t5<?=$i?>"><?PHP ECHO TEXT_TAB_MANUAL;?></a></li>
<li><a href="#t6<?=$i?>"><?PHP ECHO TEXT_TAB_EXTRA1;?></a></li>
<li><a href="#t7<?=$i?>"><?PHP ECHO TEXT_TAB_MOREINFO;?></a></li>
</ul>

With the following:

<div class="tabcontent">
<a name="t1<?=$i?>" id="t1<?=$i?>"></a>
<table border="0" cellspacing="0" cellpadding="1" width="700px">
<tr align="left">
<td valign="top" class="main_white" height="500px"> <?PHP ECHO TEXT_TAB_DESCRIPTION;?><br />
<?php
$oFCKeditor = new FCKeditor('products_description[' . $languages[$i]['id'] . ']');
$oFCKeditor->BasePath = '../fckeditor/' ;
$oFCKeditor->Value = tep_get_products_description($pInfo->products_id, $languages[$i]['id']) ;
$oFCKeditor->Create() ;
?>
</td>
<td><?php //echo TEXT_PRODUCTS_DESCRIPTION; ?><br>
<?php //echo tep_image(DIR_WS_CATALOG_LANGUAGES . $languages[$i]['directory'] . '/images/' . $languages[$i]['image'], $languages[$i]['name']); ?></td>
</tr>
</table>
<a href="#top"></a>
</div>

<div class="tabcontent">
<a name="t2<?=$i?>" id="t2<?=$i?>"></a>
<table border="0" cellspacing="0" cellpadding="1" width="700px">
<tr align="left">
<td valign="top" class="main_white" height="500px"> <?PHP ECHO TEXT_TAB_SPEC;?><br />
<?php
$oFCKeditor = new FCKeditor('products_spec[' . $languages[$i]['id'] . ']');
$oFCKeditor->BasePath = '../fckeditor/' ;
$oFCKeditor->Value = tep_get_products_spec($pInfo->products_id, $languages[$i]['id']) ;
$oFCKeditor->Create() ;
?>
</td>
<td><?php //echo TEXT_PRODUCTS_SPEC; ?><br>
<?php //echo tep_image(DIR_WS_CATALOG_LANGUAGES . $languages[$i]['directory'] . '/images/' . $languages[$i]['image'], $languages[$i]['name']); ?></td>
</tr>
</table>
<a href="#top"></a>
</div>

<div class="tabcontent">
<a name="t3<?=$i?>" id="t3<?=$i?>"></a>
<table border="0" cellspacing="0" cellpadding="1" width="700px">
<tr align="left">
<td valign="top" class="main_white" height="500px"> <?PHP ECHO TEXT_TAB_MUSTHAVE;?><br />
<?php
$oFCKeditor = new FCKeditor('products_musthave[' . $languages[$i]['id'] . ']');
$oFCKeditor->BasePath = '../fckeditor/' ;
$oFCKeditor->Value = tep_get_products_musthave($pInfo->products_id, $languages[$i]['id']) ;
$oFCKeditor->Create() ;
?>
</td>
<td ><?php //echo TEXT_PRODUCTS_MUSTHAVE; ?><br>
<?php //echo tep_image(DIR_WS_CATALOG_LANGUAGES . $languages[$i]['directory'] . '/images/' . $languages[$i]['image'], $languages[$i]['name']); ?></td>
</tr>
</table>
<a href="#top"></a>
</div>

<div class="tabcontent">
<a name="t4<?=$i?>" id="t4<?=$i?>"></a>
<table border="0" cellspacing="0" cellpadding="1" width="700px">
<tr align="left">
<td valign="top" class="main_white" height="500px"> <?PHP ECHO TEXT_TAB_EXTRAIMAGE;?><br />
<?php
$oFCKeditor = new FCKeditor('products_extraimage[' . $languages[$i]['id'] . ']');
$oFCKeditor->BasePath = '../fckeditor/' ;
$oFCKeditor->Value = tep_get_products_extraimage($pInfo->products_id, $languages[$i]['id']) ;
$oFCKeditor->Create() ;
?>
</td>
<td><?php //echo TEXT_PRODUCTS_EXTRAIMAGE; ?><br>
<?php //echo tep_image(DIR_WS_CATALOG_LANGUAGES . $languages[$i]['directory'] . '/images/' . $languages[$i]['image'], $languages[$i]['name']); ?></td>
</tr>
</table>
<a href="#top"></a>
</div>

<div class="tabcontent">
<a name="t5<?=$i?>" id="t5<?=$i?>"></a>
<table border="0" cellspacing="0" cellpadding="1" width="700px">
<tr align="left">
<td valign="top" class="main_white" height="500px"> <?PHP ECHO TEXT_TAB_MANUAL;?><br />
<?php
$oFCKeditor = new FCKeditor('products_manual[' . $languages[$i]['id'] . ']');
$oFCKeditor->BasePath = '../fckeditor/' ;
$oFCKeditor->Value = tep_get_products_manual($pInfo->products_id, $languages[$i]['id']) ;
$oFCKeditor->Create() ;
?>
</td>
<td><?php //echo TEXT_PRODUCTS_MANUAL; ?><br>
<?php //echo tep_image(DIR_WS_CATALOG_LANGUAGES . $languages[$i]['directory'] . '/images/' . $languages[$i]['image'], $languages[$i]['name']); ?></td>
</tr>
</table>
<a href="#top"></a>
</div>

<div class="tabcontent">
<a name="t6<?=$i?>" id="t6<?=$i?>"></a>
<table border="0" cellspacing="0" cellpadding="1" width="700px">
<tr align="left">
<td valign="top" class="main_white" height="500px"> <?PHP ECHO TEXT_TAB_EXTRA1;?><br />
<?php
$oFCKeditor = new FCKeditor('products_extra1[' . $languages[$i]['id'] . ']');
$oFCKeditor->BasePath = '../fckeditor/' ;
$oFCKeditor->Value = tep_get_products_extra1($pInfo->products_id, $languages[$i]['id']) ;
$oFCKeditor->Create() ;
?>
</td>
<td><?php //echo TEXT_PRODUCTS_EXTRA1; ?><br>
<?php //echo tep_image(DIR_WS_CATALOG_LANGUAGES . $languages[$i]['directory'] . '/images/' . $languages[$i]['image'], $languages[$i]['name']); ?></td>
</tr>
</table>
<a href="#top"></a>
</div>
<div class="tabcontent">
<a name="t7<?=$i?>" id="t7<?=$i?>"></a>
<table border="0" cellspacing="0" cellpadding="1" width="700px">
<tr align="left">
<td valign="top" class="main_white" height="500px"> <?PHP ECHO TEXT_TAB_MOREINFO;?><br />
<?php
$oFCKeditor = new FCKeditor('products_moreinfo[' . $languages[$i]['id'] . ']');
$oFCKeditor->BasePath = '../fckeditor/' ;
$oFCKeditor->Value = tep_get_products_moreinfo($pInfo->products_id, $languages[$i]['id']) ;
$oFCKeditor->Create() ;
?>
</td>
<td><?php //echo TEXT_PRODUCTS_MOREINFO; ?><br>
<?php //echo tep_image(DIR_WS_CATALOG_LANGUAGES . $languages[$i]['directory'] . '/images/' . $languages[$i]['image'], $languages[$i]['name']); ?></td>
</tr>
</table>
<a href="#top"></a>
</div>
</td></tr></table>

This it all you have to do to get the Fck editor to work but if you also want to be able to upload images to the tabs then you have to make one more adjustment.

Make the following changes to the fckeditor/editor/filemanager/connectors/php/config.php file:

Find this
$Config['Enabled'] = false ;

Change it to:
$Config['Enabled'] = true ;

That is all, now you will have a Fckeditor that works for you and allows you to edit the tabs.

Boffa

The complete product_tabs.php file is included in the zip package.

Product Tabs 2.1 ( Fixed and Full English Version Modified by Waleed Hagag )

26 Oct 2008

Product Tabs, wyswyg and Header Tags

13 Sep 2008

Product Tabs & HTML Wysiwyg Editor

13 Sep 2008

small update for WYSIWYG HTMLArea MS2 v1.7"

17 Mar 2008

This update for users the contribution "WYSIWYG HTMLArea MS2 v1.7"

*********************************To UPDATE***********************************

1)Open admin/categories.php file

--Find:

editor_generate('products_description[<?php echo $languages[$i]['id']; ?>]',config);
<?php } } ?>
</script>

--And Replace With this lines:

editor_generate('products_description[<?php echo $languages[$i]['id']; ?>]',config);
<?php } } ?>
</script>

<?php
//MaxiDVD Added WYSIWYG HTML Area Box + Admin Function v1.7 - 2.2 MS2 Products Description HTML - </form>
if (HTML_AREA_WYSIWYG_DISABLE == 'Disable') {} else { ?>
<script language="JavaScript1.2" defer>
var config = new Object(); // create new config object
config.width = "<?php echo HTML_AREA_WYSIWYG_WIDTH; ?>px";
config.height = "<?php echo HTML_AREA_WYSIWYG_HEIGHT; ?>px";
config.bodyStyle = 'background-color: <?php echo HTML_AREA_WYSIWYG_BG_COLOUR; ?>; font-family: "<?php echo HTML_AREA_WYSIWYG_FONT_TYPE; ?>"; color: <?php echo HTML_AREA_WYSIWYG_FONT_COLOUR; ?>; font-size: <?php echo HTML_AREA_WYSIWYG_FONT_SIZE; ?>pt;';
config.debug = <?php echo HTML_AREA_WYSIWYG_DEBUG; ?>;
<?php for ($i = 0, $n = sizeof($languages); $i < $n; $i++) { ?>
editor_generate('products_spec[<?php echo $languages[$i]['id']; ?>]',config);
<?php } } ?>
</script>

<?php
//MaxiDVD Added WYSIWYG HTML Area Box + Admin Function v1.7 - 2.2 MS2 Products Description HTML - </form>
if (HTML_AREA_WYSIWYG_DISABLE == 'Disable') {} else { ?>
<script language="JavaScript1.2" defer>
var config = new Object(); // create new config object
config.width = "<?php echo HTML_AREA_WYSIWYG_WIDTH; ?>px";
config.height = "<?php echo HTML_AREA_WYSIWYG_HEIGHT; ?>px";
config.bodyStyle = 'background-color: <?php echo HTML_AREA_WYSIWYG_BG_COLOUR; ?>; font-family: "<?php echo HTML_AREA_WYSIWYG_FONT_TYPE; ?>"; color: <?php echo HTML_AREA_WYSIWYG_FONT_COLOUR; ?>; font-size: <?php echo HTML_AREA_WYSIWYG_FONT_SIZE; ?>pt;';
config.debug = <?php echo HTML_AREA_WYSIWYG_DEBUG; ?>;
<?php for ($i = 0, $n = sizeof($languages); $i < $n; $i++) { ?>
editor_generate('products_musthave[<?php echo $languages[$i]['id']; ?>]',config);
<?php } } ?>
</script>

<?php
//MaxiDVD Added WYSIWYG HTML Area Box + Admin Function v1.7 - 2.2 MS2 Products Description HTML - </form>
if (HTML_AREA_WYSIWYG_DISABLE == 'Disable') {} else { ?>
<script language="JavaScript1.2" defer>
var config = new Object(); // create new config object
config.width = "<?php echo HTML_AREA_WYSIWYG_WIDTH; ?>px";
config.height = "<?php echo HTML_AREA_WYSIWYG_HEIGHT; ?>px";
config.bodyStyle = 'background-color: <?php echo HTML_AREA_WYSIWYG_BG_COLOUR; ?>; font-family: "<?php echo HTML_AREA_WYSIWYG_FONT_TYPE; ?>"; color: <?php echo HTML_AREA_WYSIWYG_FONT_COLOUR; ?>; font-size: <?php echo HTML_AREA_WYSIWYG_FONT_SIZE; ?>pt;';
config.debug = <?php echo HTML_AREA_WYSIWYG_DEBUG; ?>;
<?php for ($i = 0, $n = sizeof($languages); $i < $n; $i++) { ?>
editor_generate('products_extraimage[<?php echo $languages[$i]['id']; ?>]',config);
<?php } } ?>
</script>

<?php
//MaxiDVD Added WYSIWYG HTML Area Box + Admin Function v1.7 - 2.2 MS2 Products Description HTML - </form>
if (HTML_AREA_WYSIWYG_DISABLE == 'Disable') {} else { ?>
<script language="JavaScript1.2" defer>
var config = new Object(); // create new config object
config.width = "<?php echo HTML_AREA_WYSIWYG_WIDTH; ?>px";
config.height = "<?php echo HTML_AREA_WYSIWYG_HEIGHT; ?>px";
config.bodyStyle = 'background-color: <?php echo HTML_AREA_WYSIWYG_BG_COLOUR; ?>; font-family: "<?php echo HTML_AREA_WYSIWYG_FONT_TYPE; ?>"; color: <?php echo HTML_AREA_WYSIWYG_FONT_COLOUR; ?>; font-size: <?php echo HTML_AREA_WYSIWYG_FONT_SIZE; ?>pt;';
config.debug = <?php echo HTML_AREA_WYSIWYG_DEBUG; ?>;
<?php for ($i = 0, $n = sizeof($languages); $i < $n; $i++) { ?>
editor_generate('products_manual[<?php echo $languages[$i]['id']; ?>]',config);
<?php } } ?>
</script>

<?php
//MaxiDVD Added WYSIWYG HTML Area Box + Admin Function v1.7 - 2.2 MS2 Products Description HTML - </form>
if (HTML_AREA_WYSIWYG_DISABLE == 'Disable') {} else { ?>
<script language="JavaScript1.2" defer>
var config = new Object(); // create new config object
config.width = "<?php echo HTML_AREA_WYSIWYG_WIDTH; ?>px";
config.height = "<?php echo HTML_AREA_WYSIWYG_HEIGHT; ?>px";
config.bodyStyle = 'background-color: <?php echo HTML_AREA_WYSIWYG_BG_COLOUR; ?>; font-family: "<?php echo HTML_AREA_WYSIWYG_FONT_TYPE; ?>"; color: <?php echo HTML_AREA_WYSIWYG_FONT_COLOUR; ?>; font-size: <?php echo HTML_AREA_WYSIWYG_FONT_SIZE; ?>pt;';
config.debug = <?php echo HTML_AREA_WYSIWYG_DEBUG; ?>;
<?php for ($i = 0, $n = sizeof($languages); $i < $n; $i++) { ?>
editor_generate('products_extra1[<?php echo $languages[$i]['id']; ?>]',config);
<?php } } ?>
</script>

<?php
//MaxiDVD Added WYSIWYG HTML Area Box + Admin Function v1.7 - 2.2 MS2 Products Description HTML - </form>
if (HTML_AREA_WYSIWYG_DISABLE == 'Disable') {} else { ?>
<script language="JavaScript1.2" defer>
var config = new Object(); // create new config object
config.width = "<?php echo HTML_AREA_WYSIWYG_WIDTH; ?>px";
config.height = "<?php echo HTML_AREA_WYSIWYG_HEIGHT; ?>px";
config.bodyStyle = 'background-color: <?php echo HTML_AREA_WYSIWYG_BG_COLOUR; ?>; font-family: "<?php echo HTML_AREA_WYSIWYG_FONT_TYPE; ?>"; color: <?php echo HTML_AREA_WYSIWYG_FONT_COLOUR; ?>; font-size: <?php echo HTML_AREA_WYSIWYG_FONT_SIZE; ?>pt;';
config.debug = <?php echo HTML_AREA_WYSIWYG_DEBUG; ?>;
<?php for ($i = 0, $n = sizeof($languages); $i < $n; $i++) { ?>
editor_generate('products_moreinfo[<?php echo $languages[$i]['id']; ?>]',config);
<?php } } ?>
</script>

2)And Go to your admin panel and edit your admin -> configuration -> WYSIWYG Editor 1.7 -> Product Description Layout Width -> 700 px

That's All. Enjoy...

no file...